@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Fredoka+One&display=swap');

:root {




    /* FONT */

    /*--FONT_FAMILY: 'Fredoka One', cursive;
    --SECOND_FONT_FAMILY: 'Roboto', sans-serif;

    --FONT_COLOR: hsla(0, 100%, 100%, 1);
    --SECOND_FONT_COLOR: hsla(0, 100%, 100%, 1);


    --POSITIVE_COLOR: hsla(125, 100%, 43.75%, 1);


    --NEGATIVE_COLOR: hsla(0, 100%, 60%, 1);

    --circle_color: hsla(150, 100%, 100%, 1);
    --sb_current_turn_color: hsla(140, 100%, 43.5%, 1);

    --POSITIVE_HOVER: hsla(100, 100%, 100%, 0.5);

    --BOX_BACKGROUND: hsla(0, 0%, 100%, 0.25);
    --BOX_SHADOW: 0vmax 0vmax 0.5vmax 0.25vmax hsla(0, 100%, 0%, 0.125);


    --FRAGMENT_COLOR: hsl(50, 100%, 100%);

    --Neutral: hsla(200, 100%, 50%, 1);

    --Negative: hsla(125, 100%, 100%, 0.25);


    --BACKGROUND_COLOR: hsl(212.5, 100%, 25%, 1);


    --BGS_Main_Color: hsla(200, 100%, 50%, 0.1);
    --BGS_Second_Color: hsla(200, 100%, 50%, 0.2);



    --PLACEHOLDER_COLOR: hsl(0, 0%, 43.75%);
    --TRANSITION: 200ms;
    --BORDER_RADIUS: 0.5vmax;

    --Blur: 0.25vmax;*/


    --FONT_FAMILY: 'Fredoka One', cursive;
    --SECOND_FONT_FAMILY: 'Roboto', sans-serif;

    --FONT_COLOR: hsla(0, 100%, 100%, 1);
    --SECOND_FONT_COLOR: hsla(0, 100%, 100%, 1);


    --POSITIVE_COLOR: hsla(125, 100%, 43.75%, 1);
    --BLITZ_COLOR: hsla(275, 100%, 43.75%, 1);


    --NEGATIVE_COLOR: hsla(0, 100%, 60%, 1);

    --circle_color: hsla(150, 100%, 100%, 1);
    --sb_current_turn_color: hsla(140, 100%, 43.5%, 1);

    --POSITIVE_HOVER: hsla(100, 100%, 100%, 0.5);

    --BOX_BACKGROUND: hsla(0, 0%, 100%, 0.25);
    --BOX_SHADOW: 0vmax 0vmax 4px 2px hsla(0, 100%, 0%, 0.125);


    --FRAGMENT_COLOR: hsl(50, 100%, 100%);

    --Neutral: hsla(200, 100%, 50%, 1);

    --Negative: hsla(125, 100%, 100%, 0.25);


    --BACKGROUND_COLOR: hsl(212.5, 100%, 25%, 1);


    --BGS_Main_Color: hsla(200, 100%, 50%, 0.15);
    --BGS_Second_Color: hsla(200, 100%, 50%, 0.3);


    --PLACEHOLDER_COLOR: hsl(0, 0%, 43.75%);
    --TRANSITION: 200ms;
    --BORDER_RADIUS: 8px;

    --Blur: 0.25vmax;







}