.shadow-sm {
    transition: box-shadow 0.4s ease;
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important;
}

.shadow {
    transition: box-shadow 0.4s ease;
    box-shadow: 0 .4rem .8rem rgba(0, 0, 0, .075) !important;
}

.shadow-lg {
    transition: box-shadow 0.4s ease;
    box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175) !important;
}

.spin {
    animation: spin-animation 1s infinite linear;
    display: inline-block;
}

@keyframes spin-animation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(359deg);
    }
}

.pulse {
    position: relative;
    &::after {
        content: '';
        @include var-bg-color('warning');
        position: absolute;
        top: 10px;
        right: 10px;
        width: 7.5px;
        height: 7.5px;
        border-radius: 50%;
        animation: pulse 1s ease-in-out;
        animation-iteration-count: infinite;
    }
}

@keyframes pulse {
    0% {
        -webkit-transform: scale(.1, .1);
        opacity: 0
    }
    50% {
        opacity: 1
    }
    100% {
        -webkit-transform: scale(1.2, 1.2);
        opacity: 0
    }
}

@-webkit-keyframes dropanimate {
    from {
        -webkit-transform: translate3d(0, 6px, 0);
        transform: translate3d(0, 6px, 0);
        opacity: 0
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

@keyframes dropanimate {
    from {
        -webkit-transform: translate3d(0, 6px, 0);
        transform: translate3d(0, 6px, 0);
        opacity: 0
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}