span.product-colors-container,
.woocommerce ul.products li.product .product-colors-container {
    position: relative;
    margin: 10px 0 ;
    line-height: 1; 
    text-align: left;
    display: block;
}

.product-colors-container .attr-color-hover .status-attr,
ul.products li.product table.variations .value-pa_color .attr-color-hover .status-attr,
.site-inner ul.products li.product .product-colors-container .attr-color-hover .status-attr {
    background-size: cover;
    width: 100%;
    height: 100%;
    display: block;
    cursor: pointer;
}

.site-inner ul.products li.product .variable-thumbnail  a img {
    margin: 0;
}

/*.product-colors-container span.plus,
.product-colors-container .attr-color-hover {
    border: 1px solid transparent;
    margin: 0 0 0 8px;
    margin: 0 8px 0 0;
    padding: 1px;
    height: 20px;
    width: 20px;
    display: inline-block;
    vertical-align: middle;
}
*/

.product-colors-container .attr-color-hover ,
ul.products li.product .product-colors-container span.plus,
ul.products li.product .product-colors-container .attr-color-hover {
    border: 1px solid transparent;
    /*margin: 0 0 0 8px;*/
    margin: 0 2px 0 0;
    padding: 1px;
    height: 25px;
    /*width: 25px;*/
    width: 36px;
    display: inline-block;
    vertical-align: middle;
    line-height: 20px;

}


ul.products li.product .product-colors-container .attr-color-hover:first-child {
    margin: 0;
}

ul.products li.product .product-colors-container .attr-color-hover.no-image {
    border-color: #808080;
}

/*ul.products li.product .product-colors-container span.plus,
ul.products li.product .product-colors-container .attr-color-hover {

}*/

.product-colors-container .attr-color-hover:nth-child(n+6),
.product-colors-container.active span.plus,
ul.products li.product .product-colors-container.active span.plus,
ul.products li.product .product-colors-container .attr-color-hover:nth-child(n+6) {
    display: none;
}

.product-colors-container.active .attr-color-hover:nth-child(n+6),
ul.products li.product .product-colors-container.active .attr-color-hover:nth-child(n+6) {
    display: inline-block;
}

.product-colors-container .attr-color-hover.no-image:before ,
ul.products li.product .product-colors-container .attr-color-hover.no-image:before {
    content: "x";
    display: block;
    color: #c00;
    text-align: center;
}

.variable-thumbnail:not(.active){
    display: none;
}

.gallery-container-custom:not(.active){
    display: none;
}

.woocommerce-product-gallery{
    display: block !important;
}

.rtl.woocommerce .content div.product div.images .flex-viewport {
    height: auto !important;
}

/* Single product attributes 
********************************************************************************/

form.variations_form td.value span.attr-triger {
    cursor: pointer;
}

form.variations_form td.value-pa_size select#pa_size,
form.variations_form td.value-pa_color select#pa_color {
    display: none;
}

/*form.variations_form .attribite-pa_size-container .attr-triger,
form.variations_form .attribite-pa_color-container .attr-triger {

}
*/

form.variations_form.custom-attribute-pannel table.variations tr td {
    display: block;
}

form.variations_form.custom-attribute-pannel table.variations tr td  a.clear_all_attr {
    display: none;
}

form.variations_form .attribite-pa_size-container .attr-triger,
form.variations_form .attribite-pa_color-container .attr-triger {
    margin:0 5px 0 0 ;
    min-width: 40px;
    height: 30px;
    border: 1px solid #000;
    display: inline-block;
    position: relative;
    line-height: 30px;
}

form.variations_form .attribite-pa_size-container .attr-triger span.status-attr{
    display: none;
}

form.variations_form .attribite-pa_color-container .attr-triger {
    width: 40px;
    height: 36px;
    border-color:transparent ;
}

form.variations_form .attribite-pa_color-container .attr-triger:hover,
form.variations_form .attribite-pa_color-container .attr-triger.active {
    border-color: #808080;
}

.rtl form.variations_form .attribite-pa_size-container .attr-triger,
.rtl form.variations_form .attribite-pa_color-container .attr-triger,
.rtl form.variations_form .attribite-pa_variation-color-container .attr-triger {
    margin:0 0 0 5px;   
}

.rtl form.variations_form .attribite-pa_size-container {
    direction: ltr;
    text-align: right;
}

/*
form.variations_form.cart .attribite-pa_variation-color-container .attr-triger:hover,
form.variations_form.cart .attribite-pa_variation-color-container .attr-triger.selected,
form.variations_form.cart .attribite-pa_variation-color-container .attr-triger.active,*/

form.variations_form .attribite-pa_size-container .attr-triger:hover,
form.variations_form .attribite-pa_size-container .attr-triger.active,
form.variations_form .attribite-pa_size-container .attr-triger.selected,
form.variations_form .attribite-pa_color-container .attr-triger:hover,
form.variations_form .attribite-pa_color-container .attr-triger.selected,
form.variations_form .attribite-pa_color-container .attr-triger.active  {
    border-color: #000;
    background-color: #000;
    color: #fff;
}


.woocommerce div.product .summary form.variations_form .attribite-pa_color-container .attr-triger.deactive,
form.variations_form .attr-triger.deactive {
    border-color: #FBD1AB;
    pointer-events: none;
    /*display: none;*/
} 


.woocommerce div.product .summary form.variations_form .attribite-pa_color-container .attr-triger.deactive .attr-text {}

form.variations_form .attr-triger.deactive .attr-text {
    color:  #FBD1AB;
    display: block;
}

.woocommerce div.product .summary form.variations_form .attribite-pa_color-container .attr-triger.deactive:before,
form.variations_form .attr-triger.deactive .attr-text:before {
  position: absolute;
  content: "";
  left: 0;
  top: 50%;
  right: 0;
  border-top: 1px solid #FBD1AB;
  border-color: inherit;

  -webkit-transform:rotate(-20deg);
  -moz-transform:rotate(-20deg);
  -ms-transform:rotate(-20deg);
  -o-transform:rotate(-20deg);
  transform:rotate(-20deg);
  z-index: 22;
}

.woocommerce div.product .summary form.variations_form .attribite-pa_color-container .attr-triger.deactive .attr-text:before {
    display: none;
}

form.variations_form.cart .attribite-pa_color-container .attr-triger .status-attr {    
    width: 30px;
    height: 30px;
    border: 0;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate( -50%, -50% );
    -moz-transform: translate( -50%, -50% );
    -ms-transform: translate( -50%, -50% );
    -o-transform: translate( -50%, -50% );
    transform: translate( -50%, -50% );    
}


/*form.variations_form .attribite-pa_size-container .attr-triger  .attr-text {

    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate( -50%, -50% ) skew(20deg);
    -moz-transform: translate( -50%, -50% ) skew(20deg);
    -ms-transform: translate( -50%, -50% ) skew(20deg);
    -o-transform: translate( -50%, -50% ) skew(20deg);
    transform: translate( -50%, -50% ) skew(20deg);
      
}*/

form.variations_form.cart .attribite-pa_variation-color-container .attr-triger .attr-text,
form.variations_form.cart .attribite-pa_color-container .attr-triger .attr-text{ 
    position: absolute;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    box-sizing: border-box;
    opacity: 0;
    width: 100px;
    margin-left: -50px;
    z-index: 99;
    left: 50%;
    transition: all 300ms;
    -webkit-transition: all 300ms;
    -moz-transition: all 300ms;
    pointer-events: none;
    /*bottom: 100%;*/
    bottom: -20px;

    background-color: #222222;
    color: #ffffff;
    border-radius: 3px;
    padding: 3px 6px;
}

form.variations_form.cart .attribite-pa_size-container .attr-triger:hover .attr-text {
    opacity: 1;
    visibility: visible;
}


.woocommerce ul.products li.product .variable-thumbnail a.hover-img {

}

.woocommerce ul.products li.product .variable-thumbnail a.hover-img:hover img,
.woocommerce ul.products li.product .variable-thumbnail a img.show-on-hover,
.woocommerce ul.products li.product .variable-thumbnail a.hover-img:hover img.regular {
    display: none;
}

.woocommerce ul.products li.product .variable-thumbnail  a.hover-img:hover img.show-on-hover {
    display: block;
}

