/* smaller, dark, rounded square */
.flickity-prev-next-button {
  width: 30px;
  height: 30px;
  border-radius: 5px;
  background: #d5d5d5;
}
.flickity-prev-next-button:hover {
  background: #000;
}
/* arrow color */
.flickity-prev-next-button .arrow {
  fill: white;
}
.flickity-prev-next-button.no-svg {
  color: white;
}
/* position outside */
.flickity-prev-next-button.previous {
  left: -40px;
}
.flickity-prev-next-button.next {
  right: -50px;
}
.flickity-page-dots {
    display:none;
}
/* custom css overrides to current pdp layout for adobe section */
#product-recommendation ul.prod-carousel {
    margin: 0 60px;
}
#product-recommendation .photo {
    width:25%;
}
#product-recommendation .photo .image-container .exp-view{
    font-family: 'Roboto Condensed', Arial;
    background: rgba(0, 0, 0, .5);
    position:absolute;
    top:78%;
    left:50%;
    display:none;
    cursor: pointer;
    text-decoration: none;
    margin: 0;
    width: 65%;
    padding: 8px 0;
    min-width:10rem !important;
    font-size: 1.2rem;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    transition: background 1s;
}
#product-recommendation .photo .image-container .exp-view:hover{
    background: rgba(0, 0, 0, 1);
}
html.no-touch #product-recommendation .photo:hover .image-container .exp-view {
    display:none;
}
#product-recommendation .prod-carousel .image-container {
    position:relative;
}
html.touch .flickity-prev-next-button {
    display:none;
}

@media only screen and (max-width: 999px) {   
    #product-recommendation ul.prod-carousel {
        margin: 0;
    }
     #product-recommendation .photo {
        width:47%;
    }
    #product-recommendation {
        padding: 20px 0 20px 0;
    }
    .flickity-prev-next-button.next {
      right:6px;
    }
    .flickity-prev-next-button.previous {
      left: 6px;
    }
    #product-recommendation .left-column, #product-recommendation .right-column {
      width:100%;
    }
    .adobe-caption {
      margin-bottom:20px;
    }
}
