:root {
    --text-color: var(--zinc-900);
    --background-color: var(--red-050);

    --nav-text-color: var(--zinc-200);
    --nav-background-color: var(--red-950);
    --nav-text-color-hover: var(--red-100);
    --nav-background-color-hover: var(--red-700);
    --nav-text-color-current: var(--zinc-100);
    --nav-background-color-current: var(--red-800);
}

/* ============================================================================ */

#videos {
    padding: var(--gap) 0;

    content {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: stretch;
        gap: var(--gap-x2);
    }

    video
    {
        width: 320px;
        aspect-ratio: 16 / 9;
        cursor: pointer;
        box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.95), 0 0 20px 0px rgba(0, 0, 0, 0.5);
        transition: 0.5s ease-in-out;
    }

    video:hover {
        box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.95);
    }
}