/* ==========================================================
   SPANK STUDIO
   DESIGN SYSTEM
   VARIABLES
========================================================== */

:root{

    /* COLORS */

    --spank-bg:#F3F3F1;
    --spank-text:#111111;
    --spank-white:#ffffff;



    /* SPACING */

    --space-xs:20px;
    --space-s:40px;
    --space-m:80px;
    --space-l:140px;
    --space-xl:220px;



    /* MEDIA WIDTH */

    --media-xs:22%;
    --media-s:30%;
    --media-m:38%;
    --media-l:46%;
    --media-xl:58%;



    /* TRANSITIONS */

    --transition:.45s ease;



    /* Z INDEX */

    --z-background:1;
    --z-media:5;
    --z-fixed:20;
    --z-menu:100;

}