
/** Container */
.carousel {
  max-width: 100%;
}


/** Current image */
.current-image {
  margin-bottom: 1px;
  padding: 5px;
}

.current-image img {
	border-radius: 8px;
}

  .current-image a {
    display: block;
    height: var(--current-image-height);
    overflow: hidden;
    position: relative;
  }

    .current-image a:before {
      content: '';
      position: absolute;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 1;
      transition: box-shadow .1s linear;
    }

    .current-image a:focus {
      outline: 0;
    }

      /*.current-image a:focus:before {
        box-shadow: inset 0 0 0 1px black,
                    inset 0 0 0 4px white;
      }*/

  .current-image img {
    display: block;
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
    height: 100%;
  }


/** Previous and next buttons */
/*.prd-gallery .thumbnail[style] {
	max-width:126px !important;
	width:126px !important;
}*/

.button {
  background: none;
  border: 0;
  cursor: pointer;
  
  font-size: 30px;
  color: rgba(0,0,0,.7);

  padding: 0;
  margin: 0 1px;
  flex: 0 0 25px;
  
  transition: all .2s linear;
}

.prd-gallery button img, 
.prd-gallery button {
	border-radius:8px;
}

  /*.button:hover {
    background-color: rgba(0,0,0,.1);
    color: black;
  }*/

  /*.button:focus {
    outline: none;
    background-color: royalblue;
    color: rgba(255,255,255,1);
  }

  .button[aria-disabled="true"] {
    opacity: .3;
  }*/

.button {
	position: absolute;
}

.button span {
	position: absolute;
	top: 50%;
	width: 39px;
	height: 39px;
	z-index: 5;
}

.button.previous-button {	
	left:0;
}

.button.next-button {	
	right: 0;
}

.fa-angle-left:before {
	content:url(/wp-content/themes/divi-child/img/left-arrow.png);
	transform: scale(0.25);
	width: 39px;
	height: 39px;
	position: relative;
	display: inline-block;
	z-index: 5;
	left: -40px;
	top: 60%;
}

.fa-angle-right:before {
	content:url(/wp-content/themes/divi-child/img/right-arrow.png);
	transform: scale(0.25);
	width: 39px;
	height: 39px;
	position: relative;
	display: inline-block;
	z-index: 5;
	right: 40px;
	top: 60%;
}

.prd-gallery .slick-initialized .slick-slide {
	margin: 0 7px 0 7px;
}

.map-slider .fa-angle-left:before {	
	transform: scale(0.35);	
	top: 50%;
}

.map-slider .fa-angle-right:before {	
	transform: scale(0.35);	
	top: 50%;
}

/**
  Thumbnails container
*/
.thumbnails-track {
  display: flex;
  margin-top: 25px;
  position: relative;
}

.thumbnails {
  overflow: hidden;
}

.slick-track {
  display: flex;
}

section.carousel .slick-initialized .slick-slide {
	margin: 0 10px 0 5px;
}

/** Single thumbnail */
.thumbnail {
  flex: 0 0 var(--thumbnail-width);
  margin-right: 1px;
  position: relative;
}

  .thumbnail-button {
    display: block;
    padding: 0;
    height: var(--thumbnails-track-height);
    width: 100%;
    
    cursor: pointer;
    border: 0;
    background: none;
    background-color: rgba(0,0,0,.4);
    transition: opacity .1s linear;
  }

    .thumbnail-button:before {
      content: '';
      position: absolute;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 1;
      transition: box-shadow .1s linear;
	  background:rgb(255, 255, 255, 0.5);
    }
	
	.thumbnail-button[aria-current="true"]:before {
		background:transparent;
	}
	
    .thumbnail-button:focus {
      outline: 0;
    }

      /*.thumbnail-button:focus:before {
        box-shadow: inset 0 0 0 1px black,
                    inset 0 0 0 4px white;
      }*/

      .thumbnail-button:focus img,
      .thumbnail-button:hover img,
      .thumbnail-button[aria-current="true"] img {
        opacity: 1;
        /*filter: grayscale(0);*/
      }

    .thumbnail-button img {
      display: block;
      width: 100%;
      height: 100%;
      -o-object-fit: cover;
         object-fit: cover;
      
      opacity: 1;
      /*filter: grayscale(.6);*/
      transition: all .1s linear;
	  min-height: 110px;
    }

/** Credits at bottom */
.credits {
  display: inline-block;
  margin-top: 15px;
  padding: 10px;
  font-size: 14px;
  color: black;
  text-decoration: none;
  opacity: .7;
}

  .credits img {
    height: 30px;
    margin-left: 5px;
    margin-top: -2px;
    vertical-align: middle;
  }

  .credits:hover,
  .credits:focus {
    opacity: 1;
  }