.thegem-heading {
position: relative;
}
.thegem-heading.thegem-heading-animate:not(.thegem-heading-animated ) {
opacity: 0 !important;
}
.thegem-heading .thegem-heading-line-wrap {
display: block;
overflow: hidden;
}
.thegem-heading .thegem-heading-word-wrap,
.thegem-heading .thegem-heading-letter-wrap {
display: inline-flex;
overflow: hidden;
}
.thegem-heading .thegem-heading-word {
display: inline-flex;
white-space: nowrap;
} .thegem-heading.lines-slide-up.thegem-heading-animated .thegem-heading-line {
animation-name: thegemHeadingLinesSlideUp;
transform: translateY(100%);
display: inline-block;
animation-fill-mode: forwards;
animation-duration: 1200ms;
animation-timing-function: cubic-bezier(0,1,0.3,1);
}
@keyframes thegemHeadingLinesSlideUp {
from {
transform: translateY(100%);
}
to {
transform: translateX(0);
}
} .thegem-heading.lines-slide-up-random.thegem-heading-animated .thegem-heading-word {
animation-name: thegemHeadingLinesSlideUpRandom;
transform: translateY(100%);
animation-fill-mode: forwards;
animation-duration: 1200ms;
animation-timing-function: cubic-bezier(0.3, 0, 0, 1);
}
@keyframes thegemHeadingLinesSlideUpRandom {
from {
transform: translateY(100%);
}
to {
transform: translateX(0);
}
} .thegem-heading.words-slide-up.thegem-heading-animated .thegem-heading-word {
animation-name: thegemHeadingWordsSlideUp;
transform: translateY(100%);
animation-fill-mode: forwards;
animation-duration: 1000ms;
animation-timing-function: cubic-bezier(0.3, 1.7, 0.4, 1);
}
@keyframes thegemHeadingWordsSlideUp {
from {
transform: translateY(100%);
}
to {
transform: translateX(0);
}
} .thegem-heading.words-slide-left.thegem-heading-animated .thegem-heading-word {
animation-name: thegemHeadingWordsSlideLeft;
transform: translateX(100%);
animation-fill-mode: forwards;
animation-duration: 1200ms;
animation-timing-function: cubic-bezier(0.25,1,0.5,1);
}
@keyframes thegemHeadingWordsSlideLeft {
from {
transform: translateX(100%);
}
to {
transform: translateX(0);
}
} .thegem-heading.words-slide-right.thegem-heading-animated .thegem-heading-word {
animation-name: thegemHeadingWordsSlideRight;
transform: translateX(-100%);
animation-fill-mode: forwards;
animation-duration: 1200ms;
animation-timing-function: cubic-bezier(0.25,1,0.5,1);
}
@keyframes thegemHeadingWordsSlideRight {
from {
transform: translateX(-100%);
}
to {
transform: translateX(0);
}
} .thegem-heading.letters-slide-up.thegem-heading-animated .thegem-heading-letter {
animation-name: thegemHeadingLettersSlideUp;
position: relative;
transform: translateY(100%);
display: inline-flex;
animation-fill-mode: forwards;
animation-duration: 350ms;
animation-timing-function: cubic-bezier(0.3, 1.7, 0.4, 1);
}
@keyframes thegemHeadingLettersSlideUp {
from {
transform: translateY(100%);
}
to {
transform: translateY(0);
}
} .thegem-heading.typewriter.thegem-heading-animated .thegem-heading-letter {
animation-name: thegemHeadingTypewriter;
position: relative;
opacity: 0;
display: inline-flex;
animation-fill-mode: forwards;
animation-duration: 0ms;
animation-timing-function: inherit;
}
@keyframes thegemHeadingTypewriter {
from { opacity: 1; }
to { opacity: 1; }
} .thegem-heading.letters-scale-out.thegem-heading-animated .thegem-heading-letter {
animation-name: thegemHeadingLettersScaleOut;
position: relative;
transform: scale(1.5);
opacity: 0;
display: inline-flex;
animation-fill-mode: forwards;
animation-duration: 500ms;
animation-timing-function: cubic-bezier(0.3, 4, 0.4, 1);
}
@keyframes thegemHeadingLettersScaleOut {
from {
opacity: 0;
transform: scale(1.5);
}
to {
opacity: 1;
transform: scale(1);
}
} .thegem-heading-wrap {
position: relative;
display: inline-flex;
}
.thegem-heading.background-sliding {
display: inline-flex;
overflow: hidden;
position: relative;
z-index: 1;
}
.thegem-heading.background-sliding:before {
content: '';
transform-origin: left;
transform: scale(0, 1);
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
.thegem-heading.background-sliding.thegem-heading-animated:before {
animation-name: thegemHeadingBackgroundSliding;
animation-duration: 700ms;
animation-fill-mode: forwards;
}
@keyframes thegemHeadingBackgroundSliding{
from {
transform: scale(0, 1);
}
to {
transform: scale(1, 1);
}
}
.thegem-heading.background-sliding .thegem-heading-text-wrap {
overflow: hidden;
transform: translateX(-105%);
position: relative;
z-index: 2;
}
.thegem-heading.thegem-heading-animated .thegem-heading-text-wrap {
transform: translateX(0%);
transition-property: transform;
transition-duration: 700ms;
}
.thegem-heading.background-sliding .thegem-heading-text {
transform: translateX(105%);
display: block;
position: relative;
z-index: 2;
}
.thegem-heading.thegem-heading-animated .thegem-heading-text {
transform: translateX(0%);
transition-property: transform;
transition-duration: inherit;
transition-delay: inherit;
transition-timing-function: inherit;
} .thegem-heading-rotating {
position: relative;
display: inline-flex;
overflow: hidden;
transition-property: width, color;
transition-timing-function: ease;
transition-duration: 500ms, 300ms;
}
.thegem-heading-rotating:before {
content: '\200b';
}
.thegem-heading-rotating-text {
position: relative;
top: 0;
left: 0;
opacity: 1;
overflow: hidden;
display: inline-flex;
white-space: nowrap;
transition-property: width, opacity;
transition-timing-function: ease;
transition-duration: 500ms;
}
.thegem-heading-rotating[data-animation="fade"] .thegem-heading-rotating-text {
display: inline-block;
} .thegem-heading.thegem-heading-animated.fade-tb {
animation-duration: .7s;
animation-fill-mode: both;
animation-name: thegemHeadingFadeTB;
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.275);
}
@keyframes thegemHeadingFadeTB {
from {
transform: translate(0, -10%);
opacity: 0;
}
to {
transform: translate(0, 0);
opacity: 1;
}
} .thegem-heading.thegem-heading-animated.fade-bt {
animation-duration: .7s;
animation-fill-mode: both;
animation-name: thegemHeadingFadeBT;
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.275);
}
@keyframes thegemHeadingFadeBT {
from {
transform: translate(0, 10%);
opacity: 0;
}
to {
transform: translate(0, 0);
opacity: 1;
}
} .thegem-heading.thegem-heading-animated.fade-lr {
animation-duration: .7s;
animation-fill-mode: both;
animation-name: thegemHeadingFadeLR;
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.275);
}
@keyframes thegemHeadingFadeLR {
from {
transform: translate(-10%, 0);
opacity: 0;
}
to {
transform: translate(0, 0);
opacity: 1;
}
} .thegem-heading.thegem-heading-animated.fade-rl {
animation-duration: .7s;
animation-fill-mode: both;
animation-name: thegemHeadingFadeRL;
animation-timing-function: cubic-bezier(.175,.885,.32,1.275);
}
@keyframes thegemHeadingFadeRL {
from {
transform: translate(10%, 0);
opacity: 0;
}
to {
transform: translate(0, 0);
opacity: 1;
}
} .thegem-heading.thegem-heading-animated.fade-simple {
animation-duration: 1s;
animation-fill-mode: both;
animation-name: thegemHeadingFadeSimple;
}
@keyframes thegemHeadingFadeSimple {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@media screen and (min-width: 1024px) {
.thegem-heading.thegem-heading-animate-disable-desktop,
.thegem-heading.thegem-heading-animate-disable-desktop .thegem-heading-line,
.thegem-heading.thegem-heading-animate-disable-desktop .thegem-heading-word,
.thegem-heading.thegem-heading-animate-disable-desktop .thegem-heading-letter,
.thegem-heading.thegem-heading-animate-disable-desktop .thegem-heading-text-wrap,
.thegem-heading.thegem-heading-animate-disable-desktop .thegem-heading-text,
.thegem-heading.thegem-heading-animate-disable-desktop:before {
animation: none !important;
transform: none !important;
opacity: 1 !important;
transition: none !important;
}
}
@media screen and (max-width: 1023px) and (min-width: 768px) {
.thegem-heading.thegem-heading-animate-disable-tablet,
.thegem-heading.thegem-heading-animate-disable-tablet .thegem-heading-line,
.thegem-heading.thegem-heading-animate-disable-tablet .thegem-heading-word,
.thegem-heading.thegem-heading-animate-disable-tablet .thegem-heading-letter,
.thegem-heading.thegem-heading-animate-disable-tablet .thegem-heading-text-wrap,
.thegem-heading.thegem-heading-animate-disable-tablet .thegem-heading-text,
.thegem-heading.thegem-heading-animate-disable-tablet:before {
animation: none !important;
transform: none !important;
opacity: 1 !important;
transition: none !important;
}
}
@media screen and (max-width: 767px) {
.thegem-heading.thegem-heading-animate-disable-mobile,
.thegem-heading.thegem-heading-animate-disable-mobile .thegem-heading-line,
.thegem-heading.thegem-heading-animate-disable-mobile .thegem-heading-word,
.thegem-heading.thegem-heading-animate-disable-mobile .thegem-heading-letter,
.thegem-heading.thegem-heading-animate-disable-mobile .thegem-heading-text-wrap,
.thegem-heading.thegem-heading-animate-disable-mobile .thegem-heading-text,
.thegem-heading.thegem-heading-animate-disable-mobile:before {
animation: none !important;
transform: none !important;
opacity: 1 !important;
transition: none !important;
}
}.items-animations-timer-element {
font-size: 0;
line-height: 1;
height: 0;
-webkit-opacity: 0;
-moz-opacity: 0;
filter: alpha(opacity=0);
opacity: 0;
-moz-transition: opacity 0.2s;
-ms-transition: opacity 0.2s;
-o-transition: opacity 0.2s;
-webkit-transition: opacity 0.2s;
transition: opacity 0.2s;
}
.items-animations-timer-element.start-timer {
-webkit-opacity: 1;
-moz-opacity: 1;
filter: alpha(opacity=100);
opacity: 1;
} .item-animation-move-up .item-animations-inited.before-start {
-moz-transform: translateY(40px) !important;
-ms-transform: translateY(40px) !important;
-webkit-transform: translateY(40px) !important;
-o-transform: translateY(40px) !important;
transform: translateY(40px) !important;
zoom: 1;
-webkit-opacity: 0 !important;
-moz-opacity: 0 !important;
filter: alpha(opacity=0) !important;
opacity: 0 !important;
}
.item-animation-move-up .item-animations-inited.before-start.start-animation {
-o-transition: opacity 1s, transform 1s !important;
-webkit-transition: opacity 1s, transform 1s !important;
transition: opacity 1s, transform 1s !important;
-moz-transform: translateY(0px) !important;
-ms-transform: translateY(0px) !important;
-webkit-transform: translateY(0px) !important;
-o-transform: translateY(0px) !important;
transform: translateY(0px) !important;
zoom: 1;
-webkit-opacity: 1 !important;
-moz-opacity: 1 !important;
filter: alpha(opacity=100) !important;
opacity: 1 !important;
} .item-animation-bounce .item-animations-inited.before-start {
-moz-transform: scale(0.001) !important;
-ms-transform: scale(0.001) !important;
-webkit-transform: scale(0.001) !important;
-o-transform: scale(0.001) !important;
transform: scale(0.001) !important;
zoom: 1;
-webkit-opacity: 0 !important;
-moz-opacity: 0 !important;
filter: alpha(opacity=0) !important;
opacity: 0 !important;
}
.item-animation-bounce .item-animations-inited.before-start.start-animation {
-o-transition: opacity 0.4s, transform 0.4s !important;
-webkit-transition: opacity 0.4s, transform 0.4s !important;
transition: opacity 0.4s, transform 0.4s !important;
-moz-transform: scale(1) !important;
-ms-transform: scale(1) !important;
-webkit-transform: scale(1) !important;
-o-transform: scale(1) !important;
transform: scale(1) !important;
zoom: 1;
-webkit-opacity: 1 !important;
-moz-opacity: 1 !important;
filter: alpha(opacity=100) !important;
opacity: 1 !important;
} .item-animation-fade-in .item-animations-inited.before-start {
zoom: 1;
-webkit-opacity: 0 !important;
-moz-opacity: 0 !important;
filter: alpha(opacity=0) !important;
opacity: 0 !important;
}
.item-animation-fade-in .item-animations-inited.before-start.start-animation {
-o-transition: opacity 0.7s !important;
-webkit-transition: opacity 0.7s !important;
transition: opacity 0.7s !important;
-webkit-opacity: 1 !important;
-moz-opacity: 1 !important;
filter: alpha(opacity=100) !important;
opacity: 1 !important;
} .item-animation-scale .item-animations-inited.before-start {
-moz-transform: scale(0.001) !important;
-ms-transform: scale(0.001) !important;
-webkit-transform: scale(0.001) !important;
-o-transform: scale(0.001) !important;
transform: scale(0.001) !important;
}
.item-animation-scale .item-animations-inited.before-start.start-animation {
-o-transition: transform 0.57s ease-in-out !important;
-webkit-transition: transform 0.57s ease-in-out !important;
transition: opacity transform 0.57s ease-in-out !important;
-moz-transform: scale(1) !important;
-ms-transform: scale(1) !important;
-webkit-transform: scale(1) !important;
-o-transform: scale(1) !important;
transform: scale(1) !important;
} .item-animation-flip .item-animations-inited.before-start {
-moz-transform: rotate3d(1, 0, 0, -80deg) !important;
-ms-transform: rotate3d(1, 0, 0, -80deg) !important;
-webkit-transform: rotate3d(1, 0, 0, -80deg) !important;
-o-transform: rotate3d(1, 0, 0, -80deg) !important;
transform: rotate3d(1, 0, 0, -80deg) !important;
zoom: 1;
-webkit-opacity: 0 !important;
-moz-opacity: 0 !important;
filter: alpha(opacity=0) !important;
opacity: 0 !important;
}
.item-animation-flip .item-animations-inited.before-start.start-animation {
-o-transition: opacity 0.7s ease-in-out, transform 0.7s ease-in-out !important;
-webkit-transition: opacity 0.7s ease-in-out, transform 0.7s ease-in-out !important;
transition: opacity 0.7s ease-in-out, transform 0.7s ease-in-out !important;
-moz-transform: rotate3d(0, 0, 0, 0deg) !important;
-ms-transform: rotate3d(0, 0, 0, 0deg) !important;
-webkit-transform: rotate3d(0, 0, 0, 0deg) !important;
-o-transform: rotate3d(0, 0, 0, 0deg) !important;
transform: rotate3d(0, 0, 0, 0deg) !important;
-webkit-opacity: 1 !important;
-moz-opacity: 1 !important;
filter: alpha(opacity=100) !important;
opacity: 1 !important;
} .item-animation-fall-perspective .item-animations-inited.before-start {
-moz-transform: translateZ(400px) translateY(300px) rotateX(-65deg) !important;
-ms-transform: translateZ(400px) translateY(300px) rotateX(-65deg) !important;
-webkit-transform: translateZ(400px) translateY(300px) rotateX(-65deg) !important;
-o-transform: translateZ(400px) translateY(300px) rotateX(-65deg) !important;
transform: translateZ(400px) translateY(300px) rotateX(-65deg) !important;
zoom: 1;
-webkit-opacity: 0 !important;
-moz-opacity: 0 !important;
filter: alpha(opacity=0) !important;
opacity: 0 !important;
}
.item-animation-fall-perspective .item-animations-inited.before-start.start-animation {
-o-transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out !important;
-webkit-transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out !important;
transition: opacity 0.75s ease-in-out, transform 0.75s ease-in-out !important;
-moz-transform: translateZ(0px) translateY(0px) rotateX(0deg) !important;
-ms-transform: translateZ(0px) translateY(0px) rotateX(0deg) !important;
-webkit-transform: translateZ(0px) translateY(0px) rotateX(0deg) !important;
-o-transform: translateZ(0px) translateY(0px) rotateX(0deg) !important;
transform: translateZ(0px) translateY(0px) rotateX(0deg) !important;
-webkit-opacity: 1 !important;
-moz-opacity: 1 !important;
filter: alpha(opacity=100) !important;
opacity: 1 !important;
}.hover-zooming-blur .portfolio-item .image .image-inner img,
.hover-zooming-blur .gallery-item .overlay-wrap .image-wrap img {
overflow: hidden;
-webkit-transform: translate(0, 0) scale(1);
transform: translate(0, 0) scale(1);
-webkit-transition: -webkit-transform 0.5s;
transition: transform 0.5s;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .image-inner img,
.hover-zooming-blur .gallery-item:is(:hover, .hover-effect) .overlay-wrap .image-wrap img {
-webkit-transform: translate(0, 0) scale(1.12);
transform: translate(0, 0) scale(1.12);
-webkit-transition: -webkit-transform 0.5s;
transition: transform 0.5s;
}
.news-grid.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image.format-video.has-post-thumbnail .image-inner img {
-webkit-transform: translate(0, 0) scale(1);
transform: translate(0, 0) scale(1);
}
.hover-zooming-blur .portfolio-item .image .overlay,
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay,
.hover-zooming-blur .gallery-item .overlay-wrap .overlay,
.hover-zooming-blur .gallery-item:is(:hover, .hover-effect) .overlay-wrap .overlay {
display: block;
}
.hover-zooming-blur .portfolio-item .image .overlay:before,
.hover-zooming-blur .gallery-item .overlay-wrap .overlay:before {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: -1;
content: '';
opacity: 0;
-webkit-transition: opacity 0.5s 0.2s;
transition: opacity 0.5s 0.2s;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay:before,
.hover-zooming-blur .gallery-item:is(:hover, .hover-effect) .overlay-wrap .overlay:before {
position: absolute;
top: 0;
left: 0;
z-index: -1;
content: '';
width: 100%;
height: 100%;
opacity: 1;
-webkit-transition: opacity 0.5s;
transition: opacity 0.5s;
}
.hover-zooming-blur .portfolio-item .image .overlay .links .portfolio-icons > .icon,
.hover-zooming-blur .portfolio-item .image .overlay .links .portfolio-icons-inner > .icon,
.hover-zooming-blur .gallery-item .overlay .overlay-content-inner a.icon,
.portfolio.products.hover-zooming-blur .portfolio-item .image .overlay .portfolio-icons.product-bottom a.added_to_cart {
opacity: 0;
display: inline-block;
vertical-align: middle;
position: relative;
top: 200px;
will-change: transform;
-webkit-transform: scale(0);
transform: scale(0);
-webkit-transition: opacity 0.3s 0.2s, -webkit-transform 0s 0.5s, top 0.3s 0.2s;
transition: opacity 0.3s 0.2s, transform 0s 0.5s, top 0.3s 0.2s;
}
.hover-zooming-blur .gallery-item .overlay .overlay-content-inner a.icon.link {
margin-left: 10px;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-icons > .icon,
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-icons-inner > .icon,
.hover-zooming-blur .gallery-item:is(:hover, .hover-effect) .overlay .overlay-content-inner a.icon,
.portfolio.products.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .portfolio-icons.product-bottom a.added_to_cart {
opacity: 1;
top: 0;
-webkit-transform: scale(1);
transform: scale(1);
-webkit-transition: top 0s;
transition: top 0s;
}
.portfolio.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-icons > .icon:hover,
.portfolio.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-icons-inner > .icon:hover {
-webkit-transform: scale(1.2);
transform: scale(1.2);
-webkit-transition: transform 0.2s;
transition: transform 0.2s;
}
.portfolio.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-icons > .yith-wcwl-add-to-wishlist.added.icon:hover,
.portfolio.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-icons-inner > .yith-wcwl-add-to-wishlist.added.icon:hover {
-webkit-transform: none;
transform: none;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-icons > .icon:nth-child(1),
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-icons-inner > .icon:nth-child(1),
.hover-zooming-blur .gallery-item:is(:hover, .hover-effect) .overlay .overlay-content-inner a.icon:nth-child(1),
.portfolio.products.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .portfolio-icons.product-bottom a.added_to_cart {
-webkit-transition: opacity 0.5s 0s, -webkit-transform 0.4s 0s;
transition: opacity 0.5s 0s, transform 0.4s 0s;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-icons > .icon:nth-child(2),
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-icons-inner > .icon:nth-child(2),
.hover-zooming-blur .gallery-item:is(:hover, .hover-effect) .overlay .overlay-content-inner a.icon:nth-child(2) {
-webkit-transition: opacity 0.5s 0.05s, -webkit-transform 0.4s 0.05s;
transition: opacity 0.5s 0.05s, transform 0.4s 0.05s;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-icons > .icon:nth-child(3),
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-icons-inner > .icon:nth-child(3),
.hover-zooming-blur .gallery-item:is(:hover, .hover-effect) .overlay .overlay-content-inner a.icon:nth-child(3) {
-webkit-transition: opacity 0.5s 0.1s, -webkit-transform 0.4s 0.1s;
transition: opacity 0.5s 0.1s, transform 0.4s 0.1s;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-icons > .icon:nth-child(4),
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-icons-inner > .icon:nth-child(4),
.hover-zooming-blur .gallery-item:is(:hover, .hover-effect) .overlay .overlay-content-inner a.icon:nth-child(4) {
-webkit-transition: opacity 0.5s 0.15s, -webkit-transform 0.4s 0.15s;
transition: opacity 0.5s 0.15s, transform 0.4s 0.15s;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-icons > .icon:nth-child(5),
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-icons-inner > .icon:nth-child(5),
.hover-zooming-blur .gallery-item:is(:hover, .hover-effect) .overlay .overlay-content-inner a.icon:nth-child(5) {
-webkit-transition: opacity 0.5s 0.2s, -webkit-transform 0.4s 0.2s;
transition: opacity 0.5s 0.2s, transform 0.4s 0.2s;
}
.hover-zooming-blur .portfolio-item .image .links .caption .title {
opacity: 0;
top: 200px;
display: inline-block;
vertical-align: middle;
position: relative;
will-change: transform;
-webkit-transform: scale(0);
transform: scale(0);
-webkit-transition: -webkit-transform 0s 0.5s, opacity 0.3s 0.1s, top 0.3s 0.1s;
transition: transform 0s 0.5s, opacity 0.3s 0.1s, top 0.3s 0.1s;
}
.hover-zooming-blur .gallery-item .overlay .overlay-content-inner .title {
opacity: 0;
top: 200px;
display: block;
vertical-align: middle;
position: relative;
margin-top: 35px;
will-change: transform;
-webkit-transform: scale(0);
transform: scale(0);
-webkit-transition: -webkit-transform 0s 0.5s, opacity 0.3s 0.1s, top 0.3s 0.1s;
transition: transform 0s 0.5s, opacity 0.3s 0.1s, top 0.3s 0.1s;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .links .caption .title {
opacity: 1;
top: 0;
-webkit-transform: scale(1);
transform: scale(1);
-webkit-transition: -webkit-transform 0.3s 0.1s, opacity 0.3s 0.1s, top 0s;
transition: transform 0.3s 0.1s, opacity 0.3s 0.1s, top 0s;
}
.hover-zooming-blur .gallery-item:is(:hover, .hover-effect) .overlay .overlay-content-inner .title {
opacity: 1;
top: 0;
-webkit-transform: scale(1);
transform: scale(1);
-webkit-transition: -webkit-transform 0.3s 0.1s, opacity 0.3s 0.1s, top 0s;
transition: transform 0.3s 0.1s, opacity 0.3s 0.1s, top 0s;
}
.hover-zooming-blur .portfolio-item .image .links .caption .description,
.hover-zooming-blur .portfolio-item .image .links .caption .details {
opacity: 0;
top: 200px;
position: relative;
will-change: transform;
-webkit-transform: scale(0);
transform: scale(0);
-webkit-transition: -webkit-transform 0s 0.5s, opacity 0.3s, top 0.3s;
transition: transform 0s 0.5s, opacity 0.3s, top 0.3s;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .links .caption .description,
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .links .caption .details {
opacity: 1;
top: 0;
-webkit-transform: scale(1);
transform: scale(1);
-webkit-transition: -webkit-transform 0.3s 0.2s, opacity 0.3s 0.2s, top 0s;
transition: transform 0.2s 0.2s, opacity 0.3s 0.2s, top 0s;
}
.hover-zooming-blur .portfolio-item .image .links .caption .product-info {
opacity: 0;
top: 200px;
position: relative;
will-change: transform;
-webkit-transform: scale(0);
transform: scale(0);
-webkit-transition: -webkit-transform 0s 0.5s, opacity 0.3s, top 0.3s;
transition: transform 0s 0.5s, opacity 0.3s, top 0.3s;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .links .caption .product-info {
opacity: 1;
top: 0;
-webkit-transform: scale(1);
transform: scale(1);
-webkit-transition: -webkit-transform 0.3s 0.2s, opacity 0.3s 0.2s, top 0s;
transition: transform 0.2s 0.2s, opacity 0.3s 0.2s, top 0s;
}
.hover-zooming-blur .gallery-item .overlay .overlay-content-inner .subtitle {
opacity: 0;
display: block;
vertical-align: middle;
top: 200px;
position: relative;
margin-top: 20px;
will-change: transform;
-webkit-transform: scale(0);
transform: scale(0);
-webkit-transition: -webkit-transform 0s 0.5s, opacity 0.3s, top 0.3s;
transition: transform 0s 0.5s, opacity 0.3s, top 0.3s;
}
.hover-zooming-blur .gallery-item:is(:hover, .hover-effect) .overlay .overlay-content-inner .subtitle {
opacity: 1;
top: 0;
-webkit-transform: scale(1);
transform: scale(1);
-webkit-transition: -webkit-transform 0.3s 0.2s, opacity 0.3s 0.2s, top 0s;
transition: transform 0.2s 0.2s, opacity 0.3s 0.2s, top 0s;
}
.hover-zooming-blur .portfolio-item .image .overlay .links .portfolio-sharing-pane {
opacity: 0;
margin-top: 0;
margin-bottom: 0;
will-change: transform;
-webkit-transform: translateY(-1000px);
transform: translateY(-1000px);
-webkit-transition: opacity 0.3s, margin 0.3s 0.3s, height 0.3s 0.3s, -webkit-transform 0s;
transition: opacity 0.3s, margin 0.3s 0.3s, height 0.3s 0.3s, transform 0s;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-sharing-pane {
visibility: hidden;
will-change: transform;
-webkit-transform: translateY(0);
transform: translateY(0);
-webkit-transition: opacity 0.5s, -webkit-transform 0s, margin 0.3s 0.3s, height 0.3s 0.3s;
transition: opacity 0.5s, transform 0s, margin 0.3s 0.3s, height 0.3s 0.3s;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-sharing-pane.active {
opacity: 1;
visibility: visible;
margin-top: 20px;
margin-bottom: 0;
-webkit-transition: opacity 0.5s, margin 0.3s, height 0.3s;
transition: opacity 0.5s, margin 0.3s, height 0.3s;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-sharing-pane .socials-item-icon {
opacity: 0;
will-change: transform;
-webkit-transform: translate(0, 30px);
transform: translate(0, 30px);
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-sharing-pane.active .socials-item-icon {
opacity: 1;
-webkit-transform: translate(0, 0);
transform: translate(0, 0);
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-sharing-pane a.socials-item:nth-child(1) .socials-item-icon,
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-sharing-pane.active a.socials-item:nth-child(1) .socials-item-icon {
-webkit-transition: color 0.3s, -webkit-transform 0.3s, opacity 0.3s;
transition: color 0.3s, transform 0.3s, opacity 0.3s;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-sharing-pane a.socials-item:nth-child(2) .socials-item-icon,
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-sharing-pane.active a.socials-item:nth-child(2) .socials-item-icon {
-webkit-transition: color 0.3s, -webkit-transform 0.3s 0.05s, opacity 0.3s 0.05s;
transition: color 0.3s, transform 0.3s 0.05s, opacity 0.3s 0.05s;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-sharing-pane a.socials-item:nth-child(3) .socials-item-icon,
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-sharing-pane.active a.socials-item:nth-child(3) .socials-item-icon {
-webkit-transition: color 0.3s, -webkit-transform 0.3s 0.1s, opacity 0.3s 0.1s;
transition: color 0.3s, transform 0.3s 0.1s, opacity 0.3s 0.1s;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-sharing-pane a.socials-item:nth-child(4) .socials-item-icon,
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-sharing-pane.active a.socials-item:nth-child(4) .socials-item-icon {
-webkit-transition: color 0.3s, -webkit-transform 0.3s 0.15s, opacity 0.3s 0.15s;
transition: color 0.3s, transform 0.3s 0.15s, opacity 0.3s 0.15s;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-sharing-pane a.socials-item:nth-child(5) .socials-item-icon,
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-sharing-pane.active a.socials-item:nth-child(5) .socials-item-icon {
-webkit-transition: color 0.3s, -webkit-transform 0.3s 0.2s, opacity 0.3s 0.2s;
transition: color 0.3s, transform 0.3s 0.2s, opacity 0.3s 0.2s;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-sharing-pane a.socials-item:nth-child(6) .socials-item-icon,
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-sharing-pane.active a.socials-item:nth-child(6) .socials-item-icon {
-webkit-transition: color 0.3s, -webkit-transform 0.3s 0.25s, opacity 0.3s 0.25s;
transition: color 0.3s, transform 0.3s 0.25s, opacity 0.3s 0.25s;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-sharing-pane a.socials-item:nth-child(7) .socials-item-icon,
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .overlay .links .portfolio-sharing-pane.active a.socials-item:nth-child(7) .socials-item-icon {
-webkit-transition: color 0.3s, -webkit-transform 0.3s 0.3s, opacity 0.3s 0.3s;
transition: color 0.3s, transform 0.3s 0.3s, opacity 0.3s 0.3s;
} .hover-zooming-blur.version-alternative:is(.caption-position-hover, .caption-position-image) .portfolio-item:not(:hover, .hover-effect) .image .set {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
.hover-zooming-blur.version-alternative .links-wrapper .links .portfolio-likes  {
position: relative;
margin: 0 0 10px 0;
opacity: 0;
top: 200px;
will-change: transform;
-webkit-transform: scale(0);
transform: scale(0);
-webkit-transition: opacity 0.3s 0.2s, -webkit-transform 0s 0.5s, top 0.3s 0.2s;
transition: opacity 0.3s 0.2s, transform 0s 0.5s, top 0.3s 0.2s;
}
.hover-zooming-blur.version-alternative .portfolio-item:is(:hover, .hover-effect) .links-wrapper .links .portfolio-likes {
opacity: 1;
top: 0;
-webkit-transform: scale(1);
transform: scale(1);
-webkit-transition: opacity 0.5s 0s, -webkit-transform 0.4s 0s;
transition: opacity 0.5s 0s, transform 0.4s 0s;
}
.hover-zooming-blur.version-alternative .links-wrapper .links .portfolio-likes .zilla-likes {
margin: 0 auto;
color: #f44336;
}
.hover-zooming-blur.version-alternative .portfolio-item .image .overlay .links .caption {
padding-top: 10px;
}
.hover-zooming-blur .portfolio-item .image .links .caption .info {
opacity: 0;
top: 200px;
position: relative;
will-change: transform;
-webkit-transform: scale(0);
transform: scale(0);
-webkit-transition: -webkit-transform 0s 0.5s, opacity 0.3s, top 0.3s;
transition: transform 0s 0.5s, opacity 0.3s, top 0.3s;
}
.hover-zooming-blur .portfolio-item:is(:hover, .hover-effect) .image .links .caption .info {
opacity: 1;
top: 0;
-webkit-transform: scale(1);
transform: scale(1);
-webkit-transition: -webkit-transform 0.1s 0.3s, opacity 0.3s 0.3s, top 0s;
transition: transform 0.1s 0.3s, opacity 0.3s 0.3s, top 0s;
}
.hover-zooming-blur.version-alternative.caption-position-image .portfolio-item .image .overlay .links {
justify-content: flex-end;
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: auto;
max-height: 100%;
-webkit-transition: bottom 0.3s, transform 0.3s;
transition: bottom 0.3s, transform 0.3s;
}
.hover-zooming-blur.version-alternative.caption-position-image .portfolio-item.appearance-type-featured_image:is(:hover, .hover-effect) .image .overlay .links {
bottom: 50%;
-webkit-transform: translateY(50%);
transform: translateY(50%);
}
.hover-zooming-blur.version-alternative.caption-position-image .portfolio-item .image .links .caption .title {
opacity: 1;
top: 0;
transform: none;
}
.hover-zooming-blur.version-alternative.caption-position-image .portfolio-item .image .links .caption .description,
.hover-zooming-blur.version-alternative.caption-position-image .portfolio-item .image .links .caption .info {
opacity: 1;
position: initial;
transform: none;
}
.hover-zooming-blur.version-alternative.caption-position-image .portfolio-item.appearance-type-featured_image:not(:hover, .hover-effect) .image .links .caption .title,
.hover-zooming-blur.version-alternative.caption-position-image .portfolio-item:not(.appearance-type-featured_image) .image .links .caption .title {
margin-bottom: 20px;
}
.hover-zooming-blur.version-alternative.caption-position-image:is(.columns-4, .columns-5, .columns-6) .portfolio-item:not(.double-item) .image .links .caption .title,
.hover-zooming-blur.version-alternative.caption-position-image .portfolio-item.small-item .image .links .caption .title {
margin-bottom: 10px;
}
.hover-zooming-blur.version-alternative.caption-position-image .portfolio-item.appearance-type-featured_image:is(:hover, .hover-effect) .image .links .caption .slide-content-hidden {
margin-bottom: 0 !important;
}
.hover-zooming-blur.version-alternative.caption-position-image .portfolio-item .image .overlay:after {
content: '';
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: -1;
background: -moz-linear-gradient(top, rgba(255,255,255,0) 50%, rgba(255,255,255,0.8) 100%);
background: -webkit-linear-gradient(top, rgba(255,255,255,0) 50%, rgba(255,255,255,0.8) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,0) 50%, rgba(255,255,255,0.8) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#001e5799', endColorstr='#80000000',GradientType=0 );
opacity: 1;
-webkit-transition: opacity 0.3s;
transition: opacity 0.3s;
}
.hover-zooming-blur.version-alternative.caption-position-image .portfolio-item.appearance-type-featured_image:is(:hover, .hover-effect) .image .overlay:after {
opacity: 0;
}
.hover-zooming-blur.version-alternative .portfolio-sharing-pane.active {
height: 25px;
}