@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap');

@tailwind base;
@tailwind components;
@tailwind utilities;

* {
    scroll-behavior: smooth;
    /* outline: 1px solid red; */
}
.font-lato {
    font-family: 'Lato', sans-serif;
}
.list::before {
    content: "-";
    margin-right: 5px;
}

/* @keyframes loading {
    0% {
        transform: rotate(0deg);
    }10% {
        transform: rotate(-30deg);
    }
    100% {
        transform: rotate(360deg);
    }
} */

@keyframes loading {
    0% {
        transform: rotate(0deg);
    }
    20% {
        transform: rotate(-45deg);
    }
    80% {
        transform: rotate(360deg); /* Pause at the end */
    }
    100% {
        transform: rotate(360deg); /* Pause at the end */
    }
}


.loading {
    will-change: transform;
    animation: loading 2s cubic-bezier(0.42, 0, 0.58, 1) infinite 350ms;
    /* animation-timing-function: ease-in-out; */
}