.tag {
    @apply italic font-semibold text-sm bg-teal-500 text-gray-900 rounded-full py-1 px-2 align-middle;

    &:focus {
        @apply outline-none ring bg-teal-800 text-white;
    }

    &:hover {
        @apply bg-teal-800 text-white casual;
    }

    &.disabled {
        @apply pointer-events-none;
    }
}

@screen md {
    .flipped {
        perspective: 1000px;
    }

    .flipped > * {
        transform: rotateY(25deg);
    }
}