
.cropWrapper{
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.darkOverlay{
    background: rgba(0,0,0,0.6);
    opacity: 0;
    height: 333px;
    position: absolute;
    width: 333px;
    transition: opacity 0.3s ease-in-out;
}

.darkOverlay p {
    color: white;
    font-family: OpenSansHebrew-Light;
    font-size: 2vh;
    padding-right: 10px;
    direction: rtl;
    overflow: hidden;
}

.carousel-item.woo-hover .darkOverlay{
    opacity: 1;
}
.carousel-item.active .darkOverlay{
    opacity: 1;
}

#wooCarouselDiv, #wooCarouselDiv_content, #wooCarouselDiv_videos{
    overflow: hidden;
    box-sizing: border-box;
    /*margin-left: -0.885417vw; !*calc(-17vw * 100 / 1920);*!*/
    /*width: 87.135417vw;!*calc((calc(313vw * 100 / 1920) * 5) + (calc(18vw * 100 / 1920) * 5) + calc(18vw * 100 / 1920));*!*/
    position: fixed;
    left: 252px;
    width: 1416px; /*1920 - 252 -252 */
    height: 50vh;
}

#wooCarouselItems, #wooCarouselItems_content, #wooCarouselItems_videos{
    position: relative;
    display: inline-block;
    transition: left ease-in-out 0.45s;
    margin-top: 87px;
}

.carousel-item.woo-hover{
    -webkit-transform: scale(1.4);
    transform: scale(1.4);
}

.carousel-item {
    float: left;
    width: 333px;
    height: 333px;
    transition: transform 0.3s ease-in-out;
    -webkit-transition: transform 0.3s ease-in-out;
    margin-right: 21px;
    border-radius: 2px;
}
@media only screen and (max-width: 1280px) {
    .carousel-item {
        width: 222px;
        height: 222px;
        margin-right: 14px;
    }
    .darkOverlay{
        width: 222px;
        height: 222px;
    }
    #wooCarouselDiv, #wooCarouselDiv_content, #wooCarouselDiv_videos{
        left: 168px;
        width: 944px;
    }
}

.carousel-item img{
    width: 100%;
    height: 100%;
    border-radius: 2px;
}


.carousel-item img.croppedImg {
    width: 134%;
    height: 134%;
    margin-top: -17%;
    border-radius: 2px;
}
.carousel-item.active{
    -webkit-transform: scale(1.4);
    transform: scale(1.4);
    z-index: 2;
    box-shadow: 0.185185vh 0.185185vh 1.85185vh #333;
}

.wooCarouselArrow {
    position: fixed;
    /*width: 2.5vw; !*calc(48vw * 100 / 1920);*!*/
    /*height: 4.35185vh; !*calc(47vh * 100 / 1080);*!*/
    /*top: 41.66667vh; !*calc(450vh * 100 / 1080);*!*/
    border-top: 0.2em  solid #ffffff;
    border-left: 0.2em  solid #ffffff;
    background: none;
    width: 47px;
    height: 47px;
    top: 515px;
}

.wooCarouselArrow:hover {
    border-color: #ffff00;
    border-top:1.0em  solid #ffffff;
    border-left:1.0em  solid #ffffff;
}

#wooCarouselArrow-prev {
    left: 68.7px; /*calc(80vw * 100 / 1920);*/
    transform: rotate(-45deg);
}

#wooCarouselArrow-next {
    right: 68.7px; /*calc(80vw * 100 / 1920);*/
    transform: rotate(-225deg);
}

.list .carousel-item .smallPlayIcon{
    position: absolute;
    width: 60px;
    height: 60px;
    margin-left: 136.5px;
    margin-top: -192px;
}

@media only screen and (max-width: 1280px) {
    .list .carousel-item .smallPlayIcon{
        margin-left: 86px;
        margin-top: -133px;
    }

    /*  TODO matan config 1280*720 carousel
  #wooCarouselDiv, #wooCarouselDiv_content, #wooCarouselDiv_videos {
      left: 13.125%;
      width: 73.75%;
  }
  #wooCarouselItems, #wooCarouselItems_content, #wooCarouselItems_videos{
      margin-top: 58px;
  }

  .carousel-item{
      width: 222px;
      height: 222px;
  }
   */

    #wooCarouselArrow-next{
        right: 3.57%;
    }
    .wooCarouselArrow {
        width: 31px;
        height: 31px;
        top: 48%;
    }
    #wooCarouselArrow-prev{
        left: 45.8px;
    }
}