GALLERY
(CLICK IMAGES TO VIEW GALLERIES)
BNJ Photography
.image-hover-layout .et_pb_blurb_content {
max-width: 100%;
}
.image-hover-layout .et_pb_blurb_content img {
width: 100%;
}
.image-hover-layout .et_pb_column {
overflow: hidden;
position: relative;
}
.image-hover-layout .et_pb_column img {
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
display: block;
}
.image-hover-layout .et_pb_column:hover img {
transform: scale(1.1);
}
.image-hover-layout .et_pb_column:hover .et_pb_main_blurb_image:after {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.4);
content: '';
pointer-events: none;
}
.image-hover-layout .et_pb_main_blurb_image {
margin: 0;
}
.image-hover-layout .et_pb_column .et_pb_blurb_content:before {
top: 50px;
right: 30px;
bottom: 50px;
left: 30px;
border-top: 1px solid #fff;
border-bottom: 1px solid #fff;
-webkit-transform: scale(0, 1);
transform: scale(0, 1);
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
position: absolute;
content: '';
opacity: 0;
-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
transition: opacity 0.35s, transform 0.35s;
z-index: 1;
pointer-events: none;
}
.image-hover-layout .et_pb_column .et_pb_blurb_content:after {
top: 30px;
right: 50px;
bottom: 30px;
left: 50px;
border-right: 1px solid #fff;
border-left: 1px solid #fff;
-webkit-transform: scale(1, 0);
transform: scale(1, 0);
-webkit-transform-origin: 100% 0;
transform-origin: 100% 0;
position: absolute;
content: '';
opacity: 0;
-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
transition: opacity 0.35s, transform 0.35s;
pointer-events: none;
}
.image-hover-layout .et_pb_column:hover .et_pb_blurb_content:before, .image-hover-layout .et_pb_column:hover .et_pb_blurb_content:after {
-webkit-transition-delay: 0.15s;
transition-delay: 0.15s;
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}
.image-hover-layout .et_pb_column .et_pb_blurb_container {
opacity: 0;
color: #fff;
position: absolute;
top: 40%; /* Adjust this if the text is in the wrong position */
width: 100%;
text-align: center;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
margin: 0;
padding: 0 55px;
pointer-events: none;
line-height: 1em !important;
}
.image-hover-layout .et_pb_column:hover .et_pb_blurb_container {
opacity: 1;
position: absolute;
top: 45%;
width: 100%;
text-align: center;
color: #fff;
line-height: 1em !important;
}
.image-hover-layout.show-title h4 {
background: #fff;
padding: 10px!important;
display: inline-block;
margin-bottom: 10px;
color: #333 !important;
}
.image-hover-layout.show-title .et_pb_blurb_container {
opacity: 1;
top: 45%;
}
.image-hover-layout.show-title .et_pb_column:hover .et_pb_blurb_container {
opacity: 1;
top: 40%;
}
.image-hover-layout.show-title .et_pb_blurb_container p {
opacity: 0;
}
.image-hover-layout.show-title .et_pb_column:hover .et_pb_blurb_container p {
opacity: 1;
}
.image-hover-gallery-layout .et_pb_gallery_item {
overflow: hidden;
position: relative;
}
.image-hover-gallery-layout .et_pb_gallery_item img {
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
display: block;
}
.image-hover-gallery-layout .et_pb_gallery_item:hover img {
transform: scale(1.1);
}
.image-hover-gallery-layout .et_pb_gallery_item .et_pb_gallery_image:before {
top: 50px;
right: 30px;
bottom: 50px;
left: 30px;
border-top: 1px solid #fff;
border-bottom: 1px solid #fff;
-webkit-transform: scale(0, 1);
transform: scale(0, 1);
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
position: absolute;
content: '';
opacity: 0;
-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
transition: opacity 0.35s, transform 0.35s;
z-index: 4;
pointer-events: none;
}
.image-hover-gallery-layout .et_pb_gallery_item .et_pb_gallery_image:after {
top: 30px;
right: 50px;
bottom: 30px;
left: 50px;
border-right: 1px solid #fff;
border-left: 1px solid #fff;
-webkit-transform: scale(1, 0);
transform: scale(1, 0);
-webkit-transform-origin: 100% 0;
transform-origin: 100% 0;
position: absolute;
content: '';
opacity: 0;
-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
transition: opacity 0.35s, transform 0.35s;
pointer-events: none;
z-index: 4;
}
.image-hover-gallery-layout .et_pb_gallery_item:hover .et_pb_gallery_image:before, .image-hover-gallery-layout .et_pb_gallery_item:hover .et_pb_gallery_image:after {
-webkit-transition-delay: 0.15s;
transition-delay: 0.15s;
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}
.image-hover-gallery-layout .et_pb_gallery_item .et_pb_gallery_title, .image-hover-gallery-layout .et_pb_gallery_item .et_pb_gallery_caption {
opacity: 0;
color: #fff;
position: absolute;
top: 40%;
width: 100%;
text-align: center;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
margin: 0;
padding: 0 55px;
pointer-events: none;
line-height: 1em !important;
z-index: 3;
}
.image-hover-gallery-layout .et_pb_gallery_item:hover .et_pb_gallery_title {
opacity: 1;
position: absolute;
top: 45%;
width: 100%;
text-align: center;
color: #fff;
line-height: 1em !important;
}
.image-hover-gallery-layout .et_pb_gallery_item:hover .et_pb_gallery_caption {
opacity: 1;
position: absolute;
top: 55%;
width: 100%;
text-align: center;
color: #fff;
line-height: 1em !important;
}
.image-hover-gallery-layout.show-title .et_pb_gallery_title, .image-hover-gallery-layout.show-title .et_pb_gallery_item:hover .et_pb_gallery_title {
background: #fff;
padding: 10px !important;
margin: 0 auto;
color: #333 !important;
opacity: 1;
left: 55px;
right: 55px;
width: initial;
}
.image-hover-gallery-layout.show-title .et_pb_gallery_item:hover .et_pb_gallery_title {
top: 35%;
}