
@copyGrey : #333333;

@tealLight   : #1ABC9C;
@teal        : #16A085;
@greenLight  : #2ECC71;
@green       : #27AE60;
@blueLight   : #3498DB;
@blue        : #2980B9;
@purpleLight : #9B59B6;
@purple      : #8E44AD;
@steelLight  : #34495E;
@steel       : #2C3E50;
@yellowLight : #F1C40F;
@yellow      : #F39C12;
@orangeLight : #E67E22;
@orange      : #D35400;
@redLight    : #E74C3C;
@red         : #C0392B;
@silverLight : #ECF0F1;
@silver      : #BDC3C7;
@greyLight   : #95A5A6;
@grey        : #7F8C8D;

#backgroundColors {
	&.tealLight { background-color : @tealLight; };
	&.teal { background-color : @teal; };
	&.greenLight { background-color : @greenLight; };
	&.green { background-color : @green; };
	&.blueLight { background-color : @blueLight; };
	&.blue { background-color : @blue; };
	&.purpleLight { background-color : @purpleLight; };
	&.purple { background-color : @purple; };
	&.steelLight { background-color : @steelLight; };
	&.steel { background-color : @steel; };
	&.yellowLight { background-color : @yellowLight; };
	&.yellow { background-color : @yellow; };
	&.orangeLight { background-color : @orangeLight; };
	&.orange { background-color : @orange; };
	&.redLight { background-color : @redLight; };
	&.red { background-color : @red; };
	&.silverLight { background-color : @silverLight; };
	&.silver { background-color : @silver; };
	&.greyLight { background-color : @greyLight; };
	&.grey { background-color : @grey; };
}

#backgroundColorsHover {
	&.tealLight:hover { background-color : @tealLight; };
	&.teal:hover { background-color : @teal; };
	&.greenLight:hover { background-color : @greenLight; };
	&.green:hover { background-color : @green; };
	&.blueLight:hover { background-color : @blueLight; };
	&.blue:hover { background-color : @blue; };
	&.purpleLight:hover { background-color : @purpleLight; };
	&.purple:hover { background-color : @purple; };
	&.steelLight:hover { background-color : @steelLight; };
	&.steel:hover { background-color : @steel; };
	&.yellowLight:hover { background-color : @yellowLight; };
	&.yellow:hover { background-color : @yellow; };
	&.orangeLight:hover { background-color : @orangeLight; };
	&.orange:hover { background-color : @orange; };
	&.redLight:hover { background-color : @redLight; };
	&.red:hover { background-color : @red; };
	&.silverLight:hover { background-color : @silverLight; };
	&.silver:hover { background-color : @silver; };
	&.greyLight:hover { background-color : @greyLight; };
	&.grey:hover { background-color : @grey; };
}