.colorbox{
width:25px;
height:25px;
display:inline-block;
background-color:#fff;
border:1px solid #F9780E;
vertical-align:top;
cursor:pointer;
-webkit-box-shadow: 1px 1px 1px #FC7507;
-moz-box-shadow: 1px 1px 1px #FC7507;
box-shadow: 1px 1px 1px #FC7507;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.colorpicker {
width: 356px;
height: 176px;
overflow: hidden;
position: absolute;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbJnS-Gyv4mV0p6WgJf1kkdu_vWPyiof6hrA9tOw9NKFT0pHURWzIYsucbhnNqDuTcncV7H4qbWnSIVf5zlXVnokr71mPfbIcLWEdP_40i-ig4TFLHvXqk3CqBwVNNn-MAwABQyEwH9eFh/s1600/colorpicker_background.png);
font-family: Arial, Helvetica, sans-serif;
display: none;
}
.colorpicker_color {
width: 150px;
height: 150px;
left: 14px;
top: 13px;
position: absolute;
background: #f00;
overflow: hidden;
cursor: crosshair;
}
.colorpicker_color div {
position: absolute;
top: 0;
left: 0;
width: 150px;
height: 150px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaXZgG_TcxIRb8esHbQ9FNMifV_hNXrgnBb5weQfleCmL-m6t-b6HT-7GpJcmeD2ew4GptBxG3X5optQVFUn7_zvGwQThPlITRPTAVJYA7RRJ9rcQ6Eg4Jub1k2DQL79wFfoXJ1uV2oJHp/s1600/colorpicker_overlay.png);
}
.colorpicker_color div div {
position: absolute;
top: 0;
left: 0;
width: 11px;
height: 11px;
overflow: hidden;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIAM0l8H_r2tIs17HDJ-lQLay5-aRXwFhruWmVue9hVemc-QlRRMxtPM97I3HSgrc1BfyZUGDCzj9reyE-bec0ONRsNmMGq11G4O2CyxoIdDFP2w1atA15_-ovqPLY_Xa8UW5ZytylNBrU/s1600/colorpicker_select.gif);
margin: -5px 0 0 -5px;
}
.colorpicker_hue {
position: absolute;
top: 13px;
left: 171px;
width: 35px;
height: 150px;
cursor: n-resize;
}
.colorpicker_hue div {
position: absolute;
width: 35px;
height: 9px;
overflow: hidden;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiv8hYl9yDrtxtb3DOjhXxmVvVHn3wTMMfm-t4d0mN25In50w9ORH1NgWgdpBcdNIiFAfYlX3Rlmb78LNtw7YcvQEAA9DaZLuqA_Ru8LeLaQSiJd9jWb2ckS-fRTAHdEHEmwUhUFaiNOfG3/s1600/colorpicker_indic.gif) left top;
margin: -4px 0 0 0;
left: 0px;
}
.colorpicker_new_color {
position: absolute;
width: 60px;
height: 30px;
left: 213px;
top: 13px;
background: #f00;
}
.colorpicker_current_color {
position: absolute;
width: 60px;
height: 30px;
left: 283px;
top: 13px;
background: #f00;
}
.colorpicker input {
background-color: transparent;
border: 1px solid transparent;
position: absolute;
font-size: 10px;
font-family: Arial, Helvetica, sans-serif;
color: #898989;
top: 4px;
right: 11px;
text-align: right;
margin: 0;
padding: 0;
height: 11px;
}
.colorpicker_hex {
position: absolute;
width: 72px;
height: 22px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4b7RBFjA2g8KUoxuwM53x5-xpDAi8KlVQTTOCo82ICXV0nwuF7si6wFVnT1RvXUB8dBFoPis8koP1oF3JuvjYD5XBz34RIxzMwBfz9TB6ufcct9aHgPknI6xYBsNZ2jPDOc1h33A-3-bk/s1600/colorpicker_hex.png) top;
left: 212px;
top: 142px;
}
.colorpicker_hex input {
right: 6px;
}
.colorpicker_field {
height: 22px;
width: 62px;
background-position: top;
position: absolute;
}
.colorpicker_field span {
position: absolute;
width: 12px;
height: 22px;
overflow: hidden;
top: 0;
right: 0;
cursor: n-resize;
}
.colorpicker_rgb_r {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJ7vCwRf3CMI9Xinbih5jbkwgSfdwUY2WOf2mKXMABsnsPqgZ3iGfha64SRDyzkVSJXBp9_WaGz-W0W18HzqXGPhi6OdD-VdSdA4cTRWghxh36mIZRLojUzeynNJZAokbzIUAj-hkN32xY/s1600/colorpicker_rgb_r.png);
top: 52px;
left: 212px;
}
.colorpicker_rgb_g {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0IKGr5OqgmoH7O3zwGdZBAHtBzEtHNooUeGaqmEPnhryIw1fEiLNwt6Vwrwq0F8QhwszqtPuqX64zjTj776Y1BAeFR2kurv4V4QsXSyOOy4ZmtFnpjLu0AwymXAWaEf0HjhEEod0fAZir/s1600/colorpicker_rgb_g.png);
top: 82px;
left: 212px;
}
.colorpicker_rgb_b {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIf-RVoqZjH3rko5lkt82MUaXLbtP2-UIDNUzW1oAzSfWuPYzzE1fDopNl1t1TwPP-edPUD-IrZbYMX3lU5i1quzhDdD5vZHt8nOkg6FKfHGWHBywhnakvaqn4PHaiSvYAWxwmGTmkY5NS/s1600/colorpicker_rgb_b.png);
top: 112px;
left: 212px;
}
.colorpicker_hsb_h {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjj5B8D3tNx5YDiOHBK5YuoGYvfLp9iGasJ8t8afs0GE8QwgvdDOkEvAKGdzQIRc0c0ybSvxcFGJbpUDecTpH3U83VWiO0ii7EfqK9a_OD24bHRSq5-HYKSVfb7uwJcsF5YCNHPSmIJU5Oe/s1600/colorpicker_hsb_h.png);
top: 52px;
left: 282px;
}
.colorpicker_hsb_s {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbMJU91J4jM9oB8xAMb3nQD6KKWhsA6JieNvrJw1MyZ7fgkE_FKT5pIbelofhB0WQziNrjphVDrBJA9Y-qYtn3IfV-ZqARab9El0csZh8slaer7138TsbT1OXG_7e7rfwRTzyled8OY6RV/s1600/colorpicker_hsb_s.png);
top: 82px;
left: 282px;
}
.colorpicker_hsb_b {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnsVFAYnAxFR8pNlNgb_tRQYrIDcNGQ8QJ_guO5YOg6L3V_SmbI-x63YzYEpFnn67J2ZqcUAjYEYQitbtaNyGU5UWoc_Tg-iokTMnWdofC8ALKtSooYTCKwbxRkZNsf26609NQR7YqWEwn/s1600/colorpicker_hsb_b.png);
top: 112px;
left: 282px;
}
.colorpicker_submit {
position: absolute;
width: 22px;
height: 22px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1g27DfUp8SDWZifLiW-bEapjxzFKkEiYvZo6ir8bH8gza2wUKln64v51KXAfZEByPfzvvDd6hISrI8-QhoSZ-hbzQ54S2uM8ZPiKwgJfqq-DI29oDRELp8L_vtUVk4Ul-bqR0Ae0zM1te/s1600/colorpicker_submit.png) top;
left: 322px;
top: 142px;
overflow: hidden;
}
.colorpicker_focus {
background-position: center;
}
.colorpicker_hex.colorpicker_focus {
background-position: bottom;
}
.colorpicker_submit.colorpicker_focus {
background-position: bottom;
}
.colorpicker_slider {
background-position: bottom;
}