/*==================================================
demo panel
==================================================*/
.panel-demo ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.panel-demo h4 {
  font-size: 14px;
  color: #fff;
  margin-bottom: 10px;
}

.panel-demo h4:not(:first-child) {
  margin-top: 10px;
}

.panel-demo .badge {
  font-size: 16px;
  margin-top: 10px;
}

.panel-demo {
  position: fixed;
  top: 100px;
  left: -100%;
  z-index: 1050;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.panel-inner {
  background-color: #121213;
  padding: 15px;
}

.panel-toggle {
  position: absolute;
  right: -50px;
  top: 0;
  width: 50px;
  height: 50px;
  line-height: 50px;
  text-align: center;
  background-color: #121213;
}

.panel-color > li,
.panel-overlay > li {
  display: inline-block;
  border-radius: 50%;
}

.panel-color > li > a {
  display: block;
  width: 30px;
  height: 30px;
  border-radius: 50%;
}

#opacity-slider-value {
  color: #fff;
}

.color1 {
  background-color: #ff2d2d;
}
.color2 {
  background-color: #16c9d0;
}
.color3 {
  background-color: #27c8a3;
}
.color4 {
  background-color: #ff2591;
}
.color5 {
  background-color: #9d7f48;
}

.noUi-target,.noUi-target *{-webkit-touch-callout:none;-webkit-user-select:none;-ms-touch-action:none;-ms-user-select:none;-moz-user-select:none;-moz-box-sizing:border-box;box-sizing:border-box}.noUi-target{position:relative;direction:ltr}.noUi-base{width:100%;height:100%;position:relative}.noUi-origin{position:absolute;right:0;top:0;left:0;bottom:0}.noUi-handle{position:relative;z-index:1}.noUi-stacking .noUi-handle{z-index:10}.noUi-state-tap .noUi-origin{-webkit-transition:left .3s,top .3s;transition:left .3s,top .3s}.noUi-state-drag *{cursor:inherit!important}.noUi-base{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.noUi-horizontal{height:18px}.noUi-horizontal .noUi-handle{width:34px;height:28px;left:-17px;top:-6px}.noUi-vertical{width:18px}.noUi-vertical .noUi-handle{width:28px;height:34px;left:-6px;top:-17px}.noUi-background{background:#FAFAFA;box-shadow:inset 0 1px 1px #f0f0f0}.noUi-connect{background:#3FB8AF;box-shadow:inset 0 0 3px rgba(51,51,51,.45);-webkit-transition:background 450ms;transition:background 450ms}.noUi-origin{border-radius:2px}.noUi-target{border-radius:4px;border:1px solid #D3D3D3;box-shadow:inset 0 1px 1px #F0F0F0,0 3px 6px -5px #BBB}.noUi-target.noUi-connect{box-shadow:inset 0 0 3px rgba(51,51,51,.45),0 3px 6px -5px #BBB}.noUi-dragable{cursor:w-resize}.noUi-vertical .noUi-dragable{cursor:n-resize}.noUi-handle{border:1px solid #D9D9D9;border-radius:3px;background:#FFF;cursor:default;box-shadow:inset 0 0 1px #FFF,inset 0 1px 7px #EBEBEB,0 3px 6px -3px #BBB}.noUi-active{box-shadow:inset 0 0 1px #FFF,inset 0 1px 7px #DDD,0 3px 6px -3px #BBB}.noUi-handle:after,.noUi-handle:before{content:"";display:block;position:absolute;height:14px;width:1px;background:#E8E7E6;left:14px;top:6px}.noUi-handle:after{left:17px}.noUi-vertical .noUi-handle:after,.noUi-vertical .noUi-handle:before{width:14px;height:1px;left:6px;top:14px}.noUi-vertical .noUi-handle:after{top:17px}[disabled] .noUi-connect,[disabled].noUi-connect{background:#B8B8B8}[disabled] .noUi-handle{cursor:not-allowed}

.noUi-connect {
  background-color: #ff2591;
}