:root {
    --whitecolor: #FFFFFF;					/* rgb 255, 255, 266 */
	--softwhitecolor: #F8F9FA;				/* rgb 248, 249, 250 */
	--blackcolor:  #000000;					/* rgb 0, 0, 0 */
	--vlightgreycolor:  #F4f4f4;			/* rgb 244, 244, 244 */
	--lightgreycolor:  #CED4DA;			    /* rgb 206, 212, 218 */
	--lightgreyhovercolor: #B9BFC4;			/* rgb 185, 191, 196 */
	--greycolor: #B7BFC7;					/* rgb 183, 191, 199 */
	--darkgreycolor:#212529;				/* rgb 33, 37, 41 */
	--darkbluecolor: #001991;				/* rgb 0, 25, 145 */
    --darkbluehovercolor: #00105E;		    /* rgb 0, 15, 130 */
	--lightbluecolor: #14BFFD;				/* rgb 20, 192, 253 */
	--lightbluehovercolor: #71ACFD;		    /* rgb 113, 172, 253 */ 
	--vlightbluecolor: #C8E1FF;				/* rgb 200, 225, 255 */ 
	--lightyellowcolor:#FFFFF0;             /* rgb 255, 255, 240 */
	--yellowcolor: #FFFF00;					/* rgb 255, 255, 0 */	
	--redcolor: #FF3B30;					/* rgb 255, 59, 48 */ 
	--vlightredcolor: #FFD6D6;				/* rgb 255, 214, 214 */
	--greencolor: #28A745;					/* rgb 40, 167, 69 */
	--vlightgreencolor: #D4F8D4;			/* rgb 212, 248, 212 */
	--vlightambercolor: #FFECC8;			/* rgb 255, 236, 200 */

}

.mywhitetext{color:var(--whitecolor)}
.mywhite{background-color:var(--whitecolor)}

.myblacktext{color:  var(--blackcolor)}
.myblack{background-color: var(--blackcolor)}

.myvlightgreytext{color:  var(--vlightgreycolor)}
.myvlightgrey{background-color: var(--vlightgreycolor)}

.mylightgreytext{color:  var(--lightgreycolor)}
.mylightgrey{background-color: var(--lightgreycolor)}

.mygreytext{color:  var(--greycolor)}
.mygrey{background-color: var(--greycolor)}

.mydarkgreytext{color:  var(--darkgreycolor)}
.mydarkgrey{background-color: var(--darkgreycolor)}

.myvlightbluetext{color:  var(--vlightbluecolor)}
.myvlightblue{background-color:  var(--vlightbluecolor)}

.mylightbluehovertext{color:  var(--lightbluehovercolor)}
.mylightbluehover{background-color: var(--lightbluehovercolor)}
.mylightbluetext{color:  var(--lightbluecolor)}
.mylightblue{background-color: var(--lightbluecolor)}	

.mydarkbluetext{color:  var(--darkbluecolor)}
.mydarkblue{background-color: var(--darkbluecolor)} 
.mydarkbluehovertext{color:  var(--darkbluehovercolor)}
.mydarkhoverblue{background-color: var(--darkbluehovercolor)}

.mylightyellowtext{color:  var(--lightyellowcolor)}
.mylightyellow{background-color: var(--lightyellowcolor)}

.myyellowtext{color:  var(--yellowcolor)}
.myyellow{background-color: var(--yellowcolor)}

.myredtext{color:  var(--redcolor)}
.myred{background-color: var(--redcolor)}

.mygreenext{color:  var(--greencolor)}
.mygreen{background-color: var(--greencolor)}