芝麻web文件管理V1.00
编辑当前文件:/home/royashxg/www/wp-content/plugins/premium-addons-for-elementor/assets/frontend/css/common.css
/* * Common Title/Dual Heading */ .premium-title-bg-text:before { position: absolute; content: attr(data-background); top: 0; left: 0; text-align: left; } .premium-bg-text-yes .elementor-widget-container:before { position: absolute; top: 0; left: 0; text-align: left; } .premium-mask-yes .premium-dual-header-first-clip .premium-dual-header-first-span .premium-mask-span, .premium-mask-yes .premium-dual-header-second-clip .premium-mask-span { background: inherit; } .premium-mask-yes .premium-mask-span { position: relative; overflow: hidden; display: -webkit-inline-flex !important; display: -ms-inline-flexbox !important; display: inline-flex !important; } .premium-mask-yes .premium-mask-span::after { content: ""; position: absolute; top: 0; right: 0px; width: 100%; height: 100%; background-color: currentColor; -webkit-backface-visibility: visible; backface-visibility: visible; } .premium-mask-active.premium-mask-tr .premium-mask-span::after { -webkit-animation: pa-mask-tr 1.7s cubic-bezier(1, 0, 0.18, 1) forwards; animation: pa-mask-tr 1.7s cubic-bezier(1, 0, 0.18, 1) forwards; -webkit-transform: translateX(-103%); -ms-transform: translateX(-103%); transform: translateX(-103%); } .premium-mask-active.premium-mask-tl .premium-mask-span::after { -webkit-animation: pa-mask-tl 1.7s cubic-bezier(1, 0, 0.18, 1) forwards; animation: pa-mask-tl 1.7s cubic-bezier(1, 0, 0.18, 1) forwards; -webkit-transform: translateX(103%); -ms-transform: translateX(103%); transform: translateX(103%); } .premium-mask-active.premium-mask-tb .premium-mask-span::after { -webkit-animation: pa-mask-tb 1.7s cubic-bezier(1, 0, 0.18, 1) forwards; animation: pa-mask-tb 1.7s cubic-bezier(1, 0, 0.18, 1) forwards; -webkit-transform: translateY(-103%); -ms-transform: translateY(-103%); transform: translateY(-103%); } .premium-mask-active.premium-mask-tt .premium-mask-span::after { -webkit-animation: pa-mask-tt 1.7s cubic-bezier(1, 0, 0.18, 1) forwards; animation: pa-mask-tt 1.7s cubic-bezier(1, 0, 0.18, 1) forwards; -webkit-transform: translateY(103%); -ms-transform: translateY(103%); transform: translateY(103%); } @-webkit-keyframes pa-mask-tr { 0% { -webkit-transform: translateX(0%); transform: translateX(0%); } 100% { -webkit-transform: translateX(103%); transform: translateX(103%); } } @keyframes pa-mask-tr { 0% { -webkit-transform: translateX(0%); transform: translateX(0%); } 100% { -webkit-transform: translateX(103%); transform: translateX(103%); } } @-webkit-keyframes pa-mask-tl { 0% { -webkit-transform: translateX(0%); transform: translateX(0%); } 100% { -webkit-transform: translateX(-103%); transform: translateX(-103%); } } @keyframes pa-mask-tl { 0% { -webkit-transform: translateX(0%); transform: translateX(0%); } 100% { -webkit-transform: translateX(-103%); transform: translateX(-103%); } } @-webkit-keyframes pa-mask-tb { 0% { -webkit-transform: translateY(0%); transform: translateY(0%); } 100% { -webkit-transform: translateY(103%); transform: translateY(103%); } } @keyframes pa-mask-tb { 0% { -webkit-transform: translateY(0%); transform: translateY(0%); } 100% { -webkit-transform: translateY(103%); transform: translateY(103%); } } @-webkit-keyframes pa-mask-tt { 0% { -webkit-transform: translateY(0%); transform: translateY(0%); } 100% { -webkit-transform: translateY(-103%); transform: translateY(-103%); } } @keyframes pa-mask-tt { 0% { -webkit-transform: translateY(0%); transform: translateY(0%); } 100% { -webkit-transform: translateY(-103%); transform: translateY(-103%); } } /* * Common Buttons Style. */ .premium-button .premium-lottie-animation, .premium-image-button .premium-lottie-animation { display: -webkit-flex; display: -ms-flexbox; display: flex; } .premium-button svg:not(.premium-btn-svg), .premium-image-button svg:not(.premium-btn-svg) { width: 30px; height: 30px; } .premium-btn-sm, .premium-btn-md, .premium-btn-lg, .premium-btn-block { background-color: #eee; color: #042551; margin: 0px; text-decoration: none; } .premium-btn-sm:hover, .premium-btn-md:hover, .premium-btn-lg:hover, .premium-btn-block:hover { background-color: #54595f; color: #eee; } div[class*=elementor-widget-premium] .premium-btn-sm { padding: 12px 24px; font-size: 14px; line-height: 1; } div[class*=elementor-widget-premium] .premium-btn-sm.premium-button-line6::after { padding: 12px 24px; } div[class*=elementor-widget-premium] .premium-btn-md { padding: 14px 26px; font-size: 16px; line-height: 1.2; } div[class*=elementor-widget-premium] .premium-btn-md.premium-button-line6::after { padding: 14px 26px; } div[class*=elementor-widget-premium] .premium-btn-lg { padding: 16px 28px; font-size: 18px; line-height: 1.3333; } div[class*=elementor-widget-premium] .premium-btn-lg.premium-button-line6::after { padding: 16px 28px; } div[class*=elementor-widget-premium] .premium-btn-block { font-size: 18px; line-height: 1; padding: 20px 0px; width: 100%; text-align: center; } div[class*=elementor-widget-premium] .premium-btn-block.premium-button-line6::after { padding: 20px 0px; } .premium-button-text { display: inline-block; width: 100%; } /* * Common Button/Image Button Mouse Detect Effect. */ .premium-mouse-detect-yes .premium-button-style6 .premium-button-style6-bg { position: absolute; z-index: 0; top: 0; left: 0; width: 0px; height: 0px; border-radius: 50%; display: block; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transition: width 0.4s ease-in-out, height 0.4s ease-in-out; transition: width 0.4s ease-in-out, height 0.4s ease-in-out; } .premium-mouse-detect-yes .premium-button-style6:hover .premium-button-style6-bg { width: 225%; height: 560px; } .premium-mouse-detect-yes .premium-button-style6:before { width: 0; height: 0; } /** Loader */ .premium-loader { border: 3px solid #f3f3f3; border-top-width: 3px; border-top-style: solid; border-top-color: #f3f3f3; border-radius: 50%; border-top: 3px solid; border-top-color: #bbb; width: 30px; height: 30px; -webkit-animation: spin 2s linear infinite; animation: spin 2s linear infinite; margin: 0 auto; } /* Common SVG Draw premium-svg-drawer not prefixed with 'svg' because it's rendered as div with custom SVG code. */ .premium-svg-nodraw *, .premium-svg-drawer * { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; -webkit-transition-property: stroke, fill, background-color !important; transition-property: stroke, fill, background-color !important; } .premium-svg-nodraw .no-transition, .premium-svg-drawer .no-transition { -webkit-transition: none !important; transition: none !important; } /** This is added to give a default Path Thickness because the Icon will be invisible if icon color has no value. */ .premium-svg-drawer * { stroke-width: 15px; stroke: #000; } /** Common Animation */ @-webkit-keyframes spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @-webkit-keyframes pa-btn-glitch { 0% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 10% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 20% { -webkit-transform: translate3d(0, 4px, 0); transform: translate3d(0, 4px, 0); } 30% { -webkit-transform: scale3d(0.1, 1.4, 1) translate3d(0, -25px, 0); transform: scale3d(0.1, 1.4, 1) translate3d(0, -25px, 0); -webkit-transform-origin: 100% 0; transform-origin: 100% 0; } 40% { -webkit-transform: scale3d(1, 0.3, 1) translate3d(0, 25px, 0); transform: scale3d(1, 0.3, 1) translate3d(0, 25px, 0); } 50% { -webkit-transform: scale3d(0.5, 0.3, 1) translate3d(-100px, -80px, 0); transform: scale3d(0.5, 0.3, 1) translate3d(-100px, -80px, 0); } 60% { -webkit-transform: scale3d(1, 1.25, 1) translate3d(10px, -5px, 0); transform: scale3d(1, 1.25, 1) translate3d(10px, -5px, 0); } 70% { -webkit-transform: scale3d(0.5, 0.5, 1) translate3d(0, 20px, 0); transform: scale3d(0.5, 0.5, 1) translate3d(0, 20px, 0); } 80% { -webkit-transform: translate3d(-30, 10px, 0) scale3d(1, 0.4, 1); transform: translate3d(-30, 10px, 0) scale3d(1, 0.4, 1); -webkit-transform-origin: 100% 0; transform-origin: 100% 0; } 90% { -webkit-transform: scale3d(1, 0.5, 1) translate3d(0, -15px, 0); transform: scale3d(1, 0.5, 1) translate3d(0, -15px, 0); -webkit-transform-origin: 0 50%; transform-origin: 0 50%; } 100% { opacity: 1; } } @keyframes pa-btn-glitch { 0% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 10% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 20% { -webkit-transform: translate3d(0, 4px, 0); transform: translate3d(0, 4px, 0); } 30% { -webkit-transform: scale3d(0.1, 1.4, 1) translate3d(0, -25px, 0); transform: scale3d(0.1, 1.4, 1) translate3d(0, -25px, 0); -webkit-transform-origin: 100% 0; transform-origin: 100% 0; } 40% { -webkit-transform: scale3d(1, 0.3, 1) translate3d(0, 25px, 0); transform: scale3d(1, 0.3, 1) translate3d(0, 25px, 0); } 50% { -webkit-transform: scale3d(0.5, 0.3, 1) translate3d(-100px, -80px, 0); transform: scale3d(0.5, 0.3, 1) translate3d(-100px, -80px, 0); } 60% { -webkit-transform: scale3d(1, 1.25, 1) translate3d(10px, -5px, 0); transform: scale3d(1, 1.25, 1) translate3d(10px, -5px, 0); } 70% { -webkit-transform: scale3d(0.5, 0.5, 1) translate3d(0, 20px, 0); transform: scale3d(0.5, 0.5, 1) translate3d(0, 20px, 0); } 80% { -webkit-transform: translate3d(-30, 10px, 0) scale3d(1, 0.4, 1); transform: translate3d(-30, 10px, 0) scale3d(1, 0.4, 1); -webkit-transform-origin: 100% 0; transform-origin: 100% 0; } 90% { -webkit-transform: scale3d(1, 0.5, 1) translate3d(0, -15px, 0); transform: scale3d(1, 0.5, 1) translate3d(0, -15px, 0); -webkit-transform-origin: 0 50%; transform-origin: 0 50%; } 100% { opacity: 1; } } @-webkit-keyframes pa-text-glitch { 0% { opacity: 1; -webkit-transform: translate3d(-10px, 0, 0) scale3d(-1, -1, 1); transform: translate3d(-10px, 0, 0) scale3d(-1, -1, 1); -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 21%, 0 21%); clip-path: polygon(0 20%, 100% 20%, 100% 21%, 0 21%); } 10% { -webkit-clip-path: polygon(0 33%, 100% 33%, 100% 33%, 0 33%); clip-path: polygon(0 33%, 100% 33%, 100% 33%, 0 33%); } 20% { -webkit-clip-path: polygon(0 44%, 100% 44%, 100% 44%, 0 44%); clip-path: polygon(0 44%, 100% 44%, 100% 44%, 0 44%); } 35% { -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 20%, 0 20%); clip-path: polygon(0 50%, 100% 50%, 100% 20%, 0 20%); } 50% { -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%); clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%); } 60% { -webkit-clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%); clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%); } 70% { -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%); clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%); } 80% { -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 80%, 0 80%); clip-path: polygon(0 70%, 100% 70%, 100% 80%, 0 80%); } 90% { -webkit-transform: translate3d(-10px, 0, 0) scale3d(-1, -1, 1); transform: translate3d(-10px, 0, 0) scale3d(-1, -1, 1); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); } } @keyframes pa-text-glitch { 0% { opacity: 1; -webkit-transform: translate3d(-10px, 0, 0) scale3d(-1, -1, 1); transform: translate3d(-10px, 0, 0) scale3d(-1, -1, 1); -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 21%, 0 21%); clip-path: polygon(0 20%, 100% 20%, 100% 21%, 0 21%); } 10% { -webkit-clip-path: polygon(0 33%, 100% 33%, 100% 33%, 0 33%); clip-path: polygon(0 33%, 100% 33%, 100% 33%, 0 33%); } 20% { -webkit-clip-path: polygon(0 44%, 100% 44%, 100% 44%, 0 44%); clip-path: polygon(0 44%, 100% 44%, 100% 44%, 0 44%); } 35% { -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 20%, 0 20%); clip-path: polygon(0 50%, 100% 50%, 100% 20%, 0 20%); } 50% { -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%); clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%); } 60% { -webkit-clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%); clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%); } 70% { -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%); clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%); } 80% { -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 80%, 0 80%); clip-path: polygon(0 70%, 100% 70%, 100% 80%, 0 80%); } 90% { -webkit-transform: translate3d(-10px, 0, 0) scale3d(-1, -1, 1); transform: translate3d(-10px, 0, 0) scale3d(-1, -1, 1); } 100% { opacity: 1; -webkit-transform: translate3d(0, 0, 0) scale3d(1, 1, 1); transform: translate3d(0, 0, 0) scale3d(1, 1, 1); -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); } } /**Notice*/ .premium-error-notice { width: 100%; padding: 10px; color: #b94a48; background-color: #f2dede; border-color: #eed3d7; text-align: center; } .premium-error-notice a { color: #252c59; } .premium-addons__v-hidden { visibility: hidden; opacity: 0; } /* * Share Button in Instagram & Pinterest Feed. */ .premium-instafeed-share-container, .premium-pinterest-share-container, .premium-tiktok-share-container { padding: 2px; display: -webkit-flex; display: -ms-flexbox; display: flex; } .premium-instafeed-share-container .fa.fa-share, .premium-pinterest-share-container .fa.fa-share, .premium-tiktok-share-container .fa.fa-share { color: transparent; } .premium-instafeed-share-container .fa.custom-fa, .premium-pinterest-share-container .fa.custom-fa, .premium-tiktok-share-container .fa.custom-fa { font-size: 17px; -webkit-text-stroke-color: #595959; color: transparent; } .premium-instafeed-share-container .fa.fa-share, .premium-pinterest-share-container .fa.fa-share { -webkit-text-stroke-width: 2px; } .premium-tiktok-share-container .fa.fa-share { -webkit-text-stroke-width: 1px; } .premium-instafeed-share-container { background-color: #fff; } .premium-pinterest-share-container, .premium-tiktok-share-container { border-radius: 12px; } .premium-instafeed-share-menu, .premium-pinterest-share-menu, .premium-tiktok-share-menu { position: absolute; z-index: 100; padding: 20px 0; opacity: 0; bottom: 40px; visibility: hidden; background-color: #fff; width: -webkit-max-content; width: max-content; border-radius: 4px; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1); } .premium-instafeed-share-menu, .premium-pinterest-share-menu { left: 10px; } .premium-tiktok-share-menu { right: 0; border-radius: 20px; padding: 15px 0; } .premium-pinterest-share-button, .premium-tiktok-share-button, .premium-instafeed-share-button { padding: 12px; position: relative; -webkit-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; cursor: pointer; } .premium-instafeed-share-button:hover .premium-instafeed-share-menu { visibility: visible; opacity: 1; z-index: 100; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .premium-pinterest-share-button:hover .premium-pinterest-share-menu { visibility: visible; opacity: 1; z-index: 1000; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .premium-tiktok-share-button:hover .premium-tiktok-share-menu { visibility: visible; opacity: 1; z-index: 1000; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .premium-instafeed-sharer, .premium-pinterest-sharer, .premium-tiktok-sharer { font-size: 16px; font-weight: 200; line-height: 22px; color: #595959; } .premium-instafeed-share-item, .premium-pinterest-share-item, .premium-tiktok-share-item { word-break: keep-all !important; display: -webkit-flex; display: -ms-flexbox; display: flex; padding: 0 20px; -webkit-align-items: center; -ms-flex-align: center; align-items: center; line-height: 30px; font-weight: 200; } .premium-instafeed-share-item *, .premium-instafeed-share-item ::before, .premium-instafeed-share-item ::after, .premium-pinterest-share-item *, .premium-pinterest-share-item ::before, .premium-pinterest-share-item ::after, .premium-tiktok-share-item *, .premium-tiktok-share-item ::before, .premium-tiktok-share-item ::after { word-break: keep-all !important; } .premium-instafeed-share-item i, .premium-pinterest-share-item i, .premium-tiktok-share-item i { text-align: center; -ms-flex-negative: 0; -webkit-flex-shrink: 0; flex-shrink: 0; width: 1.25em; } .premium-tiktok-share-item { padding: 6px 20px; line-height: 0; } .premium-instafeed-share-text, .premium-pinterest-share-text, .premium-tiktok-share-text { display: inline-block; -webkit-align-self: center; -ms-flex-item-align: center; align-self: center; font-size: 13px; color: #595959; } .if-fb { color: #4674d1; } .if-tw { color: #23abff; } .if-pi { color: #e60023; } .if-link { color: #000; } /** Premium Loading Animation*/ .premium-loading-animation__slide-up .premium-pinterest-feed__content-wrapper, .premium-loading-animation__slide-up .premium-pinterest-feed__board-wrapper, .premium-loading-animation__slide-up .premium-smart-listing__grid-item, .premium-loading-animation__slide-up .premium-pinterest-feed__pin-outer-wrapper.premium-display-none, .premium-loading-animation__slide-up .premium-tiktok-feed__video-outer-wrapper.premium-display-none { -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); opacity: 0; -webkit-animation: pa-smart-slide-up 400ms forwards; animation: pa-smart-slide-up 400ms forwards; } .premium-loading-animation__slide-down .premium-pinterest-feed__content-wrapper, .premium-loading-animation__slide-down .premium-pinterest-feed__board-wrapper, .premium-loading-animation__slide-down .premium-smart-listing__grid-item, .premium-loading-animation__slide-down .premium-pinterest-feed__pin-outer-wrapper.premium-display-none, .premium-loading-animation__slide-down .premium-tiktok-feed__video-outer-wrapper.premium-display-none { -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); opacity: 0; -webkit-animation: pa-smart-slide-down 400ms forwards; animation: pa-smart-slide-down 400ms forwards; } .premium-loading-animation__slide-left .premium-pinterest-feed__content-wrapper, .premium-loading-animation__slide-left .premium-pinterest-feed__board-wrapper, .premium-loading-animation__slide-left .premium-smart-listing__grid-item, .premium-loading-animation__slide-left .premium-pinterest-feed__pin-outer-wrapper.premium-display-none, .premium-loading-animation__slide-left .premium-tiktok-feed__video-outer-wrapper.premium-display-none { -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); opacity: 0; -webkit-animation: pa-smart-slide-left 400ms forwards; animation: pa-smart-slide-left 400ms forwards; } .premium-loading-animation__slide-right .premium-pinterest-feed__content-wrapper, .premium-loading-animation__slide-right .premium-pinterest-feed__board-wrapper, .premium-loading-animation__slide-right .premium-smart-listing__grid-item, .premium-loading-animation__slide-right .premium-pinterest-feed__pin-outer-wrapper.premium-display-none, .premium-loading-animation__slide-right .premium-tiktok-feed__video-outer-wrapper.premium-display-none { -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); opacity: 0; -webkit-animation: pa-smart-slide-right 400ms forwards; animation: pa-smart-slide-right 400ms forwards; } @-webkit-keyframes pa-smart-slide-up { 0% { -webkit-transform: translateY(20px); transform: translateY(20px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @keyframes pa-smart-slide-up { 0% { -webkit-transform: translateY(20px); transform: translateY(20px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @-webkit-keyframes pa-smart-slide-down { 0% { -webkit-transform: translateY(-20px); transform: translateY(-20px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @keyframes pa-smart-slide-down { 0% { -webkit-transform: translateY(-20px); transform: translateY(-20px); opacity: 0; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1; } } @-webkit-keyframes pa-smart-slide-left { 0% { -webkit-transform: translateX(20px); transform: translateX(20px); opacity: 0; } 100% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } } @keyframes pa-smart-slide-left { 0% { -webkit-transform: translateX(20px); transform: translateX(20px); opacity: 0; } 100% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } } @-webkit-keyframes pa-smart-slide-right { 0% { -webkit-transform: translateX(-20px); transform: translateX(-20px); opacity: 0; } 100% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } } @keyframes pa-smart-slide-right { 0% { -webkit-transform: translateX(-20px); transform: translateX(-20px); opacity: 0; } 100% { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } } /** End Of Loading Animation*/ /**Image Hover Effects*/ .premium-hover-effects__zoomout, .premium-hover-effects__scale { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); } .premium-hover-effects__blur { -webkit-filter: blur(1px); filter: blur(1px); } .premium-hover-effects__gray { -webkit-filter: grayscale(100%); filter: grayscale(100%); } .premium-hover-effects__sepia { -webkit-filter: sepia(30%); filter: sepia(30%); } .premium-hover-effects__bright { -webkit-filter: brightness(1); filter: brightness(1); } .premium-hover-effects__trans { -webkit-transform: translateX(-15px) scale(1.1); -ms-transform: translateX(-15px) scale(1.1); transform: translateX(-15px) scale(1.1); } .premium-pinterest-feed__board-wrapper:hover .premium-hover-effects__zoomin, .premium-pinterest-feed__pin-wrapper:hover .premium-hover-effects__zoomin, .premium-tiktok-feed__video-wrapper:hover .premium-hover-effects__zoomin, .premium-adv-carousel__item:hover .premium-hover-effects__zoomin { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); } .premium-pinterest-feed__board-wrapper:hover .premium-hover-effects__zoomout, .premium-pinterest-feed__pin-wrapper:hover .premium-hover-effects__zoomout, .premium-tiktok-feed__video-wrapper:hover .premium-hover-effects__zoomout, .premium-adv-carousel__item:hover .premium-hover-effects__zoomout { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .premium-pinterest-feed__board-wrapper:hover .premium-hover-effects__scale, .premium-pinterest-feed__pin-wrapper:hover .premium-hover-effects__scale, .premium-tiktok-feed__video-wrapper:hover .premium-hover-effects__scale, .premium-adv-carousel__item:hover .premium-hover-effects__scale { -webkit-transform: scale(1.3) rotate(5deg); -ms-transform: scale(1.3) rotate(5deg); transform: scale(1.3) rotate(5deg); } .premium-pinterest-feed__board-wrapper:hover .premium-hover-effects__gray, .premium-pinterest-feed__pin-wrapper:hover .premium-hover-effects__gray, .premium-tiktok-feed__video-wrapper:hover .premium-hover-effects__gray, .premium-adv-carousel__item:hover .premium-hover-effects__gray { -webkit-filter: grayscale(0); filter: grayscale(0); } .premium-pinterest-feed__board-wrapper:hover .premium-hover-effects__blur, .premium-pinterest-feed__pin-wrapper:hover .premium-hover-effects__blur, .premium-tiktok-feed__video-wrapper:hover .premium-hover-effects__blur, .premium-adv-carousel__item:hover .premium-hover-effects__blur { -webkit-filter: blur(0px); filter: blur(0px); } .premium-pinterest-feed__board-wrapper:hover .premium-hover-effects__sepia, .premium-pinterest-feed__pin-wrapper:hover .premium-hover-effects__sepia, .premium-tiktok-feed__video-wrapper:hover .premium-hover-effects__sepia, .premium-adv-carousel__item:hover .premium-hover-effects__sepia { -webkit-filter: sepia(0%); filter: sepia(0%); } .premium-pinterest-feed__board-wrapper:hover .premium-hover-effects__bright, .premium-pinterest-feed__pin-wrapper:hover .premium-hover-effects__bright, .premium-tiktok-feed__video-wrapper:hover .premium-hover-effects__bright, .premium-adv-carousel__item:hover .premium-hover-effects__bright { -webkit-filter: brightness(1.2); filter: brightness(1.2); } .premium-pinterest-feed__board-wrapper:hover .premium-hover-effects__trans, .premium-pinterest-feed__pin-wrapper:hover .premium-hover-effects__trans, .premium-tiktok-feed__video-wrapper:hover .premium-hover-effects__trans, .premium-adv-carousel__item:hover .premium-hover-effects__trans { -webkit-transform: translateX(0px) scale(1.1); -ms-transform: translateX(0px) scale(1.1); transform: translateX(0px) scale(1.1); } /**End of Image Hover Effects*/ /**Start of Button Hover Effects*/ .premium-button-text-icon-wrapper { display: -webkit-flex; display: -ms-flexbox; display: flex; } [class*=premium-button-style]:not(.premium-button-style8), .premium-image-button:not(.premium-button-style8) { overflow: hidden; } .premium-button-style1, .premium-button-style2, .premium-button-style5, .premium-button-style7 { display: inline-block; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px transparent; position: relative; -webkit-transition-property: all; transition-property: all; -webkit-transition-duration: 0.15s; transition-duration: 0.15s; } .premium-button-style1:before, .premium-button-style2:before, .premium-button-style5:before { content: ""; position: absolute; z-index: -1; top: 0; left: 0; right: 0; bottom: 0; -webkit-transform: scaleY(0); -ms-transform: scaleY(0); transform: scaleY(0); -webkit-transform-origin: 50% 0; -ms-transform-origin: 50% 0; transform-origin: 50% 0; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-transition-duration: 0.15s; transition-duration: 0.15s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } .premium-button-style5-radialin:before, .premium-button-style5-radialout:before { -webkit-transform-origin: 50%; -ms-transform-origin: 50%; transform-origin: 50%; border-radius: 100%; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); } .premium-button-style5-radialin:before { -webkit-transform: scale(2); -ms-transform: scale(2); transform: scale(2); } .premium-button-style5-rectin:before { -webkit-transform-origin: 50%; -ms-transform-origin: 50%; transform-origin: 50%; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .premium-button-style5-rectout:before { -webkit-transform-origin: 50%; -ms-transform-origin: 50%; transform-origin: 50%; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); } .premium-button-style5-rectout:hover:before { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .premium-button-style5-rectin:hover:before { -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); } .premium-button-style5-radialout:hover:before { -webkit-transform: scale(2); -ms-transform: scale(2); transform: scale(2); } .premium-button-style5-radialin:hover:before { -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); } .premium-button-style1-top:before { -webkit-transform-origin: 50% 100%; -ms-transform-origin: 50% 100%; transform-origin: 50% 100%; } .premium-button-style1-right:before { -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; } .premium-button-style1-left:before { -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 100% 50%; -ms-transform-origin: 100% 50%; transform-origin: 100% 50%; } .premium-button-style2-shutouthor:before, .premium-button-style2-scshutoutver:before { -webkit-transform: scaleY(0); -ms-transform: scaleY(0); transform: scaleY(0); -webkit-transform-origin: 100% 50%; -ms-transform-origin: 100% 50%; transform-origin: 100% 50%; } .premium-button-style2-shutoutver:before, .premium-button-style2-scshutouthor:before { -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } .premium-button-style2-shutinhor:before { -webkit-transform: scaleX(1); -ms-transform: scaleX(1); transform: scaleX(1); -webkit-transform-origin: 50%; -ms-transform-origin: 50%; transform-origin: 50%; } .premium-button-style2-shutinver:before { -webkit-transform: scaleY(1); -ms-transform: scaleY(1); transform: scaleY(1); -webkit-transform-origin: 50%; -ms-transform-origin: 50%; transform-origin: 50%; } .premium-button-style1-bottom:hover:before, .premium-button-style1-top:hover:before { -webkit-transform: scaleY(1); -ms-transform: scaleY(1); transform: scaleY(1); } .premium-button-style1-left:hover:before, .premium-button-style1-right:hover:before, .premium-button-style2-shutouthor:hover:before, .premium-button-style2-shutoutver:hover:before { -webkit-transform: scaleX(1); -ms-transform: scaleX(1); transform: scaleX(1); } .premium-button-style2-shutinhor:hover:before { -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); } .premium-button-style2-shutinver:hover:before { -webkit-transform: scaleY(0); -ms-transform: scaleY(0); transform: scaleY(0); } .premium-button-style2-scshutouthor:hover:before { -webkit-transform: scaleX(0.9); -ms-transform: scaleX(0.9); transform: scaleX(0.9); } .premium-button-style2-scshutoutver:hover:before { -webkit-transform: scaleY(0.8); -ms-transform: scaleY(0.8); transform: scaleY(0.8); } /*Diagonal*/ .premium-button-style2-dshutinhor:before { top: 50%; left: 50%; width: 120%; height: 0%; -webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(-45deg); transform: translateX(-50%) translateY(-50%) rotate(-45deg); -webkit-transform-origin: 50%; -ms-transform-origin: 50%; transform-origin: 50%; -webkit-transition-property: all; transition-property: all; } .premium-button-style2-dshutinver:before { top: 50%; left: 50%; width: 120%; height: 0%; -webkit-transform-origin: 50%; -ms-transform-origin: 50%; transform-origin: 50%; -webkit-transition-property: all; transition-property: all; -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg); -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg); transform: translateX(-50%) translateY(-50%) rotate(45deg); } .premium-button-style2-dshutinhor:hover:before, .premium-button-style2-dshutinver:hover:before { height: 220%; } .premium-button-style6 { position: relative; } .premium-button-style6:before { content: ""; position: absolute; left: 50%; top: 50%; width: 100px; height: 100px; border-radius: 100%; -webkit-transform: translate(-50%, -50%) scale(0); -ms-transform: translate(-50%, -50%) scale(0); transform: translate(-50%, -50%) scale(0); -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .premium-button-style6:hover:before { -webkit-transform: translate(-50%, -50%) scale(3); -ms-transform: translate(-50%, -50%) scale(3); transform: translate(-50%, -50%) scale(3); } .premium-button-style6 > *:not(.premium-button-style6-bg) { position: relative; z-index: 1; } .premium-button-style7-right .premium-button-text-icon-wrapper:before, .premium-button-style7-left .premium-button-text-icon-wrapper:before { -webkit-transition: width 0.3s ease-out 0.15s; transition: width 0.3s ease-out 0.15s; } .premium-button-style7-right .premium-button-text-icon-wrapper:after, .premium-button-style7-left .premium-button-text-icon-wrapper:after { -webkit-transition: width 0.3s ease-out 0s; transition: width 0.3s ease-out 0s; } .premium-button-style7-bottom .premium-button-text-icon-wrapper:before, .premium-button-style7-top .premium-button-text-icon-wrapper:before { -webkit-transition: height 0.3s ease-out 0.15s; transition: height 0.3s ease-out 0.15s; } .premium-button-style7-bottom .premium-button-text-icon-wrapper:after, .premium-button-style7-top .premium-button-text-icon-wrapper:after { -webkit-transition: height 0.3s ease-out 0s; transition: height 0.3s ease-out 0s; } .premium-button-style7:hover .premium-button-text-icon-wrapper:before { -webkit-transition-delay: 0s; transition-delay: 0s; } .premium-button-style7:hover .premium-button-text-icon-wrapper:after { -webkit-transition-delay: 0.15s; transition-delay: 0.15s; } .premium-button-style7-bottom .premium-button-text-icon-wrapper:before, .premium-button-style7-bottom .premium-button-text-icon-wrapper:after { content: ""; position: absolute; right: 0; top: 0; left: 0; height: 0; z-index: -1; } .premium-button-style7-top .premium-button-text-icon-wrapper:after, .premium-button-style7-top .premium-button-text-icon-wrapper:before { content: ""; position: absolute; right: 0; bottom: 0; left: 0; height: 0; z-index: -1; } .premium-button-style7-right .premium-button-text-icon-wrapper:after, .premium-button-style7-right .premium-button-text-icon-wrapper:before { content: ""; position: absolute; right: 0; top: 0; bottom: 0; width: 0; z-index: -1; } .premium-button-style7-left .premium-button-text-icon-wrapper:after, .premium-button-style7-left .premium-button-text-icon-wrapper:before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 0; z-index: -1; } .premium-button-style7-bottom:hover .premium-button-text-icon-wrapper:after, .premium-button-style7-bottom:hover .premium-button-text-icon-wrapper:before { height: 100%; top: 0; } .premium-button-style7-top:hover .premium-button-text-icon-wrapper:after, .premium-button-style7-top:hover .premium-button-text-icon-wrapper:before { height: 100%; bottom: 0; } .premium-button-style7-left:hover .premium-button-text-icon-wrapper:after, .premium-button-style7-left:hover .premium-button-text-icon-wrapper:before { width: 100%; left: 0; } .premium-button-style7-right:hover .premium-button-text-icon-wrapper:after, .premium-button-style7-right:hover .premium-button-text-icon-wrapper:before { width: 100%; right: 0; } .premium-button-style8 { position: relative; } .premium-button-line1 .premium-btn-line-wrap { position: absolute; top: 100%; left: 0; width: 100%; } .premium-button-line1 .premium-btn-svg { stroke: currentColor; stroke-width: 1px; height: auto; } .premium-button-line1 .premium-btn-svg path { -webkit-transition: stroke-dashoffset 0.6s cubic-bezier(0.7, 0, 0.3, 1); transition: stroke-dashoffset 0.6s cubic-bezier(0.7, 0, 0.3, 1); stroke-dasharray: 1; stroke-dashoffset: 1; fill: none; } .premium-button-line1:hover .premium-btn-svg path { -webkit-transition-timing-function: cubic-bezier(0.8, 1, 0.7, 1); transition-timing-function: cubic-bezier(0.8, 1, 0.7, 1); -webkit-transition-duration: 0.3s; transition-duration: 0.3s; stroke-dashoffset: 0; } .premium-button-line4 { overflow: hidden; } .premium-button-line4::before { position: absolute; content: ""; width: 100%; height: 1px; top: 100%; left: 0; pointer-events: none; } .premium-button-line4 .premium-btn-svg { position: absolute; left: 0; top: -3px; pointer-events: none; fill: none; width: 300%; max-width: inherit; height: 100%; stroke-width: 2px; -webkit-transition: -webkit-transform 0.7s; transition: -webkit-transform 0.7s; transition: transform 0.7s; transition: transform 0.7s, -webkit-transform 0.7s; -webkit-transition-timing-function: cubic-bezier(0, 0.25, 0.5, 1); transition-timing-function: cubic-bezier(0, 0.25, 0.5, 1); } .premium-button-line4 .premium-btn-svg path { fill: none; } .premium-button-line4:hover .premium-btn-svg { -webkit-transform: translate3d(-66.6%, 0, 0); transform: translate3d(-66.6%, 0, 0); } .premium-button-line2::before { position: absolute; content: ""; width: 100%; height: 1px; background: currentColor; left: 0; top: 50%; pointer-events: none; height: 2px; -webkit-transform-origin: 100% 50%; -ms-transform-origin: 100% 50%; transform-origin: 100% 50%; -webkit-transform: scale3d(0, 1, 1); transform: scale3d(0, 1, 1); -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.4, 1, 0.8, 1); transition: -webkit-transform 0.3s cubic-bezier(0.4, 1, 0.8, 1); transition: transform 0.3s cubic-bezier(0.4, 1, 0.8, 1); transition: transform 0.3s cubic-bezier(0.4, 1, 0.8, 1), -webkit-transform 0.3s cubic-bezier(0.4, 1, 0.8, 1); } .premium-button-line2:hover span { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } .premium-button-line2:hover::before { -webkit-transform-origin: 0 50%; -ms-transform-origin: 0 50%; transform-origin: 0 50%; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } .premium-button-line3 .premium-btn-line-wrap { position: absolute; top: 100%; left: 0; width: 100%; } .premium-button-line3 .premium-btn-svg { stroke: currentColor; stroke-width: 1px; height: auto; } .premium-button-line3 .premium-btn-svg path { -webkit-transition: stroke-dashoffset 0.6s cubic-bezier(0.7, 0, 0.3, 1); transition: stroke-dashoffset 0.6s cubic-bezier(0.7, 0, 0.3, 1); stroke-dasharray: 1; stroke-dashoffset: 1; fill: none; } .premium-button-line3:hover .premium-btn-svg path { -webkit-transition-timing-function: cubic-bezier(0.8, 1, 0.7, 1); transition-timing-function: cubic-bezier(0.8, 1, 0.7, 1); -webkit-transition-duration: 0.3s; transition-duration: 0.3s; stroke-dashoffset: 0; } .premium-button-line5::before, .premium-button-line5::after { position: absolute; content: ""; width: 100%; height: 1px; top: 100%; left: 0; pointer-events: none; } .premium-button-line5::before { -webkit-transform-origin: 100% 50%; -ms-transform-origin: 100% 50%; transform-origin: 100% 50%; -webkit-transform: scale3d(0, 1, 1); transform: scale3d(0, 1, 1); -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.2, 1, 0.8, 1); transition: -webkit-transform 0.3s cubic-bezier(0.2, 1, 0.8, 1); transition: transform 0.3s cubic-bezier(0.2, 1, 0.8, 1); transition: transform 0.3s cubic-bezier(0.2, 1, 0.8, 1), -webkit-transform 0.3s cubic-bezier(0.2, 1, 0.8, 1); } .premium-button-line5::after { top: -webkit-calc(100% + 4px); top: calc(100% + 4px); -webkit-transform-origin: 100% 50%; -ms-transform-origin: 100% 50%; transform-origin: 100% 50%; -webkit-transform: scale3d(0, 1, 1); transform: scale3d(0, 1, 1); -webkit-transition: -webkit-transform 0.4s 0.1s cubic-bezier(0.2, 1, 0.8, 1); transition: -webkit-transform 0.4s 0.1s cubic-bezier(0.2, 1, 0.8, 1); transition: transform 0.4s 0.1s cubic-bezier(0.2, 1, 0.8, 1); transition: transform 0.4s 0.1s cubic-bezier(0.2, 1, 0.8, 1), -webkit-transform 0.4s 0.1s cubic-bezier(0.2, 1, 0.8, 1); } .premium-button-line5:hover::before, .premium-button-line5:hover::after { -webkit-transform-origin: 0 50%; -ms-transform-origin: 0 50%; transform-origin: 0 50%; -webkit-transition-timing-function: cubic-bezier(0.7, 0, 0.2, 1); transition-timing-function: cubic-bezier(0.7, 0, 0.2, 1); } .premium-button-line5:hover::before { -webkit-transform: scale3d(1, 2, 1); transform: scale3d(1, 2, 1); } .premium-button-line5:hover::after { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } .premium-button-line6 { overflow: hidden; } .premium-button-line6::before, .premium-button-line6::after { position: absolute; content: ""; width: 100%; height: 1px; top: 100%; left: 0; pointer-events: none; } .premium-button-line6::before { height: 2px; top: -webkit-calc(100% - 2px); top: calc(100% - 2px); -webkit-transform-origin: 100% 50%; -ms-transform-origin: 100% 50%; transform-origin: 100% 50%; -webkit-transform: scale3d(0, 1, 1); transform: scale3d(0, 1, 1); -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.5, 0.5, 0.3, 1); transition: -webkit-transform 0.3s cubic-bezier(0.5, 0.5, 0.3, 1); transition: transform 0.3s cubic-bezier(0.5, 0.5, 0.3, 1); transition: transform 0.3s cubic-bezier(0.5, 0.5, 0.3, 1), -webkit-transform 0.3s cubic-bezier(0.5, 0.5, 0.3, 1); } .premium-button-line6::after { content: attr(data-text); height: 100%; top: 0; background: none; -webkit-transform-origin: 100% 50%; -ms-transform-origin: 100% 50%; transform-origin: 100% 50%; -webkit-transform: translate3d(150%, 0, 0); transform: translate3d(150%, 0, 0); -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.5, 0.5, 0.3, 1); transition: -webkit-transform 0.3s cubic-bezier(0.5, 0.5, 0.3, 1); transition: transform 0.3s cubic-bezier(0.5, 0.5, 0.3, 1); transition: transform 0.3s cubic-bezier(0.5, 0.5, 0.3, 1), -webkit-transform 0.3s cubic-bezier(0.5, 0.5, 0.3, 1); padding: 16px 28px; text-align: center; } .premium-button-line6:hover::before { -webkit-transform-origin: 0 50%; -ms-transform-origin: 0 50%; transform-origin: 0 50%; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } .premium-button-line6:hover::after { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .premium-button-line6 span { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .premium-button-line6:hover span { -webkit-transform: translate3d(-200%, 0, 0); transform: translate3d(-200%, 0, 0); opacity: 0; } .premium-button-line7::before { position: absolute; content: ""; width: 100%; height: 1px; top: 100%; left: 0; pointer-events: none; opacity: 0; } .premium-button-line7:hover::before { opacity: 1; -webkit-animation: pa-btn-glitch 0.4s steps(2, start) forwards; animation: pa-btn-glitch 0.4s steps(2, start) forwards; } .premium-button-line7:hover span { -webkit-animation: pa-text-glitch 0.4s linear; animation: pa-text-glitch 0.4s linear; }