:root {
    --color-primary: #88CCD1;
	--color-primary-1: #57AFB5;

	--color-gray-1: #f5f5f5;
	--color-gray-2: #e6e6e6;
	--color-gray-3: #d6d6d6;
	--color-gray-4: #c7c7c7;
	--color-gray-5: #b8b8b8;
	--color-gray-6: #a8a8a8;
	--color-gray-7: #999999;
	--color-gray-8: #8a8a8a;
	--color-gray-9: #7a7a7a;
	--color-gray-10: #6b6b6b;
	--color-gray-11: #5c5c5c;
	--color-gray-12: #4d4d4d;
	--color-gray-13: #3d3d3d;
	--color-gray-14: #2e2e2e;
	--color-gray-15: #1f1f1f;
	--color-gray-16: #0f0f0f;	
}

.color-gray-1, .hover-color-gray-1:hover { color: var(--color-gray-1) !important; }
.color-gray-2, .hover-color-gray-2:hover { color: var(--color-gray-2) !important; }
.color-gray-3, .hover-color-gray-3:hover { color: var(--color-gray-3) !important; }
.color-gray-4, .hover-color-gray-4:hover { color: var(--color-gray-4) !important; }
.color-gray-5, .hover-color-gray-5:hover { color: var(--color-gray-5) !important; }
.color-gray-6, .hover-color-gray-6:hover { color: var(--color-gray-6) !important; }
.color-gray-7, .hover-color-gray-7:hover { color: var(--color-gray-7) !important; }
.color-gray-8, .hover-color-gray-8:hover { color: var(--color-gray-8) !important; }
.color-gray-9, .hover-color-gray-9:hover { color: var(--color-gray-9) !important; }
.color-gray-10, .hover-color-gray-10:hover { color: var(--color-gray-10) !important; }
.color-gray-11, .hover-color-gray-11:hover { color: var(--color-gray-11) !important; }
.color-gray-12, .hover-color-gray-12:hover { color: var(--color-gray-12) !important; }
.color-gray-13, .hover-color-gray-13:hover { color: var(--color-gray-13) !important; }
.color-gray-14, .hover-color-gray-14:hover { color: var(--color-gray-14) !important; }
.color-gray-15, .hover-color-gray-15:hover { color: var(--color-gray-15) !important; }
.color-gray-16, .hover-color-gray-16:hover { color: var(--color-gray-16) !important; }

.background-gray-1, .hover-background-gray-1:hover { background-color: var(--color-gray-1) !important; }
.background-gray-2, .hover-background-gray-2:hover { background-color: var(--color-gray-2) !important; }
.background-gray-3, .hover-background-gray-3:hover { background-color: var(--color-gray-3) !important; }
.background-gray-4, .hover-background-gray-4:hover { background-color: var(--color-gray-4) !important; }
.background-gray-5, .hover-background-gray-5:hover { background-color: var(--color-gray-5) !important; }
.background-gray-6, .hover-background-gray-6:hover { background-color: var(--color-gray-6) !important; }
.background-gray-7, .hover-background-gray-7:hover { background-color: var(--color-gray-7) !important; }
.background-gray-8, .hover-background-gray-8:hover { background-color: var(--color-gray-8) !important; }
.background-gray-9, .hover-background-gray-9:hover { background-color: var(--color-gray-9) !important; }
.background-gray-10, .hover-background-gray-10:hover { background-color: var(--color-gray-10) !important; }
.background-gray-11, .hover-background-gray-11:hover { background-color: var(--color-gray-11) !important; }
.background-gray-12, .hover-background-gray-12:hover { background-color: var(--color-gray-12) !important; }
.background-gray-13, .hover-background-gray-13:hover { background-color: var(--color-primary-1) !important; }
.background-gray-14, .hover-background-gray-14:hover { background-color: var(--color-gray-14) !important; }
.background-gray-15, .hover-background-gray-15:hover { background-color: var(--color-gray-15) !important; }
.background-gray-16, .hover-background-gray-16:hover { background-color: var(--color-gray-16) !important; }

.border-gray-1, .hover-border-gray-1:hover { border-color: var(--color-gray-1) !important; }
.border-gray-2, .hover-border-gray-2:hover { border-color: var(--color-gray-2) !important; }
.border-gray-3, .hover-border-gray-3:hover { border-color: var(--color-gray-3) !important; }
.border-gray-4, .hover-border-gray-4:hover { border-color: var(--color-gray-4) !important; }
.border-gray-5, .hover-border-gray-5:hover { border-color: var(--color-gray-5) !important; }
.border-gray-6, .hover-border-gray-6:hover { border-color: var(--color-gray-6) !important; }
.border-gray-7, .hover-border-gray-7:hover { border-color: var(--color-gray-7) !important; }
.border-gray-8, .hover-border-gray-8:hover { border-color: var(--color-gray-8) !important; }
.border-gray-9, .hover-border-gray-9:hover { border-color: var(--color-gray-9) !important; }
.border-gray-10, .hover-border-gray-10:hover { border-color: var(--color-gray-10) !important; }
.border-gray-11, .hover-border-gray-11:hover { border-color: var(--color-gray-11) !important; }
.border-gray-12, .hover-border-gray-12:hover { border-color: var(--color-gray-12) !important; }
.border-gray-13, .hover-border-gray-13:hover { border-color: var(--color-gray-13) !important; }
.border-gray-14, .hover-border-gray-14:hover { border-color: var(--color-gray-14) !important; }
.border-gray-15, .hover-border-gray-15:hover { border-color: var(--color-gray-15) !important; }
.border-gray-16, .hover-border-gray-16:hover { border-color: var(--color-gray-16) !important; }

.fill-gray-1 { fill: var(--color-gray-1) !important; }
.fill-gray-2 { fill: var(--color-gray-2) !important; }
.fill-gray-3 { fill: var(--color-gray-3) !important; }
.fill-gray-4 { fill: var(--color-gray-4) !important; }
.fill-gray-5 { fill: var(--color-gray-5) !important; }
.fill-gray-6 { fill: var(--color-gray-6) !important; }
.fill-gray-7 { fill: var(--color-gray-7) !important; }
.fill-gray-8 { fill: var(--color-gray-8) !important; }
.fill-gray-9 { fill: var(--color-gray-9) !important; }
.fill-gray-10 { fill: var(--color-gray-10) !important; }
.fill-gray-11 { fill: var(--color-gray-11) !important; }
.fill-gray-12 { fill: var(--color-gray-12) !important; }
.fill-gray-13 { fill: var(--color-gray-13) !important; }
.fill-gray-14 { fill: var(--color-gray-14) !important; }
.fill-gray-15 { fill: var(--color-gray-15) !important; }
.fill-gray-16 { fill: var(--color-gray-16) !important; }

.stroke-gray-1 { stroke: var(--color-gray-1) !important; }
.stroke-gray-2 { stroke: var(--color-gray-2) !important; }
.stroke-gray-3 { stroke: var(--color-gray-3) !important; }
.stroke-gray-4 { stroke: var(--color-gray-4) !important; }
.stroke-gray-5 { stroke: var(--color-gray-5) !important; }
.stroke-gray-6 { stroke: var(--color-gray-6) !important; }
.stroke-gray-7 { stroke: var(--color-gray-7) !important; }
.stroke-gray-8 { stroke: var(--color-gray-8) !important; }
.stroke-gray-9 { stroke: var(--color-gray-9) !important; }
.stroke-gray-10 { stroke: var(--color-gray-10) !important; }
.stroke-gray-11 { stroke: var(--color-gray-11) !important; }
.stroke-gray-12 { stroke: var(--color-gray-12) !important; }
.stroke-gray-13 { stroke: var(--color-gray-13) !important; }
.stroke-gray-14 { stroke: var(--color-gray-14) !important; }
.stroke-gray-15 { stroke: var(--color-gray-15) !important; }
.stroke-gray-16 { stroke: var(--color-gray-16) !important; }

.color-primary, .hover-color-primary:hover { color: var(--color-primary) !important; }
.background-primary, .hover-background-primary:hover { background-color: var(--color-primary) !important; }
.border-primary, .hover-border-primary:hover { border-color: var(--color-primary) !important; }

.border-top-primary { border-top-color: var(--color-primary) !important; }
.border-right-primary { border-right-color: var(--color-primary) !important; }
.border-bottom-primary { border-bottom-color: var(--color-primary) !important; }
.border-left-primary { border-left-color: var(--color-primary) !important; }

.fill-primary, .hover-fill-primary:hover { fill: var(--color-primary) !important; }
.stroke-primary, .hoverstroke-primary:hover { stroke: var(--color-primary) !important; }