.particle-outer-container
{
    left:50%;
    position:absolute;
    top:50%;
    transform:translate(-50%, -50%);
}

.particle-container
{
    filter:blur(0.4px);
    -webkit-filter:blur(0.4px);
    width:100px;
    height:100px;
}

.particle-outer-container.fire .particle-container .particle
{
    animation:rise 1s ease-in infinite;
    background-image:radial-gradient(#ff5000 30%, rgba(255, 80, 0, 0) 70%);
    border-radius:50%;
    mix-blend-mode:screen;
    opacity:0;
    position:absolute;
    bottom:0;
    width:90px;
    height:90px;
}

.particle-outer-container.smoke .particle-container .particle
{
    animation:rise 2s ease-in infinite;
    background-image:radial-gradient(#313030 30%, rgba(255, 80, 0, 0) 70%);
    border-radius:50%;
    mix-blend-mode:screen;
    opacity:0;
    position:absolute;
    bottom:0;
    width:90px;
    height:90px;
}

.particle-text
{
    color:#000000;
    position:absolute;
    left:50%;
    top:5px;
    text-shadow:1px 1px 2px #878787, 0 0 1em #00e7ff, 0 0 0.2em #484848;
    font-size:50px;
    text-align:center;
    font-family:Jost;
}

.particle-small-text
{
    color:#000000;
    position:absolute;
    left:50%;
    top:0px;
    font-size:14px;
    text-align:center;
    font-family:Jost;
}

.particle-outer-container
{
    zoom:0.7;
}

@media (max-width: 500px)
{
    .particle-outer-container
	{
        zoom:0.6;
    }
}

@keyframes rise
{
    from
	{
        opacity:0;
        transform:translateY(0) scale(1);
    }
    25%
	{
        opacity:1;
    }
    to
	{
        opacity:0;
        transform:translateY(-10em) scale(0);
    }
}

@keyframes fly-away
{
    0%
	{
        opacity:1;
        filter:blur(1px);
    }
    100%
	{
        transform:scale(0.3);
        opacity:0;
        filter:blur(20px);
        border-radius:50%;
    }
}