/* Start of Advanced Image */ .jltma-advanced-image .jltma-adv-image-wrapper { display: inline-block; } .jltma-advanced-image .jltma-adv-image-wrapper .jltma-image-has-secondary img:last-child { position: absolute; top: 0; left: 0; opacity: 0; z-index: 2; transition: opacity 1s; } .jltma-advanced-image .jltma-adv-image-wrapper:hover .jltma-image-has-secondary img { opacity: 0; } .jltma-advanced-image .jltma-adv-image-wrapper:hover .jltma-image-has-secondary img:last-child { opacity: 1; } .jltma-advanced-image .jltma-media-image { display: block; position: relative; max-width: 100%; text-align: center; transition: all 300ms ease-out; } .jltma-advanced-image .jltma-media-image img { height: auto; display: inline-block; margin-left: auto; margin-right: auto; margin-top: 0; margin-bottom: 0; } .jltma-advanced-image.jltma-alignnone { text-align: center; } .jltma-advanced-image.jltma-alignleft { float: left; } .jltma-advanced-image.jltma-alignright { float: right; } .jltma-advanced-image .jltma-media-image { position: relative; } .jltma-advanced-image .jltma-media-image.jltma-hidden-overflow { overflow: hidden; } .jltma-advanced-image .jltma-ribbon-wrapper { z-index: 5; } .jltma-advanced-image .jltma-ribbon-wrapper.jltma-corner-ribbon { width: 200px; background: #ea4335; position: absolute; top: 25px; left: -50px; text-align: center; line-height: 50px; letter-spacing: 1px; color: #ffffff; transform: rotate(-45deg); box-shadow: 0 0 3px rgba(0, 0, 0, 0.3); } .jltma-advanced-image .jltma-ribbon-wrapper.jltma-corner-ribbon.top-right { top: 25px; right: -50px; left: auto; transform: rotate(45deg); } .jltma-advanced-image .jltma-ribbon-wrapper.jltma-corner-ribbon.bottom-left { top: auto; bottom: 25px; left: -50px; transform: rotate(45deg); } .jltma-advanced-image .jltma-ribbon-wrapper.jltma-corner-ribbon.bottom-right { top: auto; right: -50px; bottom: 25px; left: auto; transform: rotate(-45deg); } .jltma-advanced-image .jltma-ribbon-wrapper.jltma-simple-ribbon { background: #ea4335; color: #ffffff; padding: 7px 15px; position: absolute; top: 25px; left: -1px; } .jltma-advanced-image .jltma-ribbon-wrapper.jltma-simple-ribbon.top-right { top: 25px; right: -1px; left: auto; } .jltma-advanced-image .jltma-ribbon-wrapper.jltma-simple-ribbon.bottom-left { top: auto; bottom: 25px; left: -1px; } .jltma-advanced-image .jltma-ribbon-wrapper.jltma-simple-ribbon.bottom-right { top: auto; right: -1px; bottom: 25px; left: auto; } .jltma-advanced-image .jltma-ribbon-wrapper.jltma-cross-ribbon { position: absolute; background: #ea4335; top: 0px; padding: 10px; left: 25px; color: #ffffff; border-radius: 0 0 2px 2px; } .jltma-advanced-image .jltma-ribbon-wrapper.jltma-cross-ribbon:before { content: ""; position: absolute; left: -15px; right: 0; top: 0; bottom: 0; width: 0; height: 0; border-bottom: 15px solid #a42f25; border-left: 15px solid transparent; } .jltma-advanced-image .jltma-ribbon-wrapper.jltma-cross-ribbon.top-right { right: 25px; left: auto; } .jltma-advanced-image .jltma-ribbon-wrapper.jltma-cross-ribbon.top-right:before { left: auto; right: -15px; border-left: 0; border-right: 15px solid transparent; } .jltma-advanced-image .jltma-ribbon-wrapper.jltma-cross-ribbon.bottom-left { top: auto; bottom: 10px; } .jltma-advanced-image .jltma-ribbon-wrapper.jltma-cross-ribbon.bottom-left:before { border-top: 15px solid #a42f25; border-bottom: 0; top: auto; } .jltma-advanced-image .jltma-ribbon-wrapper.jltma-cross-ribbon.bottom-right { top: auto; right: 25px; bottom: 10px; left: auto; } .jltma-advanced-image .jltma-ribbon-wrapper.jltma-cross-ribbon.bottom-right:before { left: auto; right: -15px; border-left: 0 !important; border-right: 15px solid transparent !important; border-top: 15px solid #a42f25; border-bottom: 0; top: auto; } .jltma-lightbox-btn { direction: ltr; } .jltma-has-preview { transform: translate3d(0, 0, 0); transition: filter 300ms; will-change: filter; perspective-origin: center; } .jltma-has-preview.jltma-preload, .jltma-has-preview.jltma-preloading { filter: blur(10px); } .jltma-has-preview.jltma-preloaded { filter: blur(0); } .jltma-preload, .jltma-preloading, .jltma-preloaded { will-change: background, opacity; } .jltma-preload.jltma-progress-box, .jltma-preloading.jltma-progress-box { position: relative; background: #dddddd; background-image: linear-gradient(to right, #dddddd 33%, #f5f5f5 40%, #e5e5e5 43%, #dddddd 46%); background-repeat: no-repeat; background-size: 300% auto; animation-duration: 1.4s; animation-fill-mode: forwards; animation-iteration-count: infinite; animation-name: JltmaLoadingWave; animation-timing-function: linear; } .jltma-preload.jltma-blank, .jltma-preloading.jltma-blank { opacity: 0; } .jltma-preloading.jltma-simple-spinner, .jltma-preloading.jltma-simple-spinner-light, .jltma-preloading.jltma-simple-spinner-dark { background-repeat: no-repeat; background-position: center center; } .jltma-preloading.jltma-simple-spinner { background-image: url(../images/spinner-default.svg); } .jltma-preloading.jltma-simple-spinner-light { background-image: url(../images/spinner-light.svg); } .jltma-preloading.jltma-simple-spinner-dark { background-image: url(../images/spinner-dark.svg); } .jltma-preloaded.jltma-blank { animation-name: JltmaFadeInPreloaded; animation-duration: 400ms; animation-fill-mode: both; animation-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); } @keyframes JltmaLoadingWave { 0% { background-position: 0% 0; } 100% { background-position: 66% 0; } } @keyframes JltmaFadeInPreloaded { from { opacity: 0; } to { opacity: 1; } } .jltma-img-dynamic-dropshadow-frame { position: relative; } .jltma-img-dynamic-dropshadow-frame .jltma-img-dynamic-dropshadow { position: relative; z-index: 1; } .jltma-img-dynamic-dropshadow-frame .jltma-img-dynamic-dropshadow-cloned { position: absolute; left: 0; right: 0; top: 0; margin: 0 auto; transform: translateX(75px) translateY(40px); opacity: 0.4; filter: blur(50px); } .jltma-orginal-blured-img { position: relative; overflow: hidden; } .jltma-blured-img { position: absolute; width: 100%; height: 100%; left: 0; top: 0; opacity: 0; transition: opacity, transform 100ms ease-out; will-change: opacity, transform; } .jltma-hover-scale-circle-plus { display: block; position: absolute; direction: ltr; } .jltma-hover-scale-circle-plus .jltma-symbol-plus, .jltma-hover-scale-circle-plus .jltma-symbol-circle { position: absolute; display: block; opacity: 0; transition: all 800ms cubic-bezier(0.75, 0.1, 0.25, 0.9); } .jltma-hover-scale-circle-plus .jltma-symbol-plus { z-index: 3; width: 30px; height: 30px; margin-top: 15px; transform-origin: 50% 0 0; } .jltma-hover-scale-circle-plus .jltma-symbol-plus::after, .jltma-hover-scale-circle-plus .jltma-symbol-plus::before { content: ""; position: absolute; display: block; height: 1px; width: 100%; background-color: white; } .jltma-hover-scale-circle-plus .jltma-symbol-plus::after { transform: rotate(90deg); } .jltma-hover-scale-circle-plus .jltma-symbol-circle { width: 100px; height: 100px; border: solid 2px white; border-radius: 50%; } .jltma-hover-scale-circle-plus { top: 50%; left: 50%; } .jltma-hover-scale-circle-plus .jltma-symbol-plus { transform: translate3d(-50%, -50%, 0) scale(0.8); transform-origin: 50% 0 0; } .jltma-hover-scale-circle-plus .jltma-symbol-circle { z-index: 2; transform: translate3d(-50%, -50%, 0) scale(1.25); } .jltma-hover-active:hover .jltma-hover-scale-circle-plus .jltma-symbol-plus, .jltma-hover-active:hover .jltma-hover-scale-circle-plus .jltma-symbol-circle { opacity: 1; transform: translate3d(-50%, -50%, 0) scale(1) rotate(0); } .jltma-hover-fade { opacity: 0; transition: opacity 1s ease-in-out; will-change: opacity; } .jltma-hover-active:hover .jltma-hover-fade { opacity: 1; } /* End of Advanced Image */