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

.dark-teal{
	color: var(--teal);
}
.dark-teal-bg{
	background-color: var(--dark-teal);
	color: white;
}

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

.dark-purple-bg{
	background-color: var(--dark-purple);
	color:white;
}

.white{
	color: white;
}

a.white{
	color: white;
}
a.white:hover{
	color: var(--teal);
}

.light-purple{
	color: color(display-p3 0.682 0.643 0.749);
}

.light-purple-bg{
	background-color: color(display-p3 0.682 0.643 0.749);
}

.gradient-bg{
	background: linear-gradient(to bottom, color(display-p3 0.682 0.643 0.749), white);
}

.dark-gradient-bg{
	background: linear-gradient(to right, #48256d, #1c73ba);
}

.dark-gradient-rev-bg{
	background: linear-gradient(to right,  #1c73ba,#48256d);
}

.gradient-rev-bg{
	background: linear-gradient(to right,  #00aeef,#48256d);
}