.colorcontrol {
  display: flex;
flex-direction: row;
flex-wrap: wrap;
list-style-type: none;
justify-content: flex-start;
}
.color-visualizer-note  {
  margin-bottom: 2em;
}

.colorbox {
  display: block;
  width: 100%;
  height:50px;
}
.colorvizwrap {
  position: relative;
  z-index: 4;
  }
  .inlineul {
  list-style-type: none;
  display: inline;
  display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-left: 0;
  }
  .inlineul li {
padding: .25em .5em;
}
  .visualizerCategory {
  border: 1px solid black;
  padding: 0.25em;
  justify-content: center !important;
  text-align: center;
}
.colorvizinvisible {
  display: none !important;
}
.colorselect a.label {
  background: #efefef;
}

.colorselect a.llabel {
  background: #efefef;
}
.selected {
  border-color: green !important;
}
.layerswrap {
  position: relative;
  width: 100%;
  min-height: 500px;
  display: block;
}
.basediv, .layer {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}
.controlpanel .dropdown.menu > li.is-dropdown-submenu-parent > a::after {
border-color: black transparent transparent;
position: absolute !important;
right: 1em;
}
.label {
  border-right: #efefef 1px solid;
  text-align: left;
}
.llabel {
  text-align: left;
}
.selectedcolorsreadout ul {
  list-style-type: none;
}
.controlpanel .is-dropdown-submenu {
  background: #fff;
padding: .5rem;
}

.akkordion-item .accordion-title {
  color: white ;
  background: rgb(178, 174, 165);
  text-align: left;
  border-top-left-radius: 90px !important;
  border-bottom-left-radius: 90px !important;
  text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 1px rgba(0,0,0,.5);
  text-transform: capitalize;
}
.akkordion-item .accordion-title:hover {
  color: white ;
  background: #333;
}





@media only screen and (min-width: 1025px) {
  .colorvisualizerstage {
    height: 43vh;
  }
  .handle {
    margin-right: 4em;
    height: 20px;
    width: 20px;
    border: 2px solid black;
    background: white;
    border-radius: 90px;
    display: block;
    float: left;
  }
  .colorchip {
    display: flex;
    flex-direction: column;
    width: 100px;
    margin: 0.25rem;
  }
}
/*tab mobile*/
@media only screen and (max-width: 1024px) {

  .handle {
    margin-right: 0.75em;
    height: 20px;
    width: 20px;
    border: 2px solid black;
    background: white;
    border-radius: 90px;
    display: block;
    float: left;
  }
  .colorchip {
    display: flex;
    flex-direction: column;
    width: 80px;
    margin: 0.25rem;
    font-size: 15px !important;
  }
  .accordion-title {
    font-size: 16px !important;
  }
}
/* handheld lg */
@media only screen and (max-width: 811px) {

  .controlpanel a.label:after {
    display: none !important;
  }
  .controlpanel a.llabel:after {
    display: none !important;
  }

}

/* handheld small */
@media only screen and (max-width: 440px) {

.colorvizwrap .accordion {
  background: #fff;
z-index: 50 !important;
position: relative !important;
}
}