/*	--------------------------------------------------------
 * 	Theme: Grey Red		  Base colour: #393333    Version: 3
 *  --------------------------------------------------------
 *  Designed for CumulusMX Version 3.10.1 and above.
 *  Produced using w3Schools colour generator
 *  ---------------------------------------------------------
 * 	Author: Neil Thomas		Last edit:	25th Sept 2021
 *	---------------------------------------------------------

*	Theme Colour Variable Definitions	*/
:root {
	--l5: #f4f2f2;
	--l4: #d9d4d4;
	--l3: #b3aaaa;
	--l2: #8d7f7f;
	--l1: #635858;
	--theme: #393333;
	--d1: #332d2d;
	--d2: #2d2828;
	--d3: #282323;
	--d4: #221e1e;
	--d5: #1c1919;
	--modal: rgba(60, 51, 51, 0.3);
}

/*  Theme colour combinations (Foreground / Background)    */
.w3-theme-light,
.w3-theme-l5    {color: var(--d5); background-color: var(--l5);}
.w3-theme-l4    {color: var(--d5); background-color: var(--l4);}
.w3-theme-l3    {color: var(--d5); background-color: var(--l3);}
.w3-theme-l2    {color: var(--l5); background-color: var(--l2);}
.w3-theme-l1    {color: var(--l5); background-color: var(--l1);}
.w3-theme       {color: var(--l5); background-color: var(--theme);}
.w3-theme-d1    {color: var(--l5); background-color: var(--d1);}
.w3-theme-d2    {color: var(--l5); background-color: var(--d2);}
.w3-theme-d3    {color: var(--l5); background-color: var(--d3);}
.w3-theme-d4    {color: var(--l5); background-color: var(--d4);}
.w3-theme-d5,
.w3-theme-dark	{color: var(--l5); background-color: var(--d5);}

.w3-theme-white {color: var(--d5); background-color:#ffffff;}
.w3-theme-action {color: var(--d3); background-color: var(--l3);}

/*	heme colour combinations for HOVER effects (Foreground / Background)	*/
.w3-theme-light-hvr:hover,
.w3-theme-l5-hvr:hover 		{color: var(--d5); background-color: var(--l5);}
.w3-theme-l4-hvr:hover 		{color: var(--d5); background-color: var(--l4);}
.w3-theme-l3-hvr:hover 		{color: var(--d5); background-color: var(--l3);}
.w3-theme-l2-hvr:hover 		{color: var(--d5); background-color: var(--l2);}
.w3-theme-l1-hvr:hover 		{color: var(--l5); background-color: var(--l1);}
.w3-theme-hvr:hover 		{color: var(--l5); background-color:var(--theme); }
.w3-theme-d1-hvr:hover 		{color: var(--l5); background-color: var(--d1);}
.w3-theme-d2-hvr:hover 		{color: var(--l5); background-color: var(--d2);}
.w3-theme-d3-hvr:hover 		{color: var(--l5); background-color: var(--d3);}
.w3-theme-d4-hvr:hover 		{color: var(--l5); background-color: var(--d4);}
.w3-theme-d5-hvr:hover,
.w3-theme-dark-hvr:hover	{color: var(--l5); background-color: var(--d5);}

.w3-theme-action-hvr:hover	{color: var(--l3); background-color: var(--d3);}

/*	Theme TEXT only colours	*/
.w3-theme-light-txt,
.w3-theme-l5-txt	{color: var(--l5);}
.w3-theme-l4-txt	{color: var(--l4);}
.w3-theme-l3-txt	{color: var(--l3);}
.w3-theme-l2-txt	{color: var(--l2);}
.w3-theme-l1-txt	{color: var(--l1);}
.w3-theme-txt		{color: var(--theme);}
.w3-theme-d1-txt	{color: var(--d1);}
.w3-theme-d2-txt	{color: var(--d2);}
.w3-theme-d3.txt	{color: var(--d3);}
.w3-theme-d4-txt	{color: var(--d4);}
.w3-theme-d5-txt,
.w3-theme-dark-txt	{color: var(--d5);}

/*	Theme TEXT only HOVER colours	*/
.w3-theme-light-txt-hvr:hover,
.w3-theme-l5-txt-hvr:hover		{color: var(--l5);}
.w3-theme-txt-hvr:hover			{color: var(--theme);}
.w3-theme-d5-txt-hvr:hover,
.w3-theme-dark-txt-hvr:hover	{color: var(--d5);}

/*	Theme BORDER only colours	*/
.w3-theme-light-bdr,
.w3-theme-l5-bdr	{border-color: var(--l5);}
.w3-theme-l4-bdr	{border-color: var(--l4);}
.w3-theme-l3-bdr	{border-color: var(--l3);}
.w3-theme-l2-bdr	{border-color: var(--l2);}
.w3-theme-l1-bdr	{border-color: var(--l1);}
.w3-theme-bdr		{border-color: var(--theme);}
.w3-theme-d1-bdr	{border-color: var(--d1);}
.w3-theme-d2-bdr	{border-color: var(--d2);}
.w3-theme-d3-bdr	{border-color: var(--d3);}
.w3-theme-d4-bdr	{border-color: var(--d4);}
.w3-theme-d5-bdr,
.w3-theme-dark-bdr	{border-color: var(--d5);}

/*	Theme BORDER only HOVER colours	*/
.w3-theme-light-bdr:hover,
.w3-theme-l5-bdr-hvr:hover		{border-color: var(--l5); }
.w3-theme-bdr-hvr:hover 		{border-color: var(--theme);}
.w3-theme-d5-bdr-hvr:hover,
.w3-theme-dark-bdr-hvr:hover	{border-color: var(--d5);}

/*	Theme Modal Window Background	*/
.at-theme-modal {
	background-color: var(--theme);
	background-color: var(--modal);
}