/* vim: set ts=2 sw=2 sts=2 et: */

/**
 * Cloud zoom styles
 *
 * Copyright (c) 2011-present Qualiteam software Ltd. All rights reserved.
 * See https://www.x-cart.com/license-agreement.html for license details.
 */

.cloud-zoom-big {
  border: none;
  overflow: visible;
}

.cloud-zoom-big:before {
  content: " ";
  position: absolute;
  border: 1px solid #e2e2e2;
  top: -1px;
  bottom: -1px;
  left: -1px;
  right: -1px;
}

.product-photo.cloud-zoom-photo img.photo.product-thumbnail {
  object-fit: fill;
  width: auto;
  height: auto;
}

.product-photo.cloud-zoom-photo .mousetrap {
  z-index: 9990 !important;
  width: 100% !important;
  height: 100% !important;
  left: 0 !important;
  top: 0 !important;
}

.product-photo.cloud-zoom-inside .mousetrap:hover {
  z-index: 9999 !important;
}

.product-photo.cloud-zoom-photo .cloud-zoom-lens {
  border: 4px solid rgba(255, 255, 255, 0.5) !important;
}

.product-photo.cloud-zoom-photo .cloud-zoom-lens:before {
  content: " ";
  position: absolute;
  border: 1px solid #e2e2e2;
  top: -1px;
  bottom: -1px;
  left: -1px;
  right: -1px;
}

.product-photo .cloud-zoom {
  z-index: auto !important;
  width: 366px !important;
  height: 366px !important;
  display: flex !important;
  justify-content: center;
  align-items: center;
}


@media(max-width: 1199px) {
  .product-photo .cloud-zoom {
    width: 310px !important;
    height: 370px !important;
  }
}

@media(max-width: 991px) {
  .product-photo .cloud-zoom {
    width: 300px !important;
    height: 360px !important;
  }
}

@media(max-width: 767px) {
  .product-photo .cloud-zoom {
    width: 100% !important;
    height: 340px !important;
  }
}

.product-photo #wrap .cloud-zoom-big {
  z-index: 9992 !important;
}

.product-photo.cloud-zoom-photo.cloud-zoom-inside .cloud-zoom-big {
  position: relative;
  width: 100% !important;
  height: 100% !important;
  border-right: none !important;
  border-bottom: none !important;
}

.product-photo.cloud-zoom-photo.cloud-zoom-inside:hover {
  overflow: visible;
}

.product-photo.cloud-zoom-photo.cloud-zoom-inside:hover #wrap .cloud-zoom-big {
  z-index: 9998 !important;
}

.product-photo.cloud-zoom-photo.cloud-zoom-inside:hover #wrap .mousetrap {
  z-index: 9999 !important;
}

.product-photo.cloud-zoom-photo.cloud-zoom-inside:hover #wrap {
  z-index: auto !important;
}

.product-photo.cloud-zoom-outside {
  overflow: visible !important;
}

.product-photo.cloud-zoom-outside .cloud-zoom-big {
  left: 380px !important;
  border: none;
}