/******* Variables */

:root {

/* Colours */

--color-primary: #141414;


--color-secondary: #252525;


--color-tertiary: #181818;


--color-quaternary: #0c1924;


--color-quinary: #252422;


--color-white: #ffffff;


--color-black: #000000;


--color-lightgray: #f2f2f2;


--color-woopagecolor: #353535;




--color-link: var(--color-primary);



--color-text-main: var(--color-white);




--color-text-headings: var(--color-white);




/* Typography */






--font-: ABeeZee;



--col-gap: 3rem;


}
/******* END Variables */


/******* Color Utils */

.text-primary,
.text-primary:visited,
.text-primary:hover {
color: var(--color-primary);
}

.bg-primary,
.bg-primary:hover {
background-color: var(--color-primary);
}



.text-secondary,
.text-secondary:visited,
.text-secondary:hover {
color: var(--color-secondary);
}

.bg-secondary,
.bg-secondary:hover {
background-color: var(--color-secondary);
}



.text-tertiary,
.text-tertiary:visited,
.text-tertiary:hover {
color: var(--color-tertiary);
}

.bg-tertiary,
.bg-tertiary:hover {
background-color: var(--color-tertiary);
}



.text-quaternary,
.text-quaternary:visited,
.text-quaternary:hover {
color: var(--color-quaternary);
}

.bg-quaternary,
.bg-quaternary:hover {
background-color: var(--color-quaternary);
}



.text-quinary,
.text-quinary:visited,
.text-quinary:hover {
color: var(--color-quinary);
}

.bg-quinary,
.bg-quinary:hover {
background-color: var(--color-quinary);
}



.text-white,
.text-white:visited,
.text-white:hover {
color: var(--color-white);
}

.bg-white,
.bg-white:hover {
background-color: var(--color-white);
}



.text-black,
.text-black:visited,
.text-black:hover {
color: var(--color-black);
}

.bg-black,
.bg-black:hover {
background-color: var(--color-black);
}



.text-lightgray,
.text-lightgray:visited,
.text-lightgray:hover {
color: var(--color-lightgray);
}

.bg-lightgray,
.bg-lightgray:hover {
background-color: var(--color-lightgray);
}



.text-woopagecolor,
.text-woopagecolor:visited,
.text-woopagecolor:hover {
color: var(--color-woopagecolor);
}

.bg-woopagecolor,
.bg-woopagecolor:hover {
background-color: var(--color-woopagecolor);
}


.text-link {
color: var(--color-primary);
}
/******* END Color Utils */
