.c1 {
	background-color: #bdc3c7 !important; /* gray */
	border-color: #8D8D8B;
}
.c1text {
	color: #bdc3c7;
}
.c2 {
	background-color: #FDC525 !important; /* yellow */
	border-color: #DDAB0E;
}
.c2text {
	color: #FDC525;
}
.c3 {
	background-color: #F28D2E !important; /* orange */
	border-color: #B75D2B;
}
.c3text {
	color: #F28D2E;
}
.c4 {
	background-color: #f05e5a !important; /* pink */
	border-color: #C64F4D;
}
.c4text {
	color: #f05e5a;
}
.c5 {
	background-color: #15A3BA !important; /* blue */
	border-color: #0D6188;
}
.c5text {
	color: #15A3BA;
}
.c6 {
	background-color: #4F256B !important; /* purple */
	border-color: #1C196B;
}
.c6text {
	color: #4F256B;
}
.c7 {
	background-color: #4B0E13 !important; /* bordo */
	border-color: #5E221B;
}
.c7text {
	color: #4B0E13;
}
.c8 {
	background-color: #C0C34F !important; /* green */
	border-color: #798626;
}
.c8text {
	color: #C0C34F;
}
.c9 {
	background-color: #506D80 !important; /* sea */
	border-color: #123246;
}
.c9text {
	color: #506D80;
}
.c10 {
	background-color: #7093CB !important;
	border-color: #3B485D;
}
.c10text {
	color: #7093CB;
}
.c11 {
	background-color: #9A1825 !important;
	border-color: #6B191D;
}
.c11text {
	color: #9A1825;
}
.c12 {
	background-color: #1C9879 !important;
	border-color: #194410;
}
.c12text {
	color: #1C9879;
}
.c13 {
	background-color: #818222 !important;
	border-color: #556415;
}
.c13text {
	color: #818222;
}
.c14 {
	background-color: #787878 !important;
	border-color: #3E2929;
}
.c14text {
	color: #787878;
}
.c15 {
	background-color: #000000 !important;
	border-color: #333;
}
.c15text {
	color: #000000;
}
.c16 {
	background-color: #3BA3F3 !important;
	border-color: #3577AA;
}
.c16text {
	color: #3BA3F3;
}
.c17 {
	background-color: #FFFFFF !important;
	border-color: #ccc;
}
.c17text {
	color: #FFFFFF;
}
.c18 {
	background-color: #53AD3C !important;
	border-color: #427037;
}
.c18text {
	color: #53AD3C;
}
.c19 {
	background-color: #E6E7E8 !important;
	border-color: #999DA1;
}
.c19text {
	color: #E6E7E8;
}
.c20 {
    background-color: #0081C8 !important;
	border-color: #1B6690;
}
.c20text {
	color: #0081C8;
}
.c21 {
	background-color: #A470A4 !important;
	border-color: #6D568D;
}
.c21text {
	color: #A470A4;
}
.c22 {
	background-color: #0C7A67 !important;
	border-color: #3A6B73;
}
.c22text {
	color: #0C7A67;
}
.c23 {
	background-color: #AA452F !important;
	border-color: #905133;
}
.c23text {
	color: #AA452F;
}
.c24 {
	background-color: #3A3E08 !important;
	border-color: #7E8267;
}
.c24text {
	color: #3A3E08;
}
.c25 {
	background-color: #682C87 !important;
	border-color: #461E7D;
}
.c25text {
	color: #682C87;
}
.c26 {
	background-color: #0D4A5E !important;
	border-color: #344149;
}
.c26text {
	color: #0D4A5E;
}
.c27 {
	background-color: #CB512C !important;
	border-color: #7D441F;
}
.c27text {
	color: #CB512C;
}
.c28 {
	background-color: #018947 !important;
	border-color: #446555;
}
.c28text {
	color: #018947;
}
.c29 {
	background-color: #f2134c !important;
	border-color: #f2134c;
}
.c29text {
	color: #f2134c;
}
.c30 {
	background-color: #c86eb4 !important;
	border-color: #c86eb4;
}
.c30text {
	color: #c86eb4;
}
 .c31 {
	background-color: #2abbe8 !important;
	border-color: #2abbe8;
}
.c31text {
	color: #2abbe8;
}
.c32 {
	background-color: #47c460 !important;
	border-color: #47c460;
}
.c32text {
	color: #47c460;
}
 .c33 {
	background-color: #fe6c00 !important;
	border-color: #fe6c00;
}
.c33text {
	color: #fe6c00;
}
 .c34 {
	background-color: #f2ab11 !important;
	border-color: #f2ab11;
}
.c34text {
	color: #f2ab11;
}
 .c35 {
	background-color: #3a5a97 !important;
	border-color: #3a5a97;
}
.c35text {
	color: #3a5a97;
}
 .c36 {
	background-color: #e63428 !important;
	border-color: #e63428;
}
.c36text {
	color: #e63428;
}

.cc18 {
    background-color: #333;
	border-color: #666;
}
.cc19 {
    background-color: #666;
	border-color: #999;
}
.cc20 {
    background-color: #888;
	border-color: #aaa;
}
.cc21 {
    background-color: #aaa;
	border-color: #ddd;
}
.cc22 {
    background-color: #ccc;
	border-color: #fff;
}
.cc23 {
    background-color: #56AE3F;
    border-color: #123246;
}

.colorWrapper {
	line-height: 30px;
	vertical-align: top;
	margin-top: 15px;
}
.color {
	display: inline-block;
	width: 30px;
	height: 30px;
	cursor: pointer;
	border: 1px solid #ccc;
	vertical-align: middle;
}
#colorer {
	background-color:white;
	display: none;
	position: absolute;
	padding: 10px;
	border: 1px solid gray;
	z-index: 10000;
	width: 400px;
}
@media (max-width: 768px) {
	#colorer {
		left: 0 !important;
		width: 300px;
	}
}