@charset "UTF-8";
/* CSS Document */

.photo .jumbotron {
	max-width: 1250px;
}

.photo .col-12 { padding: 0 !important; margin-bottom: 0; }
.photo .col-12 a.a-spacer { margin-top: 1.05rem; padding: 0; }

span.blackbg { width: 100%; display: block; position: absolute; top: 0; z-index: 4; height:100%; background: rgba(0,0,0, 0); transition: background 0.5s ease; }
a.hoverText span.blackbg { width: 100%; }
a.hoverText.square span.blackbg { width: 100%; }

a.col-md-6.col-12:hover span.blackbg, a.col-md-12.col-12:hover span.blackbg, a.hoverText:hover span.blackbg { background: rgba(0,0,0, 0.25); }

span.bottomHeaders { position: absolute; display:block; width: 100%; text-align: center; color:#fff; text-transform: uppercase; font-size: 1.6em; bottom: 0; z-index: 5; letter-spacing: 1px; line-height: 0.8em; opacity: 0; transition: opacity 0.5s ease; }

span.bottomHeaders.long { bottom: 40%; }

a.hoverText span.bottomHeaders { width: 100%; font-size: 1em; padding: 0 1em; }
a.hoverText.square span.bottomHeaders { width: 100%; padding: 0 1em; }

.photo img { width: 100%; max-width: 100%; height: auto !important; }

.photo img {
	opacity: 1;
	transition: opacity 0.5s;
}

/*img[data-src] {
	opacity: 0;
}
*/
.pswp__caption__center { text-align: center !important; font-size: 1.2em !important; line-height: 14px !important; }

.my-gallery.row { margin-right: 0; margin-left: 0; display: block !important; }

.my-gallery.row figure { margin: 0 !important; }
figure.galleryBig { float: left; width: 60%; max-width: 60%; position: relative; overflow: hidden; }
figure.gallerySmall { float: right; width: 20%; max-width: 20%; position: relative; overflow: hidden; }
.slideNav { display: none; font-size: 12px; font-weight: bold; color: #fff;
}

@media screen and (max-width:500px) {
	figure.galleryBig { float: none; display: block; width: 100%; max-width: 100%; }
	figure.gallerySmall { float: none; display: none; }
	.slideNav { position: absolute; bottom: 10px; width: 100%; text-align: center; display: block; z-index: 1000; }
	.circle { width: 5px; height: 5px; border-radius: 50%; background: #fff; margin-right: 2px; display: inline-block; }
	.black-bottom{ background: linear-gradient(
    to bottom,
	  rgba(0, 0, 0, 0),
    black
  ); position: absolute; width: 100%; height: 60px; bottom: 0; }
}