.btn {
    @apply font-semibold py-2 px-4 rounded;

    &:focus {
        @apply outline-none shadow-outline;
    }
}

.btn-teal {
    @apply bg-teal-500 text-white;

    &:focus {
        @apply bg-teal-600;
    }

    &:hover {
        @apply bg-teal-600;
    }
}

.btn-green {
    @apply bg-green-500 text-white;

    &:focus {
        @apply bg-green-600;
    }

    &:hover {
        @apply bg-green-600;
    }
}

.btn-red {
    @apply bg-red-500 text-white;

    &:focus {
        @apply bg-red-600;
    }

    &:hover {
        @apply bg-red-600;
    }
}