.easycolorswatches-out {
    opacity: 0.5; filter: alpha(opacity="50");
    background:
       linear-gradient(to top left,
           rgba(0,0,0,0) 0%,
           rgba(0,0,0,0) calc(50% - 0.8px),
           rgba(0,0,0,1) 50%,
           rgba(0,0,0,0) calc(50% + 0.8px),
           rgba(0,0,0,0) 100%),
       linear-gradient(to top right,
           rgba(0,0,0,0) 0%,
           rgba(0,0,0,0) calc(50% - 0.8px),
           rgba(0,0,0,1) 50%,
           rgba(0,0,0,0) calc(50% + 0.8px),
           rgba(0,0,0,0) 100%);
}
.colorswatch-list-inactive { opacity: 0.2; filter: alpha(opacity="20"); }
.colorswatch-inactive { display: none; }
.colorswatch-list { zoom: 1; margin: 7px 0; }
.colorswatch-list:after { display: block; clear: both; visibility: hidden; content: '.'; height: 0; font-size: 0em; }
.colorswatch-list-li {
    float: left;
    margin-right: 5px;
    cursor: pointer;
    display: block;
    z-index: 9999;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
 }
.colorswatch-list-li.active { background-image: url(../../../images/easycolorswatch/tick.png); background-position: 50% 100%; background-repeat: no-repeat; }
.colorswatch-list .active-category {
    background-image: url(../../../images/easycolorswatch/tick.png);
    background-position: 50% 50%; background-repeat: no-repeat;

}
.colorswatch-value-image {
    float: left;
    margin-right: 5px;
    cursor: pointer;
    display: block;
    z-index: 9999;
    line-height: 0.65em;
}

.colorswatch-value-image.active img {
    border: 1px solid #777;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -khtml-border-radius: 5px;
    -webkit-border-radius: 5px;
}

.colorswatch-value-image img { border: 1px solid #FFFFFF; }
.colorswatch-value-image.active-category img { border-color: #313131; }

.colorswatch-list img {
    /*border-bottom: 1px solid #fff;*/
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding: 2px;
}
.colorswatch-option-text {
    display:inline;
    list-style: none;
    text-align: center;
    font-weight: bold;
}

.colorswatch-value-text:hover {
    background-color: #B2B2B2;
    color: black;
}

.colorswatch-value-text {
    cursor: pointer;
    display: block;
    z-index: 9999;
     float:left;
     width: auto;
     min-width: 40px;
     text-align: center;
     font-weight:bold;
     margin: 2px;
     border: 1px solid #313131;
     padding: 7px;
 }
.colorswatch-value-text.active {
    background-color: #313131;
    background-image: none;
    border: 1px solid #313131;
    color: #ffffff;
}
.colorswatch-value-text.active-category {
    background-color: #313131;
    background-image: none;
    border: 1px solid #313131;
    color: #ffffff;
}
