:root {
	/* com default */
	--theme: #0038CA;
	--brown: #5B4C3E;
	--orange: #F5A200;
	--teal: #083E47;
	--line: #d0d0d0;
	--red: #FF5154;
	--dark: #000F35;
	--green: #4FB76A;
	--blue: #4e8bff;
	--gray: #999;
	--deepblue: #24569F;
	--pink: #FF8CC3;
}

/* background color */
.bg-theme { background-color: var(--theme) !important; }
.bg-brown { background-color: var(--brown) !important; }
.bg-orange { background-color: var(--orange) !important; }
.bg-teal { background-color: var(--teal) !important; }
.bg-red { background-color: var(--red) !important; }
.bg-green { background-color: var(--green) !important; }
.bg-blue { background-color: var(--blue) !important; }
.bg-gray { background-color: var(--gray) !important; }
.bg-deepblue { background-color: var(--deepblue) !important; }
.bg-pink { background-color: var(--pink) !important; }
.bg-dark { background-color: var(--dark) !important; }

/* font color */
.colr-theme { color: var(--theme) !important; }
.colr-brown { color: var(--brown) !important; }
.colr-orange { color: var(--orange) !important; }
.colr-teal { color: var(--teal) !important; }
.colr-red { color: var(--red) !important; }
.colr-green { color: var(--green) !important; }
.colr-blue { color: var(--blue) !important; }
.colr-gray { color: var(--gray) !important; }
.colr-deepblue { color: var(--deepblue) !important; }
.colr-pink { color: var(--pink) !important; }
.colr-dark { color: var(--dark) !important; }