#customize-box { position: fixed; left: -202px; top: 120px; z-index: 9999; width: 202px; -webkit-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2); box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.2); -webkit-border-radius: 0px 3px 3px 0px; border-radius: 0px 3px 3px 0px; display: none; text-align: left; }

#customize-box.open { left: 0; }

#customize-box-wrap { background: #FAFAFA; }

.customize-section { border-bottom: 1px solid #eee; padding: 10px 15px; background: #FAFAFA; position: relative; }

.customize-title { font-weight: bold; margin: 0 0 5px 0; }

.customize-item { margin: 0 0 10px 0; position: relative; }
.customize-item .input-color { width: 80px; border: 1px solid #DDD !important; padding: 4px 8px; margin: 0 5px 0 0; }

.customize-item-title { font-size: 10px; display: block; padding: 0; margin: 0 0 4px 0; }

.customize-list { list-style: none; margin: 0; padding: 0; }

.customize-list li { float: left; background-color: #fff; background-repeat: repeat; margin: 0 5px 5px 0; cursor: pointer; width: 24px; height: 24px; overflow: hidden; border: 2px solid #EEE; opacity: 0.9; }

.customize-list li.active { border: 2px solid #ddd; opacity: 1; }

#show-board-custom, #show-mat-custom { margin: 0 5px 0 0; }

#customize-box-open { position: absolute; top: 20px; right: -54px; cursor: pointer; background: #333; background: rgba(0, 0, 0, 0.75); color: #fff; text-align: center; font-size: 30px; padding: 10px 6px; -webkit-border-radius: 0px 4px 4px 0px; border-radius: 0px 4px 4px 0px; }

#customize-box-open:hover { background: #444; background: rgba(0, 0, 0, 0.9); }

#customize-box-open .nt-icon-cancel { display: none; }

#customize-box-open .nt-icon-cog-1 { display: block; }

.open #customize-box-open .nt-icon-cancel { display: block; }

.open #customize-box-open .nt-icon-cog-1 { display: none; }

#customize-background-image img { border: 1px solid #AAA; }

.iris-picker { border-color: #eee !important; position: absolute; top: 30px; z-index: 1000; }

.color-indicator { float: left; width: 21px; height: 21px; background: #ddd; margin: 0 5px 0 0; border: 1px solid #eee; -webkit-border-radius: 3px; border-radius: 3px; }

#customize-box label { margin: 0 10px 0 8px; cursor: pointer; font-size: 12px; }
.clear { clear: both; }

@media (min-width: 768px) { #customize-box { display: block; } }