{{ if department_id }}
    <a href="{{ url }}" x-data="{ shown: false }" x-intersect="shown = true" class="w-6/12 mb-8 md:mb-0 md:w-3/12 px-4 text-left">

        {{ collection:your_storyz_videos taxonomy:contains="{id}" }}
        {{ if video_thumbnail }}
        <div class="transition-all duration-300" x-show="shown" x-transition:enter-start="translate-y-12 transition opacity-0" x-transition:enter-end="translate-y-0 opacity-100 transition">         
            <div class="relative mb-4">
                <img src="{{ video_thumbnail }}" alt="{{ title }}" class="w-full">        
                <span class="absolute bottom-0 left-0 bg-purple text-white font-bold py-2 px-4">
                    {{ count }} video's
                </span>
            </div>
            <h3 class="font-bold mb-2 text-lg">{{ title }}</h3>
            <p>{{ description }}</p>
        </div>
        {{ /if }}
    {{ /collection:your_storyz_videos }}
    </a>
{{ /if }}