@-webkit-keyframes fade-in {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes fade-in {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-webkit-keyframes fade-out {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@keyframes fade-out {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

@-webkit-keyframes radio-activate{
    0% {
        background: radial-gradient(circle at center, #676E73 0%, rgba( 255, 225 , 225, 0 ) 0%, rgba( 255, 225 , 225, 0 ) 100%);
    }
    10% {
        background: radial-gradient(circle at center, #676E73 10%, rgba( 255, 225 , 225, 0 ) 11%, rgba( 255, 225 , 225, 0 ) 100%);
    }
    25% {
        background: radial-gradient(circle at center, #676E73 24%, rgba( 255, 225 , 225, 0 ) 25%, rgba( 255, 225 , 225, 0 ) 100%);
    }
    40% {
        background: radial-gradient(circle at center, #676E73 40%, rgba( 255, 225 , 225, 0 ) 41%, rgba( 255, 225 , 225, 0 ) 100%);
    }
    50% {
        background: radial-gradient(circle at center, #676E73 49%, rgba( 255, 225 , 225, 0 ) 50%, rgba( 255, 225 , 225, 0 ) 100%);
    }
    60% {
        background: radial-gradient(circle at center, #676E73 60%, rgba( 255, 225 , 225, 0 ) 61%, rgba( 255, 225 , 225, 0 ) 100%);
    }
    75% {
        background: radial-gradient(circle at center, #676E73 74%, rgba( 255, 225 , 225, 0 ) 75%, rgba( 255, 225 , 225, 0 ) 100%);
    }
    90% {
        background: radial-gradient(circle at center, #676E73 90%, rgba( 255, 225 , 225, 0 ) 91%, rgba( 255, 225 , 225, 0 ) 100%);
    }
    100% {
        background: radial-gradient(circle at center, #676E73 99%, rgba( 255, 225 , 225, 0 ) 100%, rgba( 255, 225 , 225, 0 ) 100%);
    }
}
@keyframes radio-activate {
    0% {
        background: radial-gradient(circle at center, #676E73 0%, rgba( 255, 225 , 225, 0 ) 0%, rgba( 255, 225 , 225, 0 ) 100%);
    }
    10% {
        background: radial-gradient(circle at center, #676E73 10%, rgba( 255, 225 , 225, 0 ) 11%, rgba( 255, 225 , 225, 0 ) 100%);
    }
    25% {
        background: radial-gradient(circle at center, #676E73 24%, rgba( 255, 225 , 225, 0 ) 25%, rgba( 255, 225 , 225, 0 ) 100%);
    }
    40% {
        background: radial-gradient(circle at center, #676E73 40%, rgba( 255, 225 , 225, 0 ) 41%, rgba( 255, 225 , 225, 0 ) 100%);
    }
    50% {
        background: radial-gradient(circle at center, #676E73 49%, rgba( 255, 225 , 225, 0 ) 50%, rgba( 255, 225 , 225, 0 ) 100%);
    }
    60% {
        background: radial-gradient(circle at center, #676E73 60%, rgba( 255, 225 , 225, 0 ) 61%, rgba( 255, 225 , 225, 0 ) 100%);
    }
    75% {
        background: radial-gradient(circle at center, #676E73 74%, rgba( 255, 225 , 225, 0 ) 75%, rgba( 255, 225 , 225, 0 ) 100%);
    }
    90% {
        background: radial-gradient(circle at center, #676E73 90%, rgba( 255, 225 , 225, 0 ) 91%, rgba( 255, 225 , 225, 0 ) 100%);
    }
    100% {
        background: radial-gradient(circle at center, #676E73 99%, rgba( 255, 225 , 225, 0 ) 100%, rgba( 255, 225 , 225, 0 ) 100%);
    }
}

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

/* VUE JS Transitions */

.slideFade-enter-active, .slideFade-leave-active {
  transition: .5s;
}
.slideFade-enter, .slideFade-leave-to{
  opacity: 0;
}

.expand-enter-active,
.expand-leave-active {
  transition: height 0.5s ease-in-out, opacity 0.5s ease-in-out;
  overflow: hidden;
}
.expand-enter,
.expand-leave-to {
  height: 0;
  opacity: 0;
}