#page-title-compromiso {
  position: relative;
  background-color: black;
  height: 255px;
  max-height: 255px;
  width: 100%;
  overflow: hidden;
}

#page-title-compromiso video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: 0;
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

#page-title-compromiso .container {
  position: relative;
  z-index: 2;
}

#page-title-compromiso .overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: black;
  opacity: 0.5;
  z-index: 1;
}

/*
@media (pointer: coarse) and (hover: none) {
#page-title-compromiso {
    background: url('assets/images/banners/bg-catalogo-5.png') black no-repeat center center scroll;
  }

#page-title-compromiso video {
    display: none;
  }
}*/

.seven-cols { justify-content: center; margin-top:-100px; position: relative;
    z-index: 2; }
.seven-cols .col-md-1 { padding:8px; flex: 0 0 13%; max-width: 14%; }

@media (min-width: 768px){
  .seven-cols .col-md-1,
  .seven-cols .col-sm-1,
  .seven-cols .col-lg-1  {
    width: 100%;
    *width: 100%;
   
  }
}

@media (min-width: 992px) {
  .seven-cols .col-md-1,
  .seven-cols .col-sm-1,
  .seven-cols .col-lg-1 {
    width: 14.285714285714285714285714285714%;
    *width: 14.285714285714285714285714285714%;
   
  }
}

/**
 *  The following is not really needed in this case
 *  Only to demonstrate the usage of @media for large screens
 */    
@media (min-width: 1200px) {
  .seven-cols .col-md-1,
  .seven-cols .col-sm-1,
  .seven-cols .col-lg-1 {
    width: 14.285714285714285714285714285714%;
    *width: 14.285714285714285714285714285714%;
   
  }
}

.grow { 
    transition: all .2s ease-in-out; 
}

.grow:hover { 
    transform: scale(1.1); 
}


@media (max-width: 767.98px) {
    .anillos { display:none; }

    .product { width: 100% !important; }

    .animob { padding:20px !important; }

    .animob .ambos { padding-left: 10px !important; padding-right: 10px !important; }

    .content-wrap { padding: 10px !important; }
}
/** MODIFICACION z-index */
.product-ext {
  cursor: pointer;
  border: 1px solid #666;
  padding: 10px;
  padding-bottom: 0;
  display:none;
  position:absolute;
  background-color: white;
  top: 0;
  left:0;
  z-index: 20;
}


.product-ext .product-image {
  border: none;
}

.product-ext .product-desc {
  padding: 0;
}

#product-slider {
  display: block;
}

/*.product:hover .product-desc {
    display: unset;
}

.product:hover #product-slider {
    display: block;
}

 .product:hover .image-product {
    display: none;
}

.product:hover .product-image {
    border: none;
} */

.ambos:hover .product-ext {
  display:block;
}



.carousel-control-prev-icon,
.carousel-control-next-icon {
  height: 32px;
  width: 32px;
  background-size: 100%, 100%;
  background-image: none;
}

.carousel-control-next-icon:after
{
  content: '';
  font-size: 22px;
  color: #fff;
  text-shadow: 1px 1px 2px #000000; /* Agrega sombra negra al texto */
}

.carousel-control-prev-icon:after {
  content: '';
  font-size: 22px;
  color: #fff;
  text-shadow: 1px 1px 2px #000000; /* Agrega sombra negra al texto */
}

.carousel-control-next {
    /*margin-right: -120px;*/
    margin-top: 120px;
    height: 32px !important;
    width: 32px !important;
}

.carousel-control-prev {
    /*margin-left: -120px;*/
    margin-top: 120px;
    height: 32px !important;
    width: 32px !important;
}


.carousel-inner {
    margin: 0 auto;
}

.product-desc .itemCatalogoRel {
  font-family: 'Playfair Display', serif;
  font-weight: 500;
  margin-bottom: 5px;
}

.product-cart {
  background-color: #770000;
  color: white;
  width:100%;
  padding-left: 10px;
  padding-right:10px;
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 12px;
  display: block;
  text-align: center;
}

.product-cart:hover { color:white; }

.product:hover .product-cart {
    display: block;
}

span.product-desc-color, span.product-desc {
        font-size: 14px;

}