.react-colorpicker-picker-panel {
	position: relative;
	border-radius: 4px;
	box-shadow: 0 1px 5px #ccc;
	border: 1px solid #ccc;
	padding: 8px;
}
.react-colorpicker-picker-wrap {
	margin: 5px 0 0;
	height: 30px;
	width: 100%;
	position: relative;
}
.react-colorpicker-picker-wrap-preview {
	position: absolute;
	right: 0px;
}
.react-colorpicker-picker-wrap-ribbon {
	position: absolute;
	left: 0px;
	top: 0;
	right: 35px;
	height: 12.5px;
}
.react-colorpicker-picker-wrap-alpha {
	position: absolute;
	left: 0px;
	right: 35px;
	bottom: 0;
	height: 12.5px;
}
.react-colorpicker-trigger {
	border: 1px solid #999;
	display: inline-block;
	padding: 2px;
	border-radius: 2px;
	font-size: 0px;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-user-select: none;
}
.react-colorpicker-trigger span {
	width: 20px;
	height: 20px;
	display: inline-block;
	cursor: pointer;
}
.react-colorpicker-trigger-open {
	box-shadow: 0px 0px 3px #999;
}
.react-colorpicker-picker {
	width: 218px;
	background-color: #fff;
	box-sizing: border-box;
	outline: none;
}
.react-colorpicker-picker * {
	box-sizing: border-box;
}
.react-colorpicker-picker-open {
	display: block;
}
.react-colorpicker-picker-close {
	display: none;
}
.react-colorpicker-preview {
	height: 30px;
	width: 30px;
	overflow: hidden;
	border-radius: 2px;
	background-image: url('data:image/png;base64,R0lGODdhCgAKAPAAAOXl5f///ywAAAAACgAKAEACEIQdqXt9GxyETrI279OIgwIAOw==');
	background-repeat: repeat;
}
.react-colorpicker-preview span {
	display: block;
	height: 100%;
	box-shadow: 0 0 2px #808080 inset;
	border-radius: 2px;
}
.react-colorpicker-board {
	position: relative;
	font-size: 0;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.react-colorpicker-board span {
	position: absolute;
	border-radius: 10px;
	border: 1px solid #fff;
	width: 9px;
	height: 9px;
	left: -999px;
	top: -999px;
	box-shadow: 0 0 1px rgba(120, 120, 120, 0.7);
	z-index: 2;
}
.react-colorpicker-board-hsv {
	width: 200px;
	height: 150px;
	position: relative;
	z-index: 1;
	border-radius: 2px;
}
.react-colorpicker-board-saturation {
	border-radius: 2px;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: 2;
	background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9InJnYigwLDAsMCkiIHN0b3Atb3BhY2l0eT0iMCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
	background-image: -webkit-linear-gradient(top, transparent 0%, #000000 100%);
	background-image: linear-gradient(to bottom, transparent 0%, #000000 100%);
}
.react-colorpicker-board-lightness {
	border-radius: 2px;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: 1;
	background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0icmdiKDAsMCwwKSIgc3RvcC1vcGFjaXR5PSIwIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
	background-image: -webkit-linear-gradient(left, #ffffff 0%, transparent 100%);
	background-image: linear-gradient(to right, #ffffff 0%, transparent 100%);
}
.react-colorpicker-board-handler {
	box-shadow: 0 0 2px #808080 inset;
	border-radius: 2px;
	cursor: crosshair;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 3;
}
.react-colorpicker-ribbon {
	position: relative;
	height: 100%;
	border-radius: 2px;
	box-shadow: 0 0 2px #808080 inset;
	background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiNmZjAwMDAiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMTAlIiBzdG9wLWNvbG9yPSIjZmY5OTAwIiBzdG9wLW9wYWNpdHk9IjEiLz48c3RvcCBvZmZzZXQ9IjIwJSIgc3RvcC1jb2xvcj0iI2NkZmYwMCIgc3RvcC1vcGFjaXR5PSIxIi8+PHN0b3Agb2Zmc2V0PSIzMCUiIHN0b3AtY29sb3I9IiMzNWZmMDAiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iNDAlIiBzdG9wLWNvbG9yPSIjMDBmZjY2IiBzdG9wLW9wYWNpdHk9IjEiLz48c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzAwZmZmZCIgc3RvcC1vcGFjaXR5PSIxIi8+PHN0b3Agb2Zmc2V0PSI2MCUiIHN0b3AtY29sb3I9IiMwMDY2ZmYiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iNzAlIiBzdG9wLWNvbG9yPSIjMzIwMGZmIiBzdG9wLW9wYWNpdHk9IjEiLz48c3RvcCBvZmZzZXQ9IjgwJSIgc3RvcC1jb2xvcj0iI2NkMDBmZiIgc3RvcC1vcGFjaXR5PSIxIi8+PHN0b3Agb2Zmc2V0PSI5MCUiIHN0b3AtY29sb3I9IiNmZjAwOTkiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmMDAwMCIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
	background-image: -webkit-linear-gradient(left, #ff0000 0%, #ff9900 10%, #cdff00 20%, #35ff00 30%, #00ff66 40%, #00fffd 50%, #0066ff 60%, #3200ff 70%, #cd00ff 80%, #ff0099 90%, #ff0000 100%);
	background-image: linear-gradient(to right, #ff0000 0%, #ff9900 10%, #cdff00 20%, #35ff00 30%, #00ff66 40%, #00fffd 50%, #0066ff 60%, #3200ff 70%, #cd00ff 80%, #ff0099 90%, #ff0000 100%);
}
.react-colorpicker-ribbon span {
	position: absolute;
	top: 0;
	height: 100%;
	width: 4px;
	border: 1px solid #000000;
	padding: 1px 0;
	margin-left: -2px;
	background-color: #fff;
	border-radius: 3px;
}
.react-colorpicker-ribbon-handler {
	position: absolute;
	width: 104%;
	height: 100%;
	left: -2%;
	cursor: pointer;
}
.react-colorpicker-alpha {
	position: relative;
	height: 100%;
	width: 100%;
	border-radius: 2px;
	background-image: url('data:image/png;base64,R0lGODdhCgAKAPAAAOXl5f///ywAAAAACgAKAEACEIQdqXt9GxyETrI279OIgwIAOw==');
	background-repeat: repeat;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.react-colorpicker-alpha-bg {
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 2px;
	box-shadow: 0 0 2px #808080 inset;
}
.react-colorpicker-alpha span {
	position: absolute;
	top: 0;
	height: 100%;
	width: 4px;
	border: 1px solid #000000;
	padding: 1px 0;
	margin-left: -2px;
	background-color: #fff;
	border-radius: 3px;
}
.react-colorpicker-alpha-handler {
	position: absolute;
	width: 104%;
	height: 100%;
	left: -2%;
	cursor: pointer;
}
.react-colorpicker-params {
	font-size: 12px;
}
.react-colorpicker-params-input {
	overflow: hidden;
	padding: 2px 0;
}
.react-colorpicker-params input {
	-webkit-user-select: text;
	-moz-user-select: text;
	-ms-user-select: text;
	user-select: text;
	text-align: center;
	padding: 1px;
	margin: 0;
	float: left;
	border-radius: 2px;
	border: 1px solid #CACACA;
	font-family: 'Helvetica Neue', Helvetica, sans-serif;
}
.react-colorpicker-params-hex {
	width: 52px;
}
.react-colorpicker-params input[type=number] {
	margin-left: 5px;
	width: 32px;
}
.react-colorpicker-params input[type=number]::-webkit-inner-spin-button {
	-webkit-appearance: none;
}
.react-colorpicker-params-lable {
	padding: 2px 0;
	height: 22px;
	line-height: 18px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.react-colorpicker-params-lable label {
	float: left;
	text-align: center;
}
.react-colorpicker-params-lable-hex {
	width: 52px;
}
.react-colorpicker-params-lable-number,
.react-colorpicker-params-lable-alpha {
	margin-left: 5px;
	width: 32px;
}
.react-colorpicker-params-lable-number:hover {
	border-radius: 2px;
	background-color: #eee;
	box-shadow: 0 0 0 1px #ccc inset;
	cursor: pointer;
}
.react-colorpicker .react-colorpicker-picker {
	display: none;
}
.react-colorpicker-open .react-colorpicker-picker {
	display: block;
}