.NiceBox {
    box-shadow: rgba(136, 165, 191, 0.48) 6px 2px 8px 0px, rgba(255, 255, 255, 0.8) -6px -2px 8px 0px;
    padding: 10px;
}

.Chunky
{
    font-size:1.25em !important;
}

.loginbutton {
    display: flex;
    justify-content: center;
    align-items: center;
    border: none;
    color: white;
    align-content: center;
    text-align: center;
    text-decoration: none;
    height: 25px;
    font-size: 1em;
    margin-top: -12px;
    cursor: pointer;
    max-height: 25px;
}

#search {
    display: grid;
    grid-area: search;
    grid-template:
        "search" 50px
        / 300px;
    justify-content: center;
    align-content: center;
    justify-items: stretch;
    align-items: stretch;
    background: hsl(0, 0%, 22%);
}

    #search input {
        display: block;
        grid-area: search;
        -webkit-appearance: none;
        appearance: none;
        width: 100%;
        height: 100%;
        background: none;
        padding: 0 30px 0 60px;
        border: none;
        border-radius: 100px;
        font: 24px/1 system-ui, sans-serif;
        outline-offset: -8px;
    }


    #search svg {
        grid-area: search;
        overflow: visible;
        color: hsl(0, 0%, 90%);
        fill: none;
        stroke: currentColor;
    }

.spark {
    fill: currentColor;
    stroke: none;
    r: 15;
}

    .spark:nth-child(1) {
        animation: spark-radius 2.03s 1s both, spark-one-motion 2s 1s both;
    }

@keyframes spark-radius {
    0% {
        r: 0;
        animation-timing-function: cubic-bezier(0, 0.3, 0, 1.57)
    }

    30% {
        r: 15;
        animation-timing-function: cubic-bezier(1, -0.39, 0.68, 1.04)
    }

    95% {
        r: 8
    }

    99% {
        r: 10
    }

    99.99% {
        r: 7
    }

    100% {
        r: 0
    }
}

@keyframes spark-one-motion {
    0% {
        transform: translate(-20%, 50%);
        animation-timing-function: cubic-bezier(0.63, 0.88, 0, 1.25)
    }

    20% {
        transform: rotate(-0deg) translate(0%, -50%);
        animation-timing-function: ease-in
    }

    80% {
        transform: rotate(-230deg) translateX(-20%) rotate(-100deg) translateX(15%);
        animation-timing-function: linear
    }

    100% {
        transform: rotate(-360deg) translate(30px, 100%);
        animation-timing-function: cubic-bezier(.64,.66,0,.51)
    }
}

.spark:nth-child(2) {
    animation: spark-radius 2.03s 1s both, spark-two-motion 2.03s 1s both;
}

@keyframes spark-two-motion {
    0% {
        transform: translate(120%, 50%) rotate(-70deg) translateY(0%);
        animation-timing-function: cubic-bezier(0.36, 0.18, 0.94, 0.55)
    }

    20% {
        transform: translate(90%, -80%) rotate(60deg) translateY(-80%);
        animation-timing-function: cubic-bezier(0.16, 0.77, 1, 0.4)
    }

    40% {
        transform: translate(110%, -50%) rotate(-30deg) translateY(-120%);
        animation-timing-function: linear
    }

    70% {
        transform: translate(100%, -50%) rotate(120deg) translateY(-100%);
        animation-timing-function: linear
    }

    80% {
        transform: translate(95%, 50%) rotate(80deg) translateY(-150%);
        animation-timing-function: cubic-bezier(.64,.66,0,.51)
    }

    100% {
        transform: translate(100%, 50%) rotate(120deg) translateY(0%)
    }
}

.spark:nth-child(3) {
    animation: spark-radius 2.05s 1s both, spark-three-motion 2.03s 1s both;
}

@keyframes spark-three-motion {
    0% {
        transform: translate(50%, 100%) rotate(-40deg) translateX(0%);
        animation-timing-function: cubic-bezier(0.62, 0.56, 1, 0.54)
    }

    30% {
        transform: translate(40%, 70%) rotate(20deg) translateX(20%);
        animation-timing-function: cubic-bezier(0, 0.21, 0.88, 0.46)
    }

    40% {
        transform: translate(65%, 20%) rotate(-50deg) translateX(15%);
        animation-timing-function: cubic-bezier(0, 0.24, 1, 0.62)
    }

    60% {
        transform: translate(60%, -40%) rotate(-50deg) translateX(20%);
        animation-timing-function: cubic-bezier(0, 0.24, 1, 0.62)
    }

    70% {
        transform: translate(70%, -0%) rotate(-180deg) translateX(20%);
        animation-timing-function: cubic-bezier(0.15, 0.48, 0.76, 0.26)
    }

    100% {
        transform: translate(70%, -0%) rotate(-360deg) translateX(0%) rotate(180deg) translateX(20%);
    }
}




.burst {
    stroke-width: 3;
}

    .burst :nth-child(2n) {
        color: #ff783e
    }

    .burst :nth-child(3n) {
        color: #ffab00
    }

    .burst :nth-child(4n) {
        color: #55e214
    }

    .burst :nth-child(5n) {
        color: #82d9f5
    }

.circle {
    r: 6;
}

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

.triangle {
    d: path("M0,-6 L7,6 L-7,6 Z");
    stroke-linejoin: round;
}

.plus {
    d: path("M0,-5 L0,5 M-5,0L 5,0");
    stroke-linecap: round;
}




.burst:nth-child(4) {
    transform: translate(30px, 100%) rotate(150deg);
}

.burst:nth-child(5) {
    transform: translate(50%, 0%) rotate(-20deg);
}

.burst:nth-child(6) {
    transform: translate(100%, 50%) rotate(75deg);
}

.burst * {
}

@keyframes particle-fade {
    0%, 100% {
        opacity: 0
    }

    5%, 80% {
        opacity: 1
    }
}

.burst :nth-child(1) {
    animation: particle-fade 600ms 2.95s both, particle-one-move 600ms 2.95s both;
}

.burst :nth-child(2) {
    animation: particle-fade 600ms 2.95s both, particle-two-move 600ms 2.95s both;
}

.burst :nth-child(3) {
    animation: particle-fade 600ms 2.95s both, particle-three-move 600ms 2.95s both;
}

.burst :nth-child(4) {
    animation: particle-fade 600ms 2.95s both, particle-four-move 600ms 2.95s both;
}

.burst :nth-child(5) {
    animation: particle-fade 600ms 2.95s both, particle-five-move 600ms 2.95s both;
}

.burst :nth-child(6) {
    animation: particle-fade 600ms 2.95s both, particle-six-move 600ms 2.95s both;
}

@keyframes particle-one-move {
    0% {
        transform: rotate(0deg) translate(-5%) scale(0.0001, 0.0001)
    }

    100% {
        transform: rotate(-20deg) translateX(8%) scale(0.5, 0.5)
    }
}

@keyframes particle-two-move {
    0% {
        transform: rotate(0deg) translate(-5%) scale(0.0001, 0.0001)
    }

    100% {
        transform: rotate(0deg) translateX(8%) scale(0.5, 0.5)
    }
}

@keyframes particle-three-move {
    0% {
        transform: rotate(0deg) translate(-5%) scale(0.0001, 0.0001)
    }

    100% {
        transform: rotate(20deg) translateX(8%) scale(0.5, 0.5)
    }
}

@keyframes particle-four-move {
    0% {
        transform: rotate(0deg) translate(-5%) scale(0.0001, 0.0001)
    }

    100% {
        transform: rotate(-35deg) translateX(12%)
    }
}

@keyframes particle-five-move {
    0% {
        transform: rotate(0deg) translate(-5%) scale(0.0001, 0.0001)
    }

    100% {
        transform: rotate(0deg) translateX(12%)
    }
}

@keyframes particle-six-move {
    0% {
        transform: rotate(0deg) translate(-5%) scale(0.0001, 0.0001)
    }

    100% {
        transform: rotate(35deg) translateX(12%)
    }
}



.bar {
    width: 100%;
    height: 100%;
    ry: 50%;
    stroke-width: 10;
    animation: bar-in 900ms 3s both;
}

@keyframes bar-in {
    0% {
        stroke-dasharray: 0 180 0 226 0 405 0 0
    }

    100% {
        stroke-dasharray: 0 0 181 0 227 0 405 0
    }
}

.magnifier {
    animation: magnifier-in 600ms 3.6s both;
    transform-box: fill-box;
}

@keyframes magnifier-in {
    0% {
        transform: translate(20px, 8px) rotate(-45deg) scale(0.01, 0.01);
    }

    50% {
        transform: translate(-4px, 8px) rotate(-45deg);
    }

    100% {
        transform: translate(0px, 0px) rotate(0deg);
    }
}

.magnifier .glass {
    cx: 27;
    cy: 27;
    r: 8;
    stroke-width: 3;
}

.magnifier .handle {
    x1: 32;
    y1: 32;
    x2: 44;
    y2: 44;
    stroke-width: 3;
}


@font-face {
    font-family: 'Toast_icons';
    src: url(data:application/x-font-ttf;charset=utf-8;base64,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) format('truetype');
    font-weight: normal;
    font-style: normal;
}

.toast-icons {
    font-family: 'Toast_icons' !important;
    speak: none;
    font-size: 55px;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.e-toast-container .e-toast .e-toast-message .e-toast-title{
    color:red !important;
    font-size:18px;
    font-weight:bold;
}

#toast_custom .e-toast .e-toast-title,
#toast_custom .e-toast .e-toast-message,
#toast_custom .e-toast .e-toast-message .e-toast-content,
#toast_custom .e-toast .e-toast-close-icon {
    color: #000;
    background-color: hsl(0, 0%, 22%);
}

#toast_custom .e-toast-container .e-toast .e-toast-message .e-toast-content {
    padding: 14px 0 0 0;
}

#toast_custom .e-toast-template {
    display: inline-flex;
}

#toast_custom .e-toast-icon.e-toast-image {
    border-radius: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    height: 50px !important;
    width: 50px !important;
    background-size: 50px 50px;
    align-self: center;
}

#toast_custom .camden .e-toast-icon.e-toast-image,
#toast_custom .chase .e-toast-icon.e-toast-image {
    width: 65px !important;
}

#template_toast .horizontal-align .toast-content .toast-title {
    font-weight: 500;
    color: black;
}

#template_toast .horizontal-align .toast-content .toast-message {
    opacity: 0.75;
    color: #000;
}

#template_toast .toast-icons {
    font-size: 35px;
    height: auto;
    margin: auto;
}

#template_toast .horizontal-align {
    display: inline-flex;
    flex-direction: row;
    width: 100%;
}

    #template_toast .horizontal-align .toast-content {
        display: inline-flex;
        flex: 1;
        flex-direction: column;
        margin-left: 10px;
    }