PATH:
home
/
centosnipponia
/
public_html
/
BAK_tradeandtraffic
/
wp-content
/
plugins
/
tz-feature-pack
/
public
/
css
/* Elementor Widgets Extra styles */ /*** Contents: * - Banner * - Product Tabs * - Woo Shortcode * - Testimonials * - Recent Posts * - Repeatable Styles * - Product Categories Grid * - Sale Carousel * - Hoverable Tabs */ /* Banner */ figure.tz-banner { position: relative; display: block; overflow: hidden; text-align: center; cursor: pointer; z-index: 1; } figure.tz-banner img { position: relative; display: block; height: auto; max-width: 100%; -webkit-transform: translateZ(0); } figure.tz-banner .button { text-transform: none; } figure.tz-banner .button.large { padding: 0 35px; } figure.tz-banner figcaption { -webkit-backface-visibility: hidden; backface-visibility: hidden; } figure.tz-banner .banner-button { display: inline-block !important; position: absolute; background-color: #fdb819; color: #212121; font-weight: 500; font-size: 14px; border-radius: 3px; height: 45px; padding: 12px 40px; width: auto !important; z-index: 1; opacity: 1; text-indent: 0; } figure.tz-banner figcaption { position: absolute; top: 0; left: 0; width: 100%; height: 100%; font-size: 95%; } /* Anchor will cover the whole item by default */ figure.tz-banner a { z-index: 1000; text-indent: 200%; white-space: nowrap; font-size: 0; opacity: 0; position: absolute; top: 0; left: 0; width: 100%; height: 100%; } figure.tz-banner figcaption::before, figure.tz-banner figcaption::after { pointer-events: none; } figure.tz-banner figcaption>.main-caption, figure.tz-banner figcaption>.secondary-caption { position: absolute; font-size: inherit; } @media (min-width: 768px) { figure.tz-banner figcaption { font-size: 100%; } } @media ( min-width: 767px ) and ( max-width: 1024px ){ .banner-container .elementor-widget-tz-banner{ max-width: 50%; position: relative; margin: 15px auto; } .banner-container .tz-banner{ position: relative; } } /* Lily */ figure.effect-lily img { width: -webkit-calc(100% + 50px); width: calc(100% + 50px); max-width: -webkit-calc(100% + 50px); max-width: calc(100% + 50px); opacity: 0.7; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-50px, 0, 0); transform: translate3d(-50px, 0, 0); } figure.effect-lily figcaption { text-align: left; } figure.effect-lily .main-caption, figure.effect-lily .secondary-caption { -webkit-transform: translate3d(0, 40px, 0); transform: translate3d(0, 40px, 0); } figure.effect-lily .main-caption { -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s; } figure.effect-lily .secondary-caption { opacity: 0; -webkit-transition: opacity 0.2s, -webkit-transform 0.35s; transition: opacity 0.2s, transform 0.35s; } figure.effect-lily:hover img, figure.effect-lily:hover .secondary-caption { opacity: 1; } figure.effect-lily:hover img, figure.effect-lily:hover .main-caption, figure.effect-lily:hover .secondary-caption { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } figure.effect-lily:hover .secondary-caption { -webkit-transition-delay: 0.05s; transition-delay: 0.05s; -webkit-transition-duration: 0.35s; transition-duration: 0.35s; } /* Sadie */ figure.effect-sadie figcaption::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; /*background-color: rgba(0,0,0,0.1);*/ content: ''; opacity: 0; -webkit-transform: translate3d(0, 50%, 0); transform: translate3d(0, 50%, 0); } figure.effect-sadie .main-caption { color: #484c61; -webkit-transition: -webkit-transform 0.35s, color 0.35s; transition: transform 0.35s, color 0.35s; -webkit-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0); } figure.effect-sadie figcaption::before, figure.effect-sadie .secondary-caption { -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; } figure.effect-sadie .secondary-caption { opacity: 0; -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } figure.effect-sadie:hover .secondary-caption { color: #fff; -webkit-transform: translate3d(0, -50%, 0) translate3d(0, -40px, 0); transform: translate3d(0, -50%, 0) translate3d(0, -40px, 0); } figure.effect-sadie:hover figcaption::before, figure.effect-sadie:hover .secondary-caption { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } /* Roxy */ figure.effect-roxy { background: -webkit-linear-gradient(45deg, #ff89e9 0%, #05abe0 100%); background: linear-gradient(45deg, #ff89e9 0%, #05abe0 100%); } figure.effect-roxy img { width: -webkit-calc(100% + 60px); width: calc(100% + 60px); max-width: -webkit-calc(100% + 60px); max-width: calc(100% + 60px); -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-50px, 0, 0); transform: translate3d(-50px, 0, 0); } figure.effect-roxy figcaption::before { position: absolute; top: 30px; right: 30px; bottom: 30px; left: 30px; border: 1px solid #fff; content: ''; opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } figure.effect-roxy figcaption { padding: 40px; text-align: left; } figure.effect-roxy .secondary-caption { opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } figure.effect-roxy:hover img { opacity: 0.7; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } figure.effect-roxy:hover figcaption::before, figure.effect-roxy:hover .secondary-caption { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } /* Bubba */ figure.effect-bubba { background: #9e5406; } figure.effect-bubba img { opacity: 0.7; -webkit-transition: opacity 0.35s; transition: opacity 0.35s; } figure.effect-bubba:hover img { opacity: 0.4; } figure.effect-bubba figcaption::before, figure.effect-bubba figcaption::after { position: absolute; top: 30px; right: 30px; bottom: 30px; left: 30px; content: ''; opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; } figure.effect-bubba figcaption::before { border-top: 1px solid #fff; border-bottom: 1px solid #fff; -webkit-transform: scale(0, 1); transform: scale(0, 1); } figure.effect-bubba figcaption::after { border-right: 1px solid #fff; border-left: 1px solid #fff; -webkit-transform: scale(1, 0); transform: scale(1, 0); } figure.effect-bubba .main-caption { -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } figure.effect-bubba .secondary-caption { opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } figure.effect-bubba:hover figcaption::before, figure.effect-bubba:hover figcaption::after { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } figure.effect-bubba:hover .main-caption, figure.effect-bubba:hover .secondary-caption { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } /* Romeo */ figure.effect-romeo { -webkit-perspective: 1000px; perspective: 1000px; } figure.effect-romeo img { -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(0, 0, 300px); transform: translate3d(0, 0, 300px); } figure.effect-romeo:hover img { opacity: 0.6; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } figure.effect-romeo figcaption::before, figure.effect-romeo figcaption::after { position: absolute; top: 50%; left: 50%; width: 80%; height: 1px; background: #fff; content: ''; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-50%, -50%, 0); transform: translate3d(-50%, -50%, 0); } figure.effect-romeo:hover figcaption::before { opacity: 0.5; -webkit-transform: translate3d(-50%, -50%, 0) rotate(45deg); transform: translate3d(-50%, -50%, 0) rotate(45deg); } figure.effect-romeo:hover figcaption::after { opacity: 0.5; -webkit-transform: translate3d(-50%, -50%, 0) rotate(-45deg); transform: translate3d(-50%, -50%, 0) rotate(-45deg); } figure.effect-romeo .main-caption, figure.effect-romeo .secondary-caption { -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s; } figure.effect-romeo .main-caption { -webkit-transform: translate3d(0, -50%, 0) translate3d(0, -150%, 0); transform: translate3d(0, -50%, 0) translate3d(0, -150%, 0); } figure.effect-romeo .secondary-caption { -webkit-transform: translate3d(0, -50%, 0) translate3d(0, 150%, 0); transform: translate3d(0, -50%, 0) translate3d(0, 150%, 0); } figure.effect-romeo:hover .main-caption { -webkit-transform: translate3d(0, -50%, 0) translate3d(0, -100%, 0); transform: translate3d(0, -50%, 0) translate3d(0, -100%, 0); } figure.effect-romeo:hover .secondary-caption { -webkit-transform: translate3d(0, -50%, 0) translate3d(0, 100%, 0); transform: translate3d(0, -50%, 0) translate3d(0, 100%, 0); } /* Honey */ figure.effect-honey {} figure.effect-honey img { opacity: 1; -webkit-transition: opacity 0.35s; transition: opacity 0.35s; } figure.effect-honey:hover img { opacity: 0.8; } figure.effect-honey .main-caption { -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } figure.effect-honey .secondary-caption { opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } figure.effect-honey .main-caption { -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s; } figure.effect-honey:hover .main-caption, figure.effect-honey:hover .secondary-caption { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } /* Oscar */ figure.effect-oscar {} figure.effect-oscar img { opacity: 0.9; -webkit-transition: opacity 0.35s; transition: opacity 0.35s; } figure.effect-oscar figcaption { background-color: transparent; ; -webkit-transition: background-color 0.35s; transition: background-color 0.35s; } figure.effect-oscar figcaption::before { position: absolute; top: 30px; right: 30px; bottom: 30px; left: 30px; border: 1px solid #fff; content: ''; } figure.effect-oscar .main-caption { -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } figure.effect-oscar figcaption::before, figure.effect-oscar .secondary-caption { opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: scale(0); transform: scale(0); } figure.effect-oscar:hover .main-caption { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } figure.effect-oscar:hover figcaption::before, figure.effect-oscar:hover .secondary-caption { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } figure.effect-oscar:hover figcaption { background-color: rgba(0, 0, 0, 0.4); } figure.effect-oscar:hover img { opacity: 0.7; } /* Marley */ figure.effect-marley .secondary-caption { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } figure.effect-marley .main-caption { -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } figure.effect-marley:hover .main-caption { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } figure.effect-marley .main-caption::after { position: absolute; top: 100%; left: 0; width: 100%; max-width: 155px; height: 4px; background: #fff; content: ''; -webkit-transform: translate3d(0, 40px, 0); transform: translate3d(0, 40px, 0); } figure.effect-marley .main-caption::after, figure.effect-marley .secondary-caption { opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; } figure.effect-marley:hover .main-caption::after, figure.effect-marley:hover .secondary-caption { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } /* Ruby */ figure.effect-ruby {} figure.effect-ruby img { opacity: 0.9; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: scale(1.15); transform: scale(1.15); } figure.effect-ruby:hover img { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } figure.effect-ruby .main-caption { -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } figure.effect-ruby .secondary-caption { opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(0, 20px, 0) scale(1.1); transform: translate3d(0, 20px, 0) scale(1.1); } figure.effect-ruby:hover .main-caption { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } figure.effect-ruby:hover .secondary-caption { opacity: 1; -webkit-transform: translate3d(0, 0, 0) scale(1); transform: translate3d(0, 0, 0) scale(1); } /* Milo */ figure.effect-milo {} figure.effect-milo img { width: -webkit-calc(100% + 60px); width: calc(100% + 60px); opacity: 1; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-18px, 0, 0) scale(1.1); transform: translate3d(-18px, 0, 0) scale(1.1); -webkit-backface-visibility: hidden; backface-visibility: hidden; } figure.effect-milo:hover img { opacity: 1; -webkit-transform: translate3d(0, 0, 0) scale(1); transform: translate3d(0, 0, 0) scale(1); } figure.effect-milo .secondary-caption { width: 50%; border-right: 1px solid #fff; text-align: right; padding-right: 10px; opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-40px, 0, 0); transform: translate3d(-40px, 0, 0); } figure.effect-milo:hover .secondary-caption { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } /* Dexter */ figure.effect-dexter { background: -webkit-linear-gradient(top, rgba(37, 141, 200, 1) 0%, rgba(104, 60, 19, 1) 100%); background: linear-gradient(to bottom, rgba(37, 141, 200, 1) 0%, rgba(104, 60, 19, 1) 100%); } figure.effect-dexter img { -webkit-transition: opacity 0.35s; transition: opacity 0.35s; } figure.effect-dexter:hover img { opacity: 0.4; } figure.effect-dexter figcaption::after { position: absolute; right: 30px; bottom: 30px; left: 30px; height: -webkit-calc(50% - 30px); height: calc(50% - 30px); border: 7px solid #fff; content: ''; -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } figure.effect-dexter:hover figcaption::after { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } figure.effect-dexter .secondary-caption { opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(0, -100px, 0); transform: translate3d(0, -100px, 0); } figure.effect-dexter:hover .secondary-caption { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } /* Sarah */ figure.effect-sarah { background: #42b078; } figure.effect-sarah img { width: -webkit-calc(100% + 20px); width: calc(100% + 20px); max-width: -webkit-calc(100% + 20px); max-width: calc(100% + 20px); -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; } figure.effect-sarah:hover img { opacity: 0.4; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } figure.effect-sarah .main-caption::after { position: absolute; bottom: 0; left: 0; width: 100%; height: 3px; background: #fff; content: ''; opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } figure.effect-sarah:hover .main-caption::after { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } figure.effect-sarah .secondary-caption { opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } figure.effect-sarah:hover .secondary-caption { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } /* Chico */ figure.effect-chico img { -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: scale(1.12); transform: scale(1.12); } figure.effect-chico:hover img { opacity: 0.5; -webkit-transform: scale(1); transform: scale(1); } figure.effect-chico figcaption::before { position: absolute; top: 30px; right: 30px; bottom: 30px; left: 30px; border: 1px solid #fff; content: ''; -webkit-transform: scale(1.1); transform: scale(1.1); } figure.effect-chico figcaption::before, figure.effect-chico .secondary-caption { opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; } figure.effect-chico .secondary-caption { -webkit-transform: scale(1.5); transform: scale(1.5); } figure.effect-chico:hover figcaption::before, figure.effect-chico:hover .secondary-caption { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } /* Julia */ figure.effect-julia { background: #2f3238; } figure.effect-julia img { -webkit-transition: opacity 1s, -webkit-transform 1s; transition: opacity 1s, transform 1s; -webkit-backface-visibility: hidden; backface-visibility: hidden; } figure.effect-julia .main-caption, figure.effect-julia .secondary-caption { display: inline-block; padding: 5px 15px; background: rgba(255, 255, 255, 0.9); opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(-360px, 0, 0); transform: translate3d(-360px, 0, 0); } figure.effect-julia .main-caption { -webkit-transition-delay: 0.15s; transition-delay: 0.15s; } figure.effect-julia .secondary-caption { -webkit-transition-delay: 0.1s; transition-delay: 0.1s; } figure.effect-julia:hover img { opacity: 0.4; -webkit-transform: scale3d(1.1, 1.1, 1); transform: scale3d(1.1, 1.1, 1); } figure.effect-julia:hover .main-caption, figure.effect-julia:hover .secondary-caption { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } /* Goliath */ figure.effect-goliath { background: #df4e4e; } figure.effect-goliath img, figure.effect-goliath .main-caption { -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s; } figure.effect-goliath img { -webkit-backface-visibility: hidden; backface-visibility: hidden; } figure.effect-goliath .secondary-caption { opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(0, 50px, 0); transform: translate3d(0, 50px, 0); } figure.effect-goliath:hover img { -webkit-transform: translate3d(0, -40px, 0); transform: translate3d(0, -40px, 0); } figure.effect-goliath:hover .main-caption { -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } figure.effect-goliath:hover .secondary-caption { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } /* Selena */ figure.effect-selena { background: #fff; } figure.effect-selena img { opacity: 0.95; -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s; -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; } figure.effect-selena:hover img { -webkit-transform: scale3d(0.95, 0.95, 1); transform: scale3d(0.95, 0.95, 1); } figure.effect-selena .main-caption { -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } figure.effect-selena .secondary-caption { opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: perspective(1000px) rotate3d(1, 0, 0, 90deg); transform: perspective(1000px) rotate3d(1, 0, 0, 90deg); -webkit-transform-origin: 50% 0%; transform-origin: 50% 0%; } figure.effect-selena:hover .main-caption { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } figure.effect-selena:hover .secondary-caption { opacity: 1; -webkit-transform: perspective(1000px) rotate3d(1, 0, 0, 0); transform: perspective(1000px) rotate3d(1, 0, 0, 0); } /* Kira */ figure.effect-kira { background: #fff; } figure.effect-kira img { -webkit-transition: opacity 0.35s; transition: opacity 0.35s; } figure.effect-kira figcaption { z-index: 1; } figure.effect-kira .secondary-caption { opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } figure.effect-kira figcaption::before { position: absolute; top: 0; right: 2em; left: 2em; z-index: -1; height: 3.5em; background: #fff; content: ''; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: translate3d(0, 4em, 0) scale3d(1, 0.023, 1); transform: translate3d(0, 4em, 0) scale3d(1, 0.023, 1); -webkit-transform-origin: 50% 0; transform-origin: 50% 0; } figure.effect-kira:hover img { opacity: 0.5; } figure.effect-kira:hover .secondary-caption { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } figure.effect-kira:hover figcaption::before { opacity: 0.7; -webkit-transform: translate3d(0, 5em, 0) scale3d(1, 1, 1); transform: translate3d(0, 5em, 0) scale3d(1, 1, 1); } /* Ming */ figure.effect-ming { background: #030c17; } figure.effect-ming img { opacity: 0.9; -webkit-transition: opacity 0.35s; transition: opacity 0.35s; } figure.effect-ming figcaption::before { position: absolute; top: 30px; right: 30px; bottom: 30px; left: 30px; border: 2px solid #fff; box-shadow: 0 0 0 30px rgba(255, 255, 255, 0.2); content: ''; opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: scale3d(1.4, 1.4, 1); transform: scale3d(1.4, 1.4, 1); } figure.effect-ming .main-caption { -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s; } figure.effect-ming .secondary-caption { opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s; -webkit-transform: scale(1.5); transform: scale(1.5); } figure.effect-ming:hover .main-caption { -webkit-transform: scale(0.9); transform: scale(0.9); } figure.effect-ming:hover figcaption::before, figure.effect-ming:hover .secondary-caption { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } figure.effect-ming:hover figcaption { background-color: rgba(58, 52, 42, 0); } figure.effect-ming:hover img { opacity: 0.4; } /* Disable transforms on mobile devices */ .touch-enabled figure.tz-banner img, .touch-enabled figure.tz-banner figcaption, .touch-enabled figure.tz-banner figcaption::before, .touch-enabled figure.tz-banner figcaption::after, .touch-enabled figure.tz-banner figcaption>.main-caption, .touch-enabled figure.tz-banner figcaption>.secondary-caption { opacity: 1; } /* Product Tabs */ .tz-product-tabs ul.nav.nav-tabs { display: block; position: relative; padding: 0 0 40px 0; margin: 0; list-style: none; overflow: hidden; width: 100%; } .tz-product-tabs ul.nav-tabs::after, .tz-product-tabs ul.nav-tabs::before { display: inline-block; content: ''; position: absolute; right: 13px; top: 20px; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; width: 22px; height: 2px; pointer-events: none; background: #101010; z-index: 2; } .tz-product-tabs ul.nav-tabs::after { right: 23px; top: 10px; width: 2px; height: 22px; } .tz-product-tabs ul.nav-tabs.open::after { -webkit-transform: rotate(90deg); transform: rotate(90deg); } .tz-product-tabs .nav-tabs>li { padding: 0; display: block; margin: 0; } .tz-product-tabs .nav-tabs>li>a { display: block; text-align: left; font-size: 15px; font-weight: normal; line-height: 45px; position: absolute; top: 0; left: 0; width: 100%; height: 100%; text-transform: uppercase; opacity: 0; padding: 0 45px 0 20px; background-color: #e1e7eb; } .tz-product-tabs .nav-tabs.open>li>a { position: relative; opacity: 1; } .tz-product-tabs .nav-tabs>li.active>a { z-index: 1; opacity: 1; position: relative; font-weight: 500; background: #fff; } .tz-product-tabs .nav-tabs>li.active>a:hover, .tz-product-tabs .nav-tabs>li.active>a:focus, .tz-product-tabs .nav-tabs>li.active>a:active { background: #fff; } .tz-product-tabs .tab-content>.tab-pane { display: none; position: relative; margin: 0; } .tz-product-tabs .tab-content>.tab-pane.active { display: block; } .tz-product-tabs .fade { opacity: 0; -webkit-transition: opacity .15s linear; -o-transition: opacity .15s linear; transition: opacity .15s linear; } .tz-product-tabs .fade.in { opacity: 1; } .tz-product-tabs .owl-nav { display: inline-block; position: absolute; top: -66px; right: 0; } @media only screen and (min-width: 768px) { .tz-product-tabs .nav-tabs>li { display: inline-block; padding: 0; margin: 0 1px -1px 0; float: left; } .tz-product-tabs ul.nav.nav-tabs { padding: 0 100px 25px 0; } .tz-product-tabs .nav-tabs>li>a { position: relative; height: 55px; line-height: 55px; margin: 0; outline: none; padding: 0 40px; border-style: solid; border-width: 0px 1px 0px 1px; background-color: #e1e7eb; border-color: #f1f5f7; opacity: 1; } .tz-product-tabs .nav-tabs>li>a::before { display: block; content: ''; height: 2px; width: calc(100% + 2px); left: -1px; top: 0px; position: absolute; opacity: 0; -webkit-transition: opacity 0.3s ease-out; transition: opacity 0.3s ease-out; } .tz-product-tabs .nav-tabs>li.active>a { background-color: #fff; } .tz-product-tabs .nav-tabs>li.active>a::before { opacity: 1; } .tz-product-tabs ul.nav-tabs::after, .tz-product-tabs ul.nav-tabs::before { display: none; } } /* Tabs Style 2 */ .tz-product-tabs .tab-nav-wrapper { display: flex; flex-wrap: wrap; margin-bottom: 40px; align-items: center; border-style: solid; border-width: 0 0 1px 0; padding: 15px 0 20px 0; justify-content: space-between; } .tz-product-tabs ul.nav-tabs::after, .tz-product-tabs ul.nav-tabs::before { right: 0px; } .tz-product-tabs ul.nav-tabs::after { right: 10px; } .tz-product-tabs .tab-nav-wrapper .title-wrapper { display: block; width: 100%; max-width: 100%; margin: 0 0 20px 0; } .tz-product-tabs .tab-nav-wrapper ul.nav.nav-tabs { display: inline-block; width: 100%; padding-bottom: 0; } .tz-product-tabs .tab-nav-wrapper .nav-tabs>li>a { position: absolute; height: 45px; line-height: 45px; margin: 0; width: 100%; display: inline-block; padding: 0; border-width: 0 0 2px 0; background-color: transparent; border-color: transparent; opacity: 0; font-size: 14px; color: #81858c; } .tz-product-tabs .nav-tabs.open>li>a { position: relative; opacity: 1; } .tz-product-tabs .nav-tabs>li.active>a { z-index: 1; opacity: 1; position: relative; } .tz-product-tabs .tab-nav-wrapper .nav-tabs>li.active>a { background-color: transparent; border: 0; } .tz-product-tabs .tab-nav-wrapper .nav-tabs>li.active>a::after, .tz-product-tabs .tab-nav-wrapper .nav-tabs>li>a:hover::after { width: 100%; } .tz-product-tabs .tab-nav-wrapper .nav-tabs>li>a::before { display: none; } .tz-product-tabs .tab-nav-wrapper .nav-tabs>li>a::after { content: attr(title); position: absolute; left: 0; width: 0; top: 0; bottom: 0; color: #212121; transition: width .3s ease-out; white-space: nowrap; overflow: hidden; height: 45px; line-height: 45px; border-width: 0 0 3px 0; border-style: solid; max-width: 100%; } .tz-product-tabs.style-2 .tab-pane .slider-navi span, .tz-from-blog.style-2 .title-wrapper .slider-navi span, .tz-categories-grid.with-slider .title-wrapper .slider-navi span { width: 24px; } .tz-product-tabs.style-2 .tab-pane .slider-navi span.next, .tz-from-blog.style-2 .title-wrapper .slider-navi span.slider-next, .tz-categories-grid.with-slider .title-wrapper .slider-navi span.slider-next { width: 34px; padding-left: 10px; } .tz-product-tabs.style-2 .tab-pane .slider-navi span:after, .tz-from-blog.style-2 .title-wrapper .slider-navi span:after, .tz-categories-grid.with-slider .title-wrapper .slider-navi span:after { font-size: 20px; top: auto; width: auto; } .tz-product-tabs.style-2 .tab-pane .slider-navi span.next:after, .tz-from-blog.style-2 .title-wrapper .slider-navi span.slider-next::after, .tz-categories-grid.with-slider .title-wrapper .slider-navi span.slider-next::after { right: 0; left: auto; } .tz-product-tabs.style-2 .tab-pane .slider-navi span.next:hover:after, .tz-from-blog.style-2 .title-wrapper .slider-navi span.slider-next:hover::after, .tz-categories-grid.with-slider .title-wrapper .slider-navi span.slider-next:hover::after { right: -10px; } .tz-product-tabs.style-2 .tab-pane .slider-navi span+span::before, .tz-from-blog.style-2 .title-wrapper .slider-navi span+span::before, .tz-categories-grid.with-slider .title-wrapper .slider-navi span+span::before { margin: 0 0 0 -10px; } .tz-product-tabs.style-2 .tab-pane .slider-navi, .tz-categories-grid.with-slider .tab-pane .slider-navi { top: -91px; } @media only screen and (min-width: 768px) { .tz-product-tabs .tab-nav-wrapper ul.nav.nav-tabs { align-self: flex-end; width: auto; } .tz-product-tabs .tab-nav-wrapper .title-wrapper { margin: 0 0 15px 0; } .tz-product-tabs .tab-nav-wrapper .nav-tabs>li>a { position: relative; height: 30px; line-height: 30px; margin: 0 55px 0 0; width: auto; opacity: 1; } .tz-product-tabs .tab-nav-wrapper .nav-tabs>li>a::after { height: 30px; line-height: 30px; } } @media only screen and (min-width: 801px) { .tz-product-tabs .tab-nav-wrapper { flex-wrap: nowrap; } .tz-product-tabs .tab-nav-wrapper .title-wrapper { display: inline-block; max-width: 300px; margin: 0; } } /* Woo Shortcode */ .tz-woo-shortcode {} .tz-woo-shortcode.with-slider .woocommerce { clear: both; } .tz-woo-shortcode ul.products, .tz-product-tabs ul.products { margin: 0; width: 100%; padding: 0; } .tz-woo-shortcode .woocommerce ul.products .owl-item li.product, .tz-product-tabs .woocommerce ul.products .owl-item li.product { height: auto; list-style: none; width: 100%; margin: 4px auto 0; padding: 0; float: none; } .tz-woo-shortcode.with-slider .products .product .short-description, .tz-product-tabs .products .product .short-description { display: none; } .tz-woo-shortcode .products .owl-item li.product.product-category { display: flex; justify-content: center; flex-direction: column; height: 80px; margin: 0 !important; } .tz-woo-shortcode li.product.product-category img { -webkit-filter: grayscale(1); filter: grayscale(1); } .tz-woo-shortcode li.product.product-category:hover img { -webkit-filter: grayscale(0); filter: grayscale(0); } .tz-woo-shortcode .woocommerce ul.products li.product.product-category h3 { display: none; } @media (min-width: 768px) { .tz-woo-shortcode li.product.product-category { height: 100px; } } @media (max-width: 500px) { .tz-woo-shortcode .woocommerce ul.products[class*=columns-] li.product { width: 100%; float: none; margin: 0 auto 2em; padding: 0; max-width: 300px; } } /* Special Styles for Carousel preload */ .carousel-loader { display: inline-block; text-align: center; -webkit-border-radius: 50%; border-radius: 50%; width: 40px; height: 40px; margin: -20px 0 0 -20px; position: absolute; left: 50%; top: 50%; background-color: rgba(0, 0, 0, 0.25); -webkit-box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.4); box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.4); animation: loader_pulse 1s infinite linear; } @-webkit-keyframes loader_pulse { 0% { -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2); } 70% { -webkit-box-shadow: 0 0 0 25px rgba(0, 0, 0, 0); } 100% { -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0); } } @keyframes loader_pulse { 0% { -moz-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2); box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.2); } 70% { -moz-box-shadow: 0 0 0 25px rgba(0, 0, 0, 0); box-shadow: 0 0 0 25px rgba(0, 0, 0, 0); } 100% { -moz-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0); box-shadow: 0 0 0 0 rgba(0, 0, 0, 0); } } .carousel-loader::before { display: block; content: '\f013'; font-family: 'FontAwesome'; position: absolute; top: 50%; width: 40px; left: 50%; margin: -20px 0 0 -20px; height: 40px; line-height: 40px; font-size: 30px; color: rgba(255,255,255,0.6); animation: spinner 2s infinite linear; } @-webkit-keyframes spinner { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(359deg); transform: rotate(359deg); } } @keyframes spinner { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(359deg); transform: rotate(359deg); } } .tz-woo-shortcode.with-slider ul.products, .tz-product-tabs ul.products, .tz-from-blog .carousel-container, .tz-sales-carousel .carousel-container, .tz-testimonials .carousel-container, .tz-categories-grid .carousel-container { opacity: 0; -webkit-transition: opacity 0.3s ease-out, height 0.3s ease-out; -moz-transition: opacity 0.3s ease-out, height 0.3s ease-out; -ms-transition: opacity 0.3s ease-out, height 0.3s ease-out; -o-transition: opacity 0.3s ease-out, height 0.3s ease-out; transition: opacity 0.3s ease-out, height 0.3s ease-out; } /* Testimonials */ .tz-testimonials .carousel-container { display: block; margin: 0 auto; } .tz-testimonials .title-wrapper h3 { text-align: center; } .tz-testimonials .img-wrapper img { -webkit-border-radius: 50%; border-radius: 50%; } .tz-testimonials .item-wrapper { position: relative; padding: 1em; max-width: 300px; text-align: center; margin: 0 auto; } .tz-testimonials .img-wrapper { width: 80px; height: 80px; display: block; margin: 0 auto 15px; } .tz-testimonials .text-wrapper { text-align: left; } .tz-testimonials .text-wrapper a { font-size: 1.071em; } .tz-testimonials .item-wrapper::after { display: table; content: ''; clear: both; } .tz-testimonials cite { margin: 0; padding: 0; font-weight: 500; text-transform: uppercase; font-style: normal; } .tz-testimonials p { margin: 0 0 20px 0; padding: 0; font-size: 18px; line-height: 1.6; font-weight: 300; } .tz-testimonials .about-author { display: inline-block; vertical-align: top; margin: 4px 5px 0 0; line-height: 1.2; } .tz-testimonials .star-rating { overflow: hidden; position: relative; height: 20px; line-height: 20px; font-size: 16px; width: 80px; font-family: 'chromium'; display: inline-block; text-align: center; } .tz-testimonials .star-rating:before { content: "\e91d\e91d\e91d\e91d\e91d"; float: left; top: 0; left: 0; position: absolute; } .tz-testimonials .star-rating span { overflow: hidden; float: left; top: 0; left: 0; position: absolute; padding-top: 20px; } .tz-testimonials .star-rating span:before { content: "\e91d\e91d\e91d\e91d\e91d"; top: 0; position: absolute; left: 0 } @media (min-width: 768px) { .tz-testimonials .img-wrapper { width: 110px; height: 110px; } .tz-testimonials .item-wrapper { padding: 2em 3em 2em 175px; max-width: 100%; text-align: left; } .tz-testimonials .img-wrapper { position: absolute; left: 30px; top: 30px; margin: 0; } .tz-testimonials .star-rating { display: inline-block; margin: 0 0 10px 0; } } /* Testimonials style 2 */ .tz-testimonials.style-2 .item-wrapper { padding: 0; } .tz-testimonials.style-2 .img-wrapper { position: relative; left: auto; top: auto; float: left; margin: 0 1em 1em 0; } .tz-testimonials.style-2 .item-wrapper { text-align: left; } .tz-testimonials.style-2 .about-author { margin: 15px 0 10px 0; } .tz-testimonials.style-2 .text-wrapper { clear: both; } .tz-testimonials.style-2 .img-wrapper { position: relative; left: auto; top: auto; float: left; margin: 0 1em 1em 0; width: 60px; height: 60px; } .tz-testimonials.style-2 p { margin: 0 0 20px 0; padding: 0; font-size: 14px; font-weight: 400; } .tz-testimonials.style-2 .about-author { margin: 10px 0 5px 0; } .elementor-widget-tz-testimonials .tz-testimonials .wrapper .item-wrapper{ padding: 30px; } .elementor-widget-tz-testimonials .tz-testimonials .about-author{ display: block; } /* Recent Posts */ .tz-from-blog .item { display: flex; flex-wrap: wrap; justify-content: space-around; } .tz-from-blog .thumb-wrapper { max-width: 100%; } .tz-from-blog .item-content { padding: 1em; max-width: 100%; text-align: center; } .tz-from-blog.style-2 .item-content { padding: 15px 20px; } .tz-from-blog .thumb-wrapper { overflow: hidden; position: relative; width: 100%; } .tz-from-blog .addtional-meta-counters { position: absolute; left: 0; bottom: -20px; background-color: rgba(255,255,255,0.8); opacity: 0; padding: 10px; width: 100%; text-align: center; -webkit-transition: bottom 0.3s ease-out, opacity 0.3s ease-out; -ms-transition: bottom 0.3s ease-out, opacity 0.3s ease-out; transition: bottom 0.3s ease-out, opacity 0.3s ease-out; } .tz-from-blog .addtional-meta-counters > div { display: inline-block; margin-right: 20px; } .tz-from-blog .addtional-meta-counters > div:last-child { margin-right: 0; } .tz-from-blog .item:hover .addtional-meta-counters { bottom: 0px; opacity: 1; } .tz-from-blog .thumb-wrapper img { width: auto; margin: 0 auto; -webkit-transition: -webkit-transform 0.3s ease-out; -ms-transition: transform 0.3s ease-out; transition: transform 0.3s ease-out; -ms-transform: scale(1, 1); -webkit-transform: scale(1, 1); transform: scale(1, 1); } .tz-from-blog .item:hover img { -ms-transform: scale(1.1, 1.1); -webkit-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1); } .tz-from-blog .time-wrapper { font-size: 0.933em; margin: 0 0 1em 0; text-align: center; } .tz-from-blog.style-2 .time-wrapper { font-size: 0.867em; display: inline-block; margin: 0 0.667em 0.667em 0; text-transform: uppercase; } .tz-from-blog .post-views { display: inline-block; line-height: 40px; float: right; } .tz-from-blog .post-views i, .tz-from-blog .addtional-meta-counters i { font-size: 22px; vertical-align: middle; margin: 0 6px 0 0; } .tz-from-blog .addtional-meta-counters i { font-size: 18px; } .tz-from-blog .item-content a.post-cat-link { text-transform: uppercase; color: #fff; border-radius: 5px; padding: 3px 8px; display: inline-block; font-size: 0.800em; margin: 0 0.5em 0.5em 0; display: inline-block; } .tz-from-blog.style-2 .item-content a.post-cat-link { font-size: 0.867em; display: inline-block; margin: 0 0.667em 0.667em 0; text-transform: uppercase; } .tz-from-blog.style-2 .item-content a.post-cat-link:hover, .tz-from-blog.style-2 .item-content a.post-cat-link:focus, .tz-from-blog.style-2 .item-content a.post-cat-link:active { color: #000; } .tz-from-blog .item-content h6 { font-size: 1.067em; font-weight: 400; line-height: 1.25; word-wrap: break-word; text-align: center; margin-bottom: 5px; } .tz-from-blog.style-2 .item-content h6 { font-size: 1.333em; margin: 5px 0 15px 0; text-transform: none; } .tz-from-blog .item-content h6 a { color: inherit; } .tz-from-blog .entry-excerpt { margin: 0 0 1.667em 0; text-align: left; } .tz-from-blog .title-wrapper .slider-navi .slider-next:after { left: auto; right: -14px; } .tz-from-blog .title-wrapper .slider-navi .slider-next:hover:after { right: -20px; } .tz-from-blog.style-2 .title-wrapper { margin-bottom: 40px; border-style: solid; border-width: 0 0 1px 0; padding: 15px 0 20px 0; display: flex; align-items: center; justify-content: space-between; } .tz-from-blog.style-2 .title-wrapper .slider-navi { position: relative; right: auto; top: auto; } .tz-from-blog .entry-meta { text-align: left; margin-top: 1.5em; } @media (min-width: 768px) { .tz-from-blog .item { justify-content: space-between; } .tz-from-blog .item-content { text-align: left; padding: 2em; } .tz-from-blog .time-wrapper { text-align: left; } .tz-from-blog .item-content h6 { margin-bottom: 1em; text-align: left; } } @media (min-width: 992px) { .tz-from-blog .thumb-wrapper { max-width: 40%; } .tz-from-blog .item-content { max-width: 60%; } } /* Styles for image position */ .tz-from-blog.img-top .item { display: block; padding: 18px; background-color: #fff; } .tz-from-blog.img-top .thumb-wrapper, .tz-from-blog.img-top .item-content { max-width: 100%; padding: 0; } .tz-from-blog.img-top .thumb-wrapper { margin-bottom: 20px; } .tz-from-blog.img-top .thumb-wrapper img { width: auto; margin: 0 auto; } .tz-from-blog.style-2.img-top .title-wrapper { margin-bottom: 30px; } .tz-from-blog.img-right .item { flex-direction: row-reverse; } /* Repeatable Styles */ .title-wrapper { position: relative; text-align: center; margin-bottom: 35px; } .title-wrapper .shortcode-title { display: block; font-size: 1.857em; padding: 0; margin: 0; line-height: 1.2; font-weight: 300; text-transform: uppercase; } .title-wrapper .shortcode-title span { font-weight: 500; } .title-wrapper .slider-navi { display: none; padding: 0 15px 15px 0; position: relative; } .tab-pane .slider-navi { display: none; } .title-wrapper .slider-navi span, .owl-carousel .owl-nav div, .tab-pane .slider-navi span { display: inline-block; margin: 0 0 0 10px; cursor: pointer; position: relative; width: 35px; height: 30px; vertical-align: top; } .title-wrapper .slider-navi span+span::before, .owl-carousel .owl-nav div+div::before, .tab-pane .slider-navi span+span::before { display: inline-block; content: ''; width: 1px; height: 30px; vertical-align: top; margin-right: 10px; } .title-wrapper .slider-navi span:after, .owl-carousel .owl-nav div::after, .tab-pane .slider-navi span:after { display: inline-block; position: absolute; top: -9px; left: 0px; content: '\f104'; font-family: 'FontAwesome'; width: 35px; font-size: 32px; -webkit-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } .title-wrapper .slider-navi span:hover:after, .owl-carousel .owl-nav div:hover:after, .tab-pane .slider-navi span:hover:after { left: -6px; } .owl-carousel .owl-nav div.owl-prev:before { display: none; } .title-wrapper .slider-navi .next:after, .owl-carousel .owl-nav div.owl-next:after, .tab-pane .slider-navi .next:after { left: auto; right: -14px; content: '\f105'; } .title-wrapper .slider-navi .next:hover:after, .tab-pane .slider-navi .next:hover:after { left: auto; right: -20px; } .owl-carousel .owl-nav div::after { border-radius: 0; background-color: transparent; color: inherit; } .owl-carousel .owl-nav div.owl-next:after { right: -2px; top: -1px; } .owl-carousel .owl-nav div.owl-next:hover:after { left: auto; right: -4px; } @media (min-width: 768px) { .title-wrapper { text-align: left; } .title-wrapper .slider-navi { position: absolute; right: 25px; top: 0; padding: 0; } .tab-pane .slider-navi { display: inline-block; padding: 0; position: absolute; top: -68px; right: 5px; } .title-wrapper .slider-navi { display: inline-block; } } /* Product Categories Grid */ .tz-categories-grid .item { padding: 2em 1em; background-color: #fff; margin-bottom: 1em; display: flex; flex-wrap: nowrap; } .tz-categories-grid .title-wrapper { position: relative; } .tz-categories-grid .title-wrapper .shortcode-title { display: inline-block; } .tz-categories-grid .title-wrapper::after { display: table; content: ''; clear: both; } .tz-categories-grid .category-grid-button { height: 30px; line-height: 30px; text-transform: none; position: relative; margin-top: 20px; } .tz-categories-grid .img-wrapper { margin: 0 1em 1em 0; } .tz-categories-grid .cat-title-wrapper { font-weight: 500; font-size: 1.071em; text-transform: uppercase; } .chromium-look-tools .content-wrapper{ text-align: center; } .chromium-look-tools .tz-categories-grid .item{ box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.0); transition: box-shadow 300ms ease-out; margin-top: 4px; } .chromium-look-tools .tz-categories-grid .item:hover{ box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.15); } .chromium-look-tools .cat-title-wrapper{ font-size: 15px; color: #000; text-align: left; } .tz-categories-grid ul { list-style: none; padding: 12px 0 0 0; margin: 0; } .tz-categories-grid ul li { padding: 2px 0; } .tz-categories-grid ul li.show-all { padding: 12px 0 0 0; } .tz-categories-grid ul li.show-all i { padding: 0 0 0 5px; } @media screen and (min-width: 768px) { .tz-categories-grid .category-grid-button { float: right; top: 50%; margin-top: -15px; } @supports (grid-area: auto) { .tz-categories-grid:not(.with-slider) { display: grid; grid-column-gap: 2em; grid-row-gap: 2em; } .tz-categories-grid:not(.with-slider) .item { margin-bottom: 0; } /* 2 Cols */ .tz-categories-grid.columns-2:not(.with-slider) { grid-template-columns: 1fr 1fr; } /* 3 Cols */ .tz-categories-grid.columns-3:not(.with-slider) { grid-template-columns: 1fr 1fr 1fr; } /* 4 Cols */ .tz-categories-grid.columns-4:not(.with-slider), .site-boxed.layout-one-col .tz-categories-grid.columns-4:not(.with-slider) { grid-template-columns: 1fr 1fr 1fr 1fr; } .site-boxed .tz-categories-grid.columns-4:not(.with-slider) { grid-template-columns: 1fr 1fr 1fr; } /* 5 Cols */ .tz-categories-grid.columns-5:not(.with-slider) { grid-template-columns: 1fr 1fr 1fr 1fr 1fr; } .site-boxed .tz-categories-grid.columns-5:not(.with-slider) { grid-template-columns: 1fr 1fr 1fr; } .site-boxed.layout-one-col .tz-categories-grid.columns-5:not(.with-slider) { grid-template-columns: 1fr 1fr 1fr 1fr; } /* Title wrapper behavior */ .tz-categories-grid.columns-2:not(.with-slider) .title-wrapper { grid-column-start: span 2; } .tz-categories-grid.columns-3:not(.with-slider) .title-wrapper, .site-boxed .tz-categories-grid.columns-4:not(.with-slider) .title-wrapper, .site-boxed .tz-categories-grid.columns-5:not(.with-slider) .title-wrapper { grid-column-start: span 3; } .tz-categories-grid.columns-4:not(.with-slider) .title-wrapper, .site-boxed.layout-one-col .tz-categories-grid.columns-5:not(.with-slider) .title-wrapper { grid-column-start: span 4; } .tz-categories-grid.columns-5:not(.with-slider) .title-wrapper { grid-column-start: span 5; } } } /* Styles for carousel output */ .tz-categories-grid.with-slider .title-wrapper { margin-bottom: 40px; border-style: solid; border-width: 0 0 1px 0; padding: 15px 0 20px 0; display: flex; align-items: center; justify-content: space-between; } .tz-categories-grid.with-slider .title-wrapper::after { display: none; } .tz-categories-grid.with-slider .slider-navi { position: relative; right: auto; top: auto; } .tz-categories-grid.with-slider .item { padding: 2em; margin-bottom: 0; display: block; } .tz-categories-grid.with-slider .img-wrapper { float: none; margin: 0 0 1em 0; display: block; } /* Sale Carousel */ .tz-sales-carousel .img-wrapper, .tz-sales-carousel .sale-product-wrapper { text-align: center; position: relative; } .tz-sales-carousel .sale-product-wrapper { padding: 0 1em; } .tz-sales-carousel .img-wrapper img { max-width: 80%; margin: 0 auto 20px; } .tz-sales-carousel .sale-title-wrapper { font-size: 2.571em; text-transform: uppercase; font-weight: 500; margin-bottom: 20px; } .tz-sales-carousel .sale-title-wrapper span { font-weight: 400; } .tz-sales-carousel .product-link { font-size: 24px; color: inherit; margin-bottom: 10px; display: block; } .tz-sales-carousel .sale-description { font-size: 1em; max-width: 80%; display: inline-block; margin-bottom: 10px; line-height: 21px; } .tz-sales-carousel .button { font-size: 14px; padding: 0 30px; font-weight: 500; } .tz-sales-carousel .sale-product .countdown-wrapper { display: block; margin: 15px 0 0 0; } .tz-sales-carousel .countdown-row { display: inline-block; } .tz-sales-carousel .countdown-section { display: inline-block; float: left; width: 80px; margin: 2px 12px; color: #fff; font-weight: 300; text-transform: uppercase; position: relative; } .tz-sales-carousel .countdown-section+.countdown-section::before { display: inline-block; content: ':'; font-size: 2em; position: absolute; left: -14px; top: -3px; color: #cacaca; } .tz-sales-carousel .countdown-amount { font-size: 1.5em; display: block; text-align: center; height: 30px; width: 70px; } .tz-sales-carousel .countdown-period { display: block; font-size: 8px; text-align: center; font-weight: 500; height: 14px; line-height: 10px; margin-top: 5px; width: 70px; } .tz-sales-carousel .countdown-wrapper.style-2 { margin-bottom: 40px; } .tz-sales-carousel .countdown-wrapper.style-2 .countdown-section { font-weight: 500; background-color: transparent; } .tz-sales-carousel .countdown-wrapper.style-2 .countdown-amount { font-size: 2.400em; height: 46px; } .tz-sales-carousel .countdown-wrapper.style-2 .countdown-period { font-size: 12px; height: 14px; line-height: 10px; color: #cacaca; } .tz-sales-carousel .countdown-wrapper.style-2 .countdown-section+.countdown-section::before { font-size: 2em; top: 0; } .tz-sales-carousel .countdown-wrapper.style-2 .product-link { font-size: 1.600em; } .tz-sales-carousel .countdown-wrapper.style-2 .sale-title-wrapper { font-size: 2.400em; font-weight: 500; } .tz-sales-carousel .countdown-wrapper.style-2 .sale-title-wrapper span { font-weight: normal; } .tz-sales-carousel .sale-product .price-wrapper p { border: 0 !important; padding: 0 !important; font-size: 2em; margin: 15px 0 0 0; line-height: 40px; height: 80px; vertical-align: top; display: inline-block; } .tz-sales-carousel .woocommerce-Price-currencySymbol { font-size: 0.6em; vertical-align: text-bottom; display: inline-block; font-weight: 500; } .tz-sales-carousel .sale-product .price-wrapper del { font-size: 0.7em; opacity: 1; font-weight: normal; } .tz-sales-carousel del .woocommerce-Price-currencySymbol { font-size: 0.9em; font-weight: normal; vertical-align: baseline; } .tz-sales-carousel .sale-product .price-wrapper del span.amount { color: inherit; } .tz-sales-carousel .sale-product .price-wrapper ins { padding: 0; font-weight: normal; background: 0 0; float: left; margin-right: 15px; } .tz-sales-carousel .sale-product .price-wrapper .button { text-align: center; padding: 0 2em; font-size: 14px; font-weight: 500; vertical-align: top; } .tz-sales-carousel .sale-product .price-wrapper .added_to_cart { display: none; } .tz-sales-carousel .woocs_price_code::after { display: table; content: ''; clear: both; } .tz-sales-carousel .sale-sticker { position: absolute; -moz-transform: rotate(35deg); -webkit-transform: rotate(35deg); -o-transform: rotate(35deg); transform: rotate(35deg); } @media screen and (max-width: 768px) { .tz-sales-carousel .sale-sticker{ display: none; } } .tz-sales-carousel .sticker { position: absolute; width: 95%; height: 95%; top: -10%; left: 2.5%; box-shadow: 0px 2px 8px -1px #000; border-radius: 50%; } .tz-sales-carousel .stickercrop { position: absolute; width: 100%; height: 100%; overflow: hidden; } .tz-sales-carousel .fold { position: absolute; width: 95%; height: 95%; top: -85%; left: 2.5%; background-color: rgba(0,0,0,0.2); box-shadow: 0px 2px 8px -1px rgba(0, 0, 0, 0.1); border-radius: 50%; } .tz-sales-carousel .sale-sticker .text { -moz-transform: rotate(-35deg); -webkit-transform: rotate(-35deg); -o-transform: rotate(-35deg); transform: rotate(-35deg); font-size: 32px; text-align: left; } @media screen and (min-width: 768px) and (-ms-high-contrast:none) { .sale-product { display: flex; } .sale-product.reverse>.img-wrapper, .sale-product.reverse>.sale-product-wrapper { width: 50%; } } @media screen and (min-width: 768px) { @supports (grid-area: auto) { .sale-product { align-items: center; display: grid; grid-column-gap: 2em; grid-template-columns: 1fr 1fr; } .sale-product.reverse>.img-wrapper { grid-column: 2; } .sale-product.reverse>.sale-product-wrapper { grid-row: 1; grid-column: 1; } } .owl-item .sale-product-wrapper { opacity: 0; -webkit-transition: opacity 0.3s, -webkit-transform 0.3s; transition: opacity 0.3s, transform 0.3s; -webkit-transform: translate3d(-50px, 0, 0); transform: translate3d(-50px, 0, 0); } .owl-item.active .sale-product-wrapper { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition-delay: 0.3s; transition-delay: 0.3s; } .tz-sales-carousel .countdown-section+.countdown-section::before { font-size: 2.571em; top: 0px; } .tz-sales-carousel .countdown-period { font-size: 12px; height: 18px; line-height: 18px; } .tz-sales-carousel .sale-product .price-wrapper p { height: 40px; text-align: left; } .tz-sales-carousel .woocs_price_code { float: left; } .tz-sales-carousel .sale-product .price-wrapper .button { margin-left: 2em; } .tz-sales-carousel .img-wrapper img { margin: 0 auto; } .tz-sales-carousel .countdown-section { width: 52px; } .tz-sales-carousel .countdown-amount { font-size: 2em; height: 40px; } } @media screen and (min-width: 992px) { .tz-sales-carousel .countdown-section { width: 62px; } .tz-sales-carousel .countdown-amount { font-size: 2.286em; height: 44px; } } /* Custom Arrows for content carousels */ .tz-sales-carousel .wrapper, .tz-testimonials .wrapper { position: relative; } .tz-sales-carousel .slider-prev, .tz-sales-carousel .slider-next, .tz-testimonials .slider-prev, .tz-testimonials .slider-next { width: 50px; height: 100%; display: none; position: absolute; left: 0; top: 0; cursor: pointer; z-index: 2; } .tz-sales-carousel .slider-prev:before, .tz-sales-carousel .slider-next:before, .tz-testimonials .slider-prev:before, .tz-testimonials .slider-next:before { display: inline-block; top: 50%; color: inherit; font-size: 50px; margin-top: -37px; position: absolute; transition: all 0.3s ease-out; right: 5px; } .tz-sales-carousel .slider-next:before, .tz-testimonials .slider-next:before { right: auto; left: 5px; } .tz-sales-carousel .slider-next, .tz-testimonials .slider-next { left: auto; right: 0; } .tz-sales-carousel .slider-prev:hover::before, .tz-testimonials .slider-prev:hover::before { right: 15px; } .tz-sales-carousel .slider-next:hover::before, .tz-testimonials .slider-next:hover::before { left: 15px; } .tz-testimonials.dark .slider-prev:before, .tz-testimonials.dark .slider-next:before { color: rgba(255, 255, 255, 0.7); } .tz-testimonials.dark .slider-prev:hover:before, .tz-testimonials.dark .slider-next:hover:before { color: rgba(255, 255, 255, 1); } .tz-testimonials .slider-prev { left: -75px; } .tz-testimonials .slider-next { right: -75px; } @media screen and (min-width: 768px) { .tz-sales-carousel .slider-prev, .tz-sales-carousel .slider-next, .tz-testimonials .slider-prev, .tz-testimonials .slider-next { display: block; } } /* Hoverable Tabs */ .tz-hoverable-tabs { position: relative; } .tz-hoverable-tabs ul.nav { padding: 20px 15px 20px 20px; margin: 0; list-style: none; } .tz-hoverable-tabs ul.nav li { font-size: 0.933em; border-style: solid; border-width: 0 0 1px 0; padding: 10px 4px 9px 4px; cursor: pointer; } .tz-hoverable-tabs ul.nav > li:hover { font-weight: 500; background-color: #f6f6f6; } .tz-hoverable-tabs i.icon { float: right; position: relative; display: block; font-style: normal; width: 12px; text-align: right; } .tz-hoverable-tabs i.icon:before { display: inline-block; font-family: 'chromium'; content: '\e91b'; font-size: 10px; } .tz-hoverable-tabs ul.nav li:last-child { border-width: 0 0 0 0; padding: 10px 4px 10px 4px; } .tz-hoverable-tabs .inner-content { position: absolute; left: 100%; top: 0; visibility: hidden; opacity: 0; -webkit-transition: opacity 0.3s, -webkit-transform 0.3s; transition: opacity 0.3s, transform 0.3s; -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); background-color: #f6f6f6; z-index: 999; } .tz-hoverable-tabs li.active .inner-content { opacity: 1; -webkit-transform: translate3d(2px, 0, 0); transform: translate3d(2px, 0, 0); } @media screen and (max-width: 500px) { .tz-hoverable-tabs li { position: relative; } .tz-hoverable-tabs ul.nav li.active, .tz-hoverable-tabs ul.nav li:hover { background-color: transparent; } .tz-hoverable-tabs li .icon { position: absolute; float: none; right: 5px; top: 9px; } .tz-hoverable-tabs li.active .icon { transform: rotate(90deg); } .tz-hoverable-tabs .inner-content { position: relative; left: auto; top: auto; visibility: hidden; opacity: 0; display: none; -webkit-transition: opacity 0.3s, -webkit-transform 0.3s; transition: opacity 0.3s, transform 0.3s; -webkit-transform: translate3d(0, 15px, 0); transform: translate3d(0, 15px, 0); background-color: #fff; z-index: 999; max-width: 100%; } .tz-hoverable-tabs li.active .inner-content { display: block; opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
[+]
..
[-] frontend-widget-styles.css
[edit]
[-] elementor-widgets-styles.css
[edit]
[-] tz-feature-pack-public.css
[edit]
[-] .htaccess.disabled
[edit]