.toast-slide-in {
    animation: slideIn 0.5s ease-in-out;
}

.toast-slide-out {
    animation: slideOut 0.5s ease-in-out;
}

@keyframes slideIn {
    from {
        transform: translateY(100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes slideOut {
    from {
        transform: translateY(0);
        opacity: 1;
    }
    to {
        transform: translateY(100%);
        opacity: 0;
    }
}

.zindex-1 {z-index: 1;}
.zindex-2 {z-index: 2;}
.zindex-3 {z-index: 3;}

.top-1 {top: 1%;}
.top-2 {top: 2%;}
.top-3 {top: 3%;}
.top-4 {top: 4%;}
.top-5 {top: 5%;}
.top-6 {top: 6%;}
.top-7 {top: 7%;}
.top-8 {top: 8%;}
.top-9 {top: 9%;}
.top-10 {top: 10%;}

.start-1 {left: 1%;}
.start-2 {left: 2%;}
.start-3 {left: 3%;}
.start-4 {left: 4%;}
.start-5 {left: 5%;}
.start-6 {left: 6%;}
.start-7 {left: 7%;}
.start-8 {left: 8%;}
.start-9 {left: 9%;}
.start-10 {left: 10%;}

@media (max-width: 768px) {

}

@media (max-width: 480px) {

}