/* ---- gallery tiles ---- */

figcaption.mask {
    background-color: rgba(54, 55, 50, 0.75);
    color: #fff;
    padding: 25px;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    opacity: 0;
    margin: 0;
    -webkit-transition: all 0.4s;
       -moz-transition: all 0.4s;
        -ms-transition: all 0.4s;
         -o-transition: all 0.4s;
            transition: all 0.4s;
}
figcaption.mask h3 {
    margin: 0 auto;
    margin-top: 40%;
    color: #fff;
}
figcaption.mask h4 {
    color: white; font-weight: 300; font-size: 1em;
    }
figcaption.mask p, .fancybox-title h4, .fancybox-title h3.tile {
    display: none;
}
/*.fancybox-caption p {
    display: block;}*/
a.fancybox:hover figcaption.mask {
    opacity: 1;
    top: 0;}
a.fancybox img {
    width: 100%; height: 100%;
    scale: 1.0;
    overflow: hidden;
    transition: all .8s;}
a.fancybox:hover img {
        scale: 1.25;
        overflow: hidden!important;
}
/* ---- /tiles ---- */

/* ---- slides ---- */
.fancybox-is-open .fancybox-bg {
    background: rgba(0,0,0,0.8);
}
body.fancybox-active main, body.fancybox-active header {
    filter: blur(7px);
}
.fancybox-content {
    border: 1px solid rgba(200,200,200,0.25);
    padding: 0; 
    margin: 0 auto;
} 
.fancybox-button--arrow_left i, .fancybox-button--arrow_right i {
    font-size: 24px!important;}
}
.fancybox-slide {
    outline: none;
    width: 100vw;
    overflow: auto;
    position: absolute;
    top: 0;
    opacity: 0;
    transition: opacity 0.25s ease-in!important;
    vertical-align: middle;
      background: transparent;
}
.fancybox-slide--html {
    padding: 3%!important;
}
.fancybox-slide.fancybox-slide--html.fancybox-slide--complete {
    opacity: 1!important;
    transition: opacity 0.25s ease-in!important;
}
.fancybox-slide:before, .fancybox-slide:after { 
    opacity: 0;
    transition: opacity 0.25s ease-in; }

.folio-slide {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  color: #fff;
  background: rgba(0, 0, 0, 1);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.8);
  padding-bottom: 4px;
}
.folio-slide .fancybox-button {
    outline: none;
}
.folio-slide .folio-pics .fancybox-button {
    background: rgba(0, 0, 0, 0);
    height: 100%;
    position: absolute;
    top: 0;
    width: 20%;
    transition: all 0.5s ease-in-out!important;
    }
    .folio-slide .folio-pics .fancybox-button:hover {
        background: rgba(0, 0, 0, 0.1);
        transition: all 0.5s ease-in-out!important;
    }
.folio-slide .folio-pics .fancybox-button div i { 
    position: relative;
    top: 40%; width: auto;
    opacity: 0.5;
    transition: all 0.1s ease-in-out!important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
    background: rgba(0, 0, 0, 0.5);
    padding: 8px;
}
.folio-slide .folio-pics .fancybox-button:hover div i {
    opacity: 1;
    transform: translateX(0);
    transition: all 0.1s ease-in-out!important;
}
.fancybox-button--arrow_left, .fancybox-button--arrow_left div i {
    left: -3px; text-align: left;
    transform-origin: bottom left;
    transform: translateX(3px);
}
.folio-slide .fancybox-button--arrow_right, .fancybox-button--arrow_right div i {
    right: -3px; text-align: right;
    transform-origin: bottom right;
    transform: translateX(-3px);
}
.fancybox-button.fancybox-button--close, .fancybox-button.fancybox-close-small {
    width: 40px; height: 40px; position: absolute; top: 0; right: 0; line-height: 20px; font-size: 20px;
    background: rgba(0, 0, 0, 0.3);
    opacity: 0.5;
    transition: opacity 0.1s ease-in-out!important;
}
.fancybox-button.fancybox-button--close:hover, .fancybox-button.fancybox-close-small:hover {
    opacity: 1;
    }

.folio-slide.universal .fancybox-button--arrow_left, .folio-slide.universal .fancybox-button--arrow_right {
    display: none;
}
.folio-slide .folio-pics img {
  display: block; 
  height: 100%;
  max-height: 750px;
  max-width: 100%;
  margin: 0 auto;
}
.folio-slide .row { margin: 0; }
.folio-slide .folio-detail, .folio-pics {
  padding: 10px 16px;
}
.folio-slide .folio-pics {
  margin-bottom: -12px;
}
.folio-slide .folio-detail {
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
  color: var(--ph-litetext);
}
.folio-slide .folio-detail-label { 
  width: 65px; 
  line-height: 18px;
  font-weight: 400;
  color: var(--ph-litetext);
  letter-spacing: .5px;
  opacity: 0.7;
  float: left;
  display: block;
}
.folio-slide.fancy-dot{
  position: absolute; bottom: 30px; left: 50%;
}
.fancy-dot {
    display: block;
    background-color: green;
    opacity: 0.6;
    height: 50px;
    width: 50px;
    border-radius: 10px;
    margin: 0 12px;
}
.folio-slide .description {
    border-bottom: 1px solid rgba(60,60,60,1);
    padding: 8px 0 10px 0;
    margin-bottom: -8px;
    color: white;
}
.duckula {display: none;}

/* ==== |- XS ONLY -| ==== */
@media (max-width: 767px) {
  .folio-detail {
    font-size: 0.9em!important;
}
}
/* ======================= */

/*.fancybox-slide--next .folio-slide>div {
  transform: translateX(50%);
  opacity: 0;
}
.fancybox-slide--prev .folio-slide>div {
  transform: translateX(-50%);
  opacity: 0;
}
.fancybox-slide .folio-slide>div {
  transform: translateX(0);
  opacity: 1;
  transition: transform .3s ease-out;
}*/


