/*-------------------------------------------------------------- Grid Reset ----------------------------------------------------------------*/ /*-------------------------------------------------------------- Carousel Reset ----------------------------------------------------------------*/ /* Header Default */ @media (min-width: 768px) and (max-width: 1024px) { .elementor .elementor-hidden-tablet { display: none !important; } } @media screen and (max-width: 767px) { .elementor .elementor-hidden-mobile, .elementor .elementor-hidden-phone { display: none !important; } } @keyframes pxl_scale { 0%, 100% { transform: scale(0); } 50% { transform: scale(1); } } @keyframes pxl_scale1 { 0% { transform: scale(1); opacity: 0.67; } 100% { transform: scale(2.2); opacity: 0; } } @-webkit-keyframes pxl_scale1 { 0% { transform: scale(1); opacity: 0.67; } 100% { transform: scale(2.2); opacity: 0; } } @keyframes pxl_spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @keyframes pxl_spin_rev { 0% { transform: rotate(0deg); } 100% { transform: rotate(-360deg); } } @keyframes pxl_spin_child { 0% { -webkit-transform: rotate(-160deg); -moz-transform: rotate(-160deg); -o-transform: rotate(-160deg); transform: rotate(-160deg); } 100% { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } .pxl-image-spin img { animation: pxl_spin 12s linear infinite; } @keyframes pxl_zoom_reverse { 0% { transform: scale(0.6); } 100% { transform: scale(1); } } .pxl-image-zoom { animation: pxl_zoom_reverse 8s linear infinite; } @keyframes zoom-in-zoom-out { 0% { transform: scale(0.6, 0.6); } 50% { transform: scale(1, 1); } 100% { transform: scale(0.6, 0.6); } } .pxl-image-zoom2 { animation: zoom-in-zoom-out 3000ms linear infinite; } @-ms-keyframes pxl_spin_reverse { from { -ms-transform: rotate(0deg); } to { -ms-transform: rotate(-360deg); } } @-moz-keyframes pxl_spin_reverse { from { -moz-transform: rotate(0deg); } to { -moz-transform: rotate(-360deg); } } @-webkit-keyframes pxl_spin_reverse { from { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(-360deg); } } @keyframes pxl_spin_reverse { from { transform: rotate(0deg); } to { transform: rotate(-360deg); } } .pxl-image-spin-reverse img { animation: pxl_spin_reverse 12s linear infinite; } @-webkit-keyframes pxl_right_from_left { 49% { -webkit-transform: translate(100%); } 50% { opacity: 0; -webkit-transform: translate(-100%); } 51% { opacity: 1; } } @-moz-keyframes pxl_right_from_left { 49% { -moz-transform: translate(100%); } 50% { opacity: 0; -moz-transform: translate(-100%); } 51% { opacity: 1; } } @keyframes pxl_right_from_left { 49% { transform: translate(100%); } 50% { opacity: 0; transform: translate(-100%); } 51% { opacity: 1; } } @-webkit-keyframes pxl_left_from_right { 49% { -webkit-transform: translate(-100%); } 50% { opacity: 0; -webkit-transform: translate(100%); } 51% { opacity: 1; } } @-moz-keyframes pxl_left_from_right { 49% { -moz-transform: translate(-100%); } 50% { opacity: 0; -moz-transform: translate(100%); } 51% { opacity: 1; } } @keyframes pxl_left_from_right { 49% { transform: translate(-100%); } 50% { opacity: 0; transform: translate(100%); } 51% { opacity: 1; } } @-webkit-keyframes pxl_ani1 { from { -webkit-mask-position: 100% 0; mask-position: 100% 0; } to { -webkit-mask-position: 0 0; mask-position: 0 0; } } @keyframes pxl_ani1 { from { -webkit-mask-position: 100% 0; mask-position: 100% 0; } to { -webkit-mask-position: 0 0; mask-position: 0 0; } } @-webkit-keyframes pxl_ani2 { from { -webkit-mask-position: 0 0; mask-position: 0 0; } to { -webkit-mask-position: 100% 0; mask-position: 100% 0; } } @keyframes pxl_ani2 { from { -webkit-mask-position: 0 0; mask-position: 0 0; } to { -webkit-mask-position: 100% 0; mask-position: 100% 0; } } @keyframes pxl_bounce { 0%, 100%, 20%, 50%, 80% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-8px); -ms-transform: translateY(-8px); transform: translateY(-8px); } 60% { -webkit-transform: translateY(-4px); -ms-transform: translateY(-4px); transform: translateY(-4px); } } .pxl-image-bounce { animation: pxl_bounce 1s ease-out infinite; -webkit-animation: pxl_bounce 1s ease-out infinite; } @keyframes pxl_zigzag { 0%, 100%, 20%, 50%, 80% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: rotate(10deg); -ms-transform: rotate(10deg); transform: rotate(10deg); } 60% { -webkit-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg); } } @keyframes pxl_right_left { 0% { transform: translateX(0px); } 25% { transform: translateX(40px); } 50% { transform: translateX(0px); } 75% { transform: translateX(-40px); } 100% { transform: translateX(0px); } } .slide-right-to-left { animation: pxl_right_left 12s ease-out infinite; -webkit-animation: pxl_right_left 12s ease-out infinite; } @keyframes pxl_left_right { 0% { transform: translateX(0px); } 25% { transform: translateX(-40px); } 50% { transform: translateX(0px); } 75% { transform: translateX(40px); } 100% { transform: translateX(0px); } } .slide-left-to-right { animation: pxl_left_right 12s ease-out infinite; -webkit-animation: pxl_left_right 12s ease-out infinite; } @keyframes pxl_bottom_top_small { 0% { transform: translateX(0px); } 25% { transform: translateY(10px); } 50% { transform: translateY(0px); } 75% { transform: translateY(-10px); } 100% { transform: translateY(0px); } } @keyframes pxl_float_one { 0% { transform: translateY(0); } 100% { transform: translateY(-3%); } } @keyframes pxl_float_two { 0% { transform: translateY(0); } 100% { transform: translateY(-20px); } } .slide-up-down { animation: pxl_float_two 1.2s ease infinite alternate; } @keyframes pxl_bottom_top { 0% { transform: translateX(0px); } 25% { transform: translateY(40px); } 50% { transform: translateY(0px); } 75% { transform: translateY(-40px); } 100% { transform: translateY(0px); } } .slide-bottom-to-top { animation: pxl_bottom_top 12s ease-out infinite; -webkit-animation: pxl_bottom_top 12s ease-out infinite; } @keyframes pxl_effect1 { 0% { transform: translate(0px, 0px); } 20% { transform: translate(40px, -5px); } 40% { transform: translate(60px, 40px); } 60% { transform: translate(40px, 60px); } 80% { transform: translate(-40px, 60px); } 100% { transform: translate(0px, 0px); } } .slide-effect1 { animation: pxl_effect1 12s ease-out infinite; -webkit-animation: pxl_effect1 12s ease-out infinite; } @keyframes pxl_effect2 { 0% { transform: translate(0px, 0px); } 20% { transform: translate(-30px, 40px); } 40% { transform: translate(60px, 60px); } 60% { transform: translate(70px, 40px); } 80% { transform: translate(40px, -70px); } 100% { transform: translate(0px, 0px); } } .slide-effect2 { animation: pxl_effect2 12s ease-out infinite; -webkit-animation: pxl_effect2 12s ease-out infinite; } @keyframes pxl_effect3 { 0% { transform: translate(0px, 0px); } 30% { transform: translate(40px, 60px); } 45% { transform: translate(80px, 90px); } 65% { transform: translate(40px, 110px); } 75% { transform: translate(20px, 800px); } 100% { transform: translate(0px, 0px); } } .slide-effect3 { animation: pxl_effect3 12s ease-out infinite; } @keyframes pxl_top_bottom { 0% { transform: translateX(0px); } 25% { transform: translateY(-40px); } 50% { transform: translateY(0px); } 75% { transform: translateY(40px); } 100% { transform: translateY(0px); } } .slide-top-to-bottom { animation: pxl_top_bottom 12s ease-out infinite; -webkit-animation: pxl_top_bottom 12s ease-out infinite; } @-webkit-keyframes img_circle { 0% { opacity: 1; } 40% { opacity: 1; } 100% { width: 200%; height: 200%; opacity: 0; } } @keyframes img_circle { 0% { opacity: 1; } 40% { opacity: 1; } 100% { width: 200%; height: 200%; opacity: 0; } } @-webkit-keyframes pxl_loader_bounce { 0%, 100% { -webkit-transform: scale(0); } 50% { -webkit-transform: scale(1); } } @keyframes pxl_loader_bounce { 0%, 100% { transform: scale(0); -webkit-transform: scale(0); } 50% { transform: scale(1); -webkit-transform: scale(1); } } @keyframes pxl_keyword_slideIn { from { transform: translateY(65%) rotateX(-95deg); opacity: 0; } to { transform: translateY(0) rotateX(0); opacity: 1; } } @keyframes pxl_keyword_slideOut { from { transform: translateY(0) rotateX(0); opacity: 1; } to { transform: translateY(-65%) rotateX(95deg); opacity: 0; } } @-webkit-keyframes pxl_animation_round { from { transform: rotate(0deg) translateX(10px) rotate(0deg); } to { transform: rotate(360deg) translateX(10px) rotate(-360deg); } } @-moz-keyframes pxl_animation_round { from { transform: rotate(0deg) translateX(10px) rotate(0deg); } to { transform: rotate(360deg) translateX(10px) rotate(-360deg); } } @-o-keyframes pxl_animation_round { from { transform: rotate(0deg) translateX(10px) rotate(0deg); } to { transform: rotate(360deg) translateX(10px) rotate(-360deg); } } @keyframes pxl_animation_round { from { transform: rotate(0deg) translateX(10px) rotate(0deg); } to { transform: rotate(360deg) translateX(10px) rotate(-360deg); } } .pxl-animation-round { animation: pxl_animation_round 4s infinite linear; -webkit-animation: pxl_animation_round 4s infinite linear; } @keyframes pxl_kenburns { 0% { opacity: 1; transform: scale(1.2); } 1.5625% { opacity: 1; } 23.4375% { opacity: 1; } 26.5625% { opacity: 1; transform: scale(1); } 100% { opacity: 1; transform: scale(1); } 98.4375% { opacity: 1; transform: scale(1); } 100% { opacity: 1; } } @-webkit-keyframes toRightFromLeft { 49% { -webkit-transform: translate(100%); } 50% { opacity: 0; -webkit-transform: translate(-100%); } 51% { opacity: 1; } } @-moz-keyframes toRightFromLeft { 49% { -moz-transform: translate(100%); } 50% { opacity: 0; -moz-transform: translate(-100%); } 51% { opacity: 1; } } @keyframes toRightFromLeft { 49% { transform: translate(100%); } 50% { opacity: 0; transform: translate(-100%); } 51% { opacity: 1; } } @keyframes toLeftFromRight { 49% { transform: translate(-100%); } 50% { opacity: 0; transform: translate(100%); } 51% { opacity: 1; } } @keyframes twinkle { 0%, 100% { opacity: 1; } 50% { opacity: 0.2; } } @-webkit-keyframes twinkle { 0%, 100% { opacity: 1; } 50% { opacity: 0.2; } } @keyframes gradientShift { 0% { background-position: left; } 100% { background-position: right; } } @-webkit-keyframes gradientShift { 0% { background-position: left; } 100% { background-position: right; } } @keyframes shake { 0%, 100% { transform: rotate(0deg); } 25% { transform: rotate(1deg); } 50% { transform: rotate(0deg); } 75% { transform: rotate(-1deg); } } @-webkit-keyframes shake { 0%, 100% { transform: rotate(0deg); } 25% { transform: rotate(1deg); } 50% { transform: rotate(0deg); } 75% { transform: rotate(-1deg); } } @keyframes marquee-rtl { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } } @keyframes marquee-ltr { 0% { transform: translateX(-50%); } 100% { transform: translateX(0); } } @keyframes marquee-ttb { 0% { transform: translateY(0%); } 100% { transform: translateY(45%); } } @keyframes marquee-btt { 0% { transform: translateY(0); } 100% { transform: translateY(-45%); } } @keyframes displayText { 0% { display: inline-block; } 25%, 100% { display: none; } } @keyframes animate { 0%, 10% { width: 0; } 70% { width: 100%; } 100% { width: 0; } } @keyframes keyword_rotating_in { 0% { transform: translateY(65%) rotateX(-95deg); opacity: 0; } to { transform: translateY(0) rotateX(0); opacity: 1; } } @keyframes keyword_rotating_out { 0% { transform: translateY(0) rotateX(0); opacity: 1; } to { transform: translateY(-65%) rotateX(95deg); opacity: 0; } } @keyframes blink { 0%, 100% { opacity: 1; } 50% { opacity: 0; } } @-webkit-keyframes pxl_btn_shine { 100% { left: 200%; } } @keyframes pxl_btn_shine { 100% { left: 200%; } } @keyframes shake-button-lightning { 0% { transform: translateX(0); } 20% { transform: translateX(-4px); } 40% { transform: translateX(4px); } 60% { transform: translateX(-3px); } 80% { transform: translateX(3px); } 100% { transform: translateX(0); } } @keyframes shake-button { 0% { transform: translateX(0); } 20% { transform: translateX(-8px); } 40% { transform: translateX(8px); } 60% { transform: translateX(-6px); } 80% { transform: translateX(6px); } 100% { transform: translateX(0); } } @keyframes icon_to_right { 0% { transform: translateX(0); } 50% { transform: translateX(10px); } 51% { transform: translateX(-10px); } 100% { transform: translateX(0); } } @keyframes icon_to_left { 0% { transform: translateX(0); } 50% { transform: translateX(-10px); } 51% { transform: translateX(10px); } 100% { transform: translateX(0); } } @keyframes icon_to_bottom { 0% { transform: translateY(0); } 50% { transform: translateY(10px); } 51% { transform: translateY(-10px); } 100% { transform: translateY(0); } } @keyframes icon_to_top { 0% { transform: translateY(0); } 50% { transform: translateY(-10px); } 51% { transform: translateY(10px); } 100% { transform: translateY(0); } } @keyframes icon_to_top_right { 0% { transform: translate(0, 0); } 50% { transform: translate(10px, -10px); } 51% { transform: translate(-10px, 10px); } 100% { transform: translate(0, 0); } } @keyframes icon_to_bottom_right { 0% { transform: translate(0, 0); } 50% { transform: translate(-10px, 10px); } 51% { transform: translate(10px, -10px); } 100% { transform: translate(0, 0); } } @keyframes icon_to_bottom_left { 0% { transform: translate(0, 0); } 50% { transform: translate(-10px, 10px); } 51% { transform: translate(10px, -10px); } 100% { transform: translate(0, 0); } } @keyframes icon_to_top_left { 0% { transform: translate(0, 0); } 50% { transform: translate(10px, -10px); } 51% { transform: translate(-10px, 10px); } 100% { transform: translate(0, 0); } } @keyframes icon_on_press { 0% { transform: scale(1); } 30% { transform: scale(0.85); } 50% { transform: scale(1.15); } 70% { transform: scale(0.95); } 85% { transform: scale(1.05); } 100% { transform: scale(1); } } @keyframes pxl_run_line_11 { 0% { bottom: 0; opacity: 0; } 20% { opacity: 1; } 100% { bottom: 100%; } } @keyframes pxl_run_line_12 { 0% { bottom: 50%; opacity: 0; } 20% { opacity: 1; } 100% { bottom: 150%; } } @keyframes pxl_run_line_21 { 0% { bottom: 20%; opacity: 0; } 100% { bottom: 100%; } } @keyframes pxl_run_line_22 { 0% { bottom: 70%; opacity: 0; } 20% { opacity: 1; } 100% { bottom: 170%; } } @keyframes pxl_run_line_31 { 0% { bottom: 25%; opacity: 0; } 20% { opacity: 1; } 100% { bottom: 125%; } } @keyframes pxl_run_line_32 { 0% { bottom: 70%; opacity: 0; } 20% { opacity: 1; } 100% { bottom: 170%; } } @keyframes scale_icon { 0% { transform: scale(1); } 50% { transform: scale(1.2); } 100% { transform: scale(1); } } .pxl-counter .pxl-counter__number { display: inline-flex; flex-wrap: wrap; align-items: center; } .pxl-accordion .pxl-accordion__item-title { margin-bottom: 0; cursor: pointer; } .pxl-accordion__item .pxl-accordion__item-content { display: none; margin: 0; } .pxl-progressbar { display: flex; } .pxl-progressbar .pxl-progressbar__item { display: flex; } .pxl-progressbar .pxl-progressbar__item-wrap { width: 100%; display: block; } .pxl-progressbar .pxl-progressbar__item-fill { display: block; width: 0; height: 100%; transition: all 1s ease; } .pxl-progressbar .pxl-progressbar__item-fill.vertical { height: 0; } .pxl-video__overlay { z-index: 88; position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .pxl-video__holder { overflow: hidden; } .pxl-video__holder+.pxl-video__btn { position: absolute; z-index: 99; text-align: center; } .pxl-video__holder+.pxl-video__btn-center { top: 50%; left: 50%; } .pxl-video__holder .pxl-video__demo-before, .pxl-video__holder .pxl-video__demo-after { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .pxl-video__holder .pxl-video__demo-before iframe, .pxl-video__holder .pxl-video__demo-after iframe, .pxl-video__holder .pxl-video__demo-before video, .pxl-video__holder .pxl-video__demo-after video { width: 100%; height: 100%; object-fit: cover; } .pxl-video__imagebg { position: relative; overflow: hidden; } .pxl-video__imagebg .bg-image { position: absolute; top: 0; left: 0; right: 0; bottom: -60px; } .pxl-video .pxl-video__info { position: absolute; bottom: 12px; right: 12px; background-color: #fff; border-radius: 12px; z-index: 100; padding: 16px 24px 16px 16px; border-radius: 6px; display: flex; align-items: start; gap: 14px; max-width: 312px; width: 100%; } @media screen and (max-width: 575px) { .pxl-video .pxl-video__info { position: relative; bottom: unset; right: unset; max-width: 100%; z-index: 1000; } } .pxl-video .pxl-video__info-image { width: 52px; min-width: 52px; height: 52px; border-radius: 50%; overflow: hidden; } .pxl-video .pxl-video__info-image img { width: 100%; height: 100%; object-fit: cover; } .pxl-video .pxl-video__info-content { display: flex; flex-direction: column; gap: 8px; } .pxl-video .pxl-video__info-description { color: #0a0d12; font-family: 'Arapey', serif; font-size: 18px; line-height: 1.2; letter-spacing: -0.54px; } .pxl-video .pxl-video__info-author { font-size: 10px; font-weight: 400; line-height: 1.2; letter-spacing: -0.2px; } .pxl-video__btn-style-2 { background-color: #828282; border-radius: 99px; width: 80px; height: 80px; overflow: hidden; } .pxl-video__btn-style-2 svg { position: absolute; top: 50%; left: 54%; transform: translate(-50%, -50%); z-index: 3; } .pxl-video__btn-style-2:before { content: ''; position: absolute; top: 0; left: -200%; width: 200%; height: 100%; -webkit-transform: skewx(-20deg); -khtml-transform: skewx(-20deg); -moz-transform: skewx(-20deg); -ms-transform: skewx(-20deg); -o-transform: skewx(-20deg); transform: skewx(-20deg); background-image: linear-gradient(to right, transparent, rgba(255, 255, 255, .35), transparent); z-index: 1; transition: all 3.2s ease-in-out; } .pxl-video__btn-style-2:after { content: ''; position: absolute; top: -1px; left: -1px; border-radius: 99px; background-blend-mode: screen, screen, color-burn; box-shadow: 23px 32px 13px -34px #fff inset, -23px -30px 21px -34px #fff inset, 4px 4px 2px -4px rgba(255, 255, 255, 0.2) inset, 0px 0px 44px 0px rgba(255, 255, 255, 0.2) inset; backdrop-filter: blur(20px); z-index: 2; height: calc(100% + 2px); width: calc(100% + 2px); } .pxl-video__btn-style-2:hover:before { left: 200%; } .pxl-video__btn-center { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .pxl-video--style-1 .pxl-video__btn { width: 68px; height: 68px; border: 2px solid #fff; background: rgba(245, 245, 245, 0.76); backdrop-filter: blur(3px); border-radius: 50%; display: flex; justify-content: center; align-items: center; line-height: 1; transition: all 0.3s ease; } .pxl-video--style-1 .pxl-video__btn:hover { border-color: var(--secondary-color); background-color: rgba(var(--secondary-color-rgb), 0.76); } .pxl-video--overlay-gradient .pxl-video__inner { --overlay-color-1: #a692ff; --overlay-color-2: #deb1ff; --overlay-color-3: #f7f7fb; position: relative; } .pxl-video--overlay-gradient .pxl-video__inner:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(88deg, var(--overlay-color-1) 36.69%, var(--overlay-color-2) 74.4%, var(--overlay-color-3) 104.94%); border-radius: 12px; z-index: 0; } .pxl-video--overlay-gradient .pxl-video__inner .pxl-video__holder { position: relative; z-index: 1; } .pxl-video--overlay-gradient .pxl-video__inner .pxl-video__btn { z-index: 2; } .pxl-grid .pxl-grid__masonry { position: relative; } .pxl-grid .pxl-grid__sizer { z-index: -1; } .pxl-grid .pxl-load-more { text-align: center; padding: 0 15px; } @media screen and (min-width: 1201px) { .pxl-grid .col-xl-pxl5 { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; } .pxl-grid .col-lg-66-pxl { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } } @media screen and (min-width: 1201px) { .pxl-grid .col-xl-66-pxl { -ms-flex: 0 0 66.66667%; flex: 0 0 66.66667%; max-width: 66.66667%; } } .pxl-grid.filtering, .pxl-grid.loading { opacity: 0.5; pointer-events: none; } .pxl-grid .pxl-post--featured, .pxl-post-carousel .pxl-post--featured, .pxl-post-modern .pxl-post--featured, .pxl-swiper-slider .pxl-post--featured { position: relative; } .pxl-grid .pxl-post--link, .pxl-post-carousel .pxl-post--link, .pxl-post-modern .pxl-post--link, .pxl-swiper-slider .pxl-post--link { z-index: 99; } .pxl-grid .pxl-post--image img, .pxl-post-carousel .pxl-post--image img, .pxl-post-modern .pxl-post--image img, .pxl-swiper-slider .pxl-post--image img, .pxl-grid .pxl-post--featured img, .pxl-post-carousel .pxl-post--featured img, .pxl-post-modern .pxl-post--featured img, .pxl-swiper-slider .pxl-post--featured img { width: 100%; } .pxl-grid .pxl-post--title a, .pxl-post-carousel .pxl-post--title a, .pxl-post-modern .pxl-post--title a, .pxl-swiper-slider .pxl-post--title a { color: inherit; } .pxl-grid .pxl-post--title a:hover, .pxl-post-carousel .pxl-post--title a:hover, .pxl-post-modern .pxl-post--title a:hover, .pxl-swiper-slider .pxl-post--title a:hover { color: inherit; } .pxl-grid .pxl-post--category, .pxl-post-carousel .pxl-post--category, .pxl-post-modern .pxl-post--category, .pxl-swiper-slider .pxl-post--category { position: relative; } .pxl-grid .pxl-post--category.link-none:before, .pxl-post-carousel .pxl-post--category.link-none:before, .pxl-post-modern .pxl-post--category.link-none:before, .pxl-swiper-slider .pxl-post--category.link-none:before, .pxl-grid .pxl-post--category.deactive-click:before, .pxl-post-carousel .pxl-post--category.deactive-click:before, .pxl-post-modern .pxl-post--category.deactive-click:before, .pxl-swiper-slider .pxl-post--category.deactive-click:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 99; } .pxl-grid .pxl-post--category a, .pxl-post-carousel .pxl-post--category a, .pxl-post-modern .pxl-post--category a, .pxl-swiper-slider .pxl-post--category a { color: inherit; } .pxl-grid.pxl-grid-nogap .pxl-grid__masonry, .pxl-post-carousel.pxl-grid-nogap .pxl-grid__masonry, .pxl-post-modern.pxl-grid-nogap .pxl-grid__masonry, .pxl-swiper-slider.pxl-grid-nogap .pxl-grid__masonry { margin: 0 !important; } .pxl-grid.pxl-grid-nogap .pxl-grid__masonry .pxl-grid__item, .pxl-post-carousel.pxl-grid-nogap .pxl-grid__masonry .pxl-grid__item, .pxl-post-modern.pxl-grid-nogap .pxl-grid__masonry .pxl-grid__item, .pxl-swiper-slider.pxl-grid-nogap .pxl-grid__masonry .pxl-grid__item { padding: 0 !important; } .pxl-grid.pxl-grid-nogap .pxl-grid__masonry .pxl-post--inner, .pxl-post-carousel.pxl-grid-nogap .pxl-grid__masonry .pxl-post--inner, .pxl-post-modern.pxl-grid-nogap .pxl-grid__masonry .pxl-post--inner, .pxl-swiper-slider.pxl-grid-nogap .pxl-grid__masonry .pxl-post--inner { margin-bottom: 0; } .elementor-editor-active .pxl-grid__sizer { display: none; } .pxl-grid__filter { max-width: 1024px; margin-left: auto; margin-right: auto; } .pxl-grid__filter .filter-item { cursor: pointer; transition: all 300ms linear 0ms; position: relative; } .pxl-grid__filter .pxl-grid__filter-inner { display: flex; flex-flow: row wrap; justify-content: center; margin: 0 auto; } .pxl-grid__filter .pxl-category__item-icon { width: 14px; height: 14px; margin-right: 4px; display: inline-block; } .pxl-grid__filter .pxl-category__item-icon img { width: 100%; height: 100%; object-fit: cover; } .pxl-grid__filter.style-1 { justify-content: center; display: flex; flex-wrap: wrap; margin-bottom: 60px; } .pxl-grid__filter.style-1 .filter-label { font-size: 16px; color: #969696; font-weight: 500; margin: 10px 17px 10px 17px; } .pxl-grid__filter.style-1 .filter-item { font-size: 16px; color: #969696; font-weight: 500; margin: 10px 17px 10px 17px; } @media screen and (max-width: 767px) { .pxl-grid__filter.style-1 .filter-item { font-size: 14px; } } @media screen and (max-width: 575px) { .pxl-grid__filter.style-1 .filter-item { font-size: 12px; } } .pxl-grid__filter.style-1 .filter-item:before { content: ''; width: 0; left: 0; right: 0; margin: auto; bottom: 1px; background-color: #535667; height: 1px; transition: all 300ms linear 0ms; position: absolute; } .pxl-grid__filter.style-1 .filter-item.active { color: #01062e; } .pxl-grid__filter.style-1 .filter-item.active:before { width: 100%; } .pxl-grid__filter.style-1 .pxl-grid__filter-inner { border: 1px solid #e7e7e7; border-radius: 72px; width: 100%; max-width: 820px; justify-content: center; padding: 13px 10px; } .pxl-grid__filter.style-2 { display: flex; justify-content: center; flex-wrap: wrap; padding-bottom: 65px; margin-bottom: 24px; position: relative; } .pxl-grid__filter.style-2::after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background: linear-gradient(90deg, rgba(102, 102, 102, 0.00) 0%, rgba(102, 102, 102, 0.13) 25%, rgba(102, 102, 102, 0.16) 50%, rgba(102, 102, 102, 0.13) 75%, rgba(102, 102, 102, 0.00) 100%); } .pxl-grid__filter.style-2 .pxl-grid__filter-inner { gap: 8px; } .pxl-grid__filter.style-2 .filter-item { color: var(--primary-color); background-color: transparent; padding: 7px 16px; border-radius: 50px; transition: all 0.3s ease; border: 1px solid #d5d7da; } @media screen and (max-width: 575px) { .pxl-grid__filter.style-2 .filter-item { font-size: 12px !important; } } .pxl-grid__filter.style-2 .filter-item.active { color: #fff; border-color: var(--primary-color); background-color: var(--primary-color); } .pxl-grid__filter.style-3 { text-align: center; margin-bottom: 32px; } .pxl-grid__filter.style-3 .pxl-grid__filter-inner { justify-content: center; flex-flow: row wrap; } .pxl-grid__filter.style-3 .filter-item { color: var(--third-color); background-color: transparent; padding: 9px 16px; border-radius: 8px; transition: all 0.3s ease; } .pxl-grid__filter.style-3 .filter-item.active { color: #fff; background-color: var(--secondary-color); } .pxl-grid__inner+.pxl-grid__loadmore--style-1 { margin: 24px 0 0; padding-top: 65px; position: relative; display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: center; } .pxl-grid__inner+.pxl-grid__loadmore--style-1::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 1px; display: block; background: linear-gradient(90deg, rgba(102, 102, 102, 0.00) 0%, rgba(102, 102, 102, 0.13) 25%, rgba(102, 102, 102, 0.16) 50%, rgba(102, 102, 102, 0.13) 75%, rgba(102, 102, 102, 0.00) 100%); } .pxl-grid__inner+.pxl-grid__loadmore--style-1 .btn-loadmore { background-color: var(--primary-color); color: #fff; border-color: var(--primary-color); border-radius: 8px; } .pxl-grid__inner+.pxl-grid__loadmore--style-1 .btn-loadmore svg path { transition: all 0.3s ease; stroke: #fff; } .pxl-grid__inner+.pxl-grid__loadmore--style-2 { margin-top: 28px; } .pxl-grid__inner+.pxl-grid__loadmore--style-2 .btn-loadmore { margin: 0 auto; padding: 13px 20px; border: 4px solid #e9eaeb; border-radius: 8px; background-color: #fff; color: #fff; background-color: var(--secondary-color); display: flex; gap: 6px; align-items: center; } .pxl-grid__inner+.pxl-grid__loadmore--style-2 .btn-loadmore svg path { transition: all 0.3s ease; stroke: #fff; } .pxl-grid__inner+.pxl-grid__loadmore .pxl-button__more { font-weight: 500; color: var(--primary-color); padding: 9px 16px; display: flex; align-items: center; gap: 6px; transition: all 0.3s ease; } .pxl-grid__inner+.pxl-grid__loadmore .pxl-button__more svg { transition: all 0.3s ease; } .pxl-grid__inner+.pxl-grid__loadmore .pxl-button__more svg path { transition: all 0.3s ease; transform: translateX(0); } .pxl-grid__inner+.pxl-grid__loadmore .pxl-button__more:hover { color: var(--secondary-color); } .pxl-grid__inner+.pxl-grid__loadmore .pxl-button__more:hover svg { transform: translateX(50%); } .pxl-grid__inner+.pxl-grid__loadmore .pxl-button__more:hover svg path { stroke: var(--secondary-color); } .pxl-grid__career-1 { position: relative; } .pxl-grid__career-1 .pxl-grid__item+.pxl-grid__item { margin-top: 24px; padding-top: 25px; position: relative; } .pxl-grid__career-1 .pxl-grid__item+.pxl-grid__item::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 1px; display: block; background: linear-gradient(90deg, rgba(102, 102, 102, 0.00) 0%, rgba(102, 102, 102, 0.13) 25%, rgba(102, 102, 102, 0.16) 50%, rgba(102, 102, 102, 0.13) 75%, rgba(102, 102, 102, 0.00) 100%); } .pxl-grid__career-1 .pxl-cinfo__list { gap: 8px; display: flex; flex-wrap: wrap; } .pxl-grid__career-1 .pxl-cinfo__list .pxl-cinfo__item { gap: 8px; border-radius: 8px; padding: 7px 16px; display: flex; align-items: center; font-size: 14px; font-weight: 500; } @media screen and (max-width: 767px) { .pxl-grid__career-1 .pxl-cinfo__list .pxl-cinfo__item { font-size: 12px; padding: 5px 12px; } } .pxl-grid__career-1 .pxl-cinfo__list .pxl-cinfo__item img { width: 14px; transform: translateY(-1px); } .pxl-grid__career-1 .pxl-cinfo__list .pxl-cinfo__item-loc { color: #3e1c96; background-color: #ebe9fe; } .pxl-grid__career-1 .pxl-cinfo__list .pxl-cinfo__item-type { color: #0b4a6f; background-color: #e0f2fe; } .pxl-grid__career-1 .pxl-cinfo__list .pxl-cinfo__item-slot { color: var(--primary-color); background-color: #eaecf5; } .pxl-grid__career-1 .pxl-grid__item-inner { display: flex; align-items: center; justify-content: space-between; padding: 16px 40px 16px 16px; transition: all 0.3s ease; position: relative; } @media screen and (max-width: 767px) { .pxl-grid__career-1 .pxl-grid__item-inner { flex-direction: column; align-items: flex-start; padding: 0; } } .pxl-grid__career-1 .pxl-grid__item-inner::before { content: ""; border-radius: 16px; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: transparent; z-index: 0; } .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-left { display: flex; align-items: center; gap: 40px; z-index: 1; position: relative; } @media screen and (max-width: 767px) { .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-left { flex-direction: column; gap: 16px; } } .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-left .pxl-grid__item-featured { display: block; width: 100%; max-width: 200px; overflow: hidden; border-radius: 12px; } .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-left .pxl-grid__item-featured img { transform: scale(1); transition: all 0.3s ease; } .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-left .pxl-grid__item-content { display: flex; flex-direction: column; gap: 24px; } @media screen and (max-width: 767px) { .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-left .pxl-grid__item-content { gap: 16px; } } @media screen and (max-width: 575px) { .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-left .pxl-grid__item-content { gap: 12px; } } .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-left .pxl-grid__item-content .pxl-grid__item-title { font-size: 32px; line-height: 1.2; letter-spacing: -1.28px; margin: 0; display: flex; align-items: center; gap: 6px; } .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-left .pxl-grid__item-content .pxl-grid__item-title img { width: 32px; height: 32px; margin-top: -5px; } @media screen and (max-width: 767px) { .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-left .pxl-grid__item-content .pxl-grid__item-title { font-size: 24px; letter-spacing: -0.96px; } .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-left .pxl-grid__item-content .pxl-grid__item-title img { width: 24px; height: 24px; margin-top: -3px; } } @media screen and (max-width: 575px) { .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-left .pxl-grid__item-content .pxl-grid__item-title { font-size: 20px; letter-spacing: -0.8px; } .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-left .pxl-grid__item-content .pxl-grid__item-title img { width: 20px; height: 20px; margin-top: -2px; } } .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-left .pxl-grid__item-content .pxl-grid__item-excerpt { max-width: 488px; } @media screen and (max-width: 767px) { .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-left .pxl-grid__item-content .pxl-grid__item-excerpt { max-width: 100%; } } .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-right { position: relative; display: flex; flex-direction: column; align-items: end; gap: 24px; } @media screen and (max-width: 767px) { .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-right { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 12px; } } .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-right .pxl-grid__item-price { font-size: 24px; font-weight: 500; line-height: 1.25; letter-spacing: -0.96px; color: var(--primary-color); } .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-right .pxl-grid__item-price img { width: 24px; height: 24px; transform: translateY(-2px); } .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-right .pxl-grid__item-button { display: flex; padding: 9px 16px; justify-content: center; align-items: center; gap: 6px; border-radius: 8px; border: 1px solid #d5d7da; color: var(--primary-color); width: fit-content; } .pxl-grid__career-1 .pxl-grid__item-inner .pxl-grid__item-right .pxl-grid__item-button svg path { transition: all 0.3s ease; fill: var(--primary-color); } .pxl-grid__career-1 .pxl-grid__item-inner:hover:before { background-color: #f8f9fc; } .pxl-grid__career-1 .pxl-grid__item-inner:hover .pxl-grid__item-button { background-color: var(--primary-color); color: #fff; border-color: var(--primary-color); } .pxl-grid__career-1 .pxl-grid__item-inner:hover .pxl-grid__item-button svg path { transition: all 0.3s ease; fill: #fff; } .pxl-template-grid .pxl-grid__inner { margin-right: -8px; margin-left: -8px; } .pxl-template-grid .pxl-grid__item { padding: 8px; } .pxl-template-grid .pxl-grid__item-inner { display: flex; flex-direction: column; align-items: flex-start; padding: 20px; border-radius: 16px; border: 1px solid #d5d7da; gap: 24px; transition: all 0.3s ease; } .pxl-template-grid .pxl-grid__item-inner .pxl-grid__item-tags { display: flex; gap: 8px; } .pxl-template-grid .pxl-grid__item-inner .pxl-grid__item-tags a { padding: 5px 8px; border-radius: 8px; } .pxl-template-grid .pxl-grid__item-inner .pxl-grid__item-tags a:first-child { background-color: #d1fadf; color: #054f31; } .pxl-template-grid .pxl-grid__item-inner .pxl-grid__item-tags a:nth-child(2) { background-color: #fce7f6; color: #851651; } .pxl-template-grid .pxl-grid__item-inner .pxl-grid__item-tags a:hover { background-color: var(--primary-color); color: #fff; } .pxl-template-grid .pxl-grid__item-inner .pxl-grid__item-excerpt { margin-top: -8px; min-height: 43px; } .pxl-template-grid .pxl-grid__item-inner .pxl-grid__item-button { font-weight: 500; color: var(--primary-color); display: flex; align-items: center; gap: 6px; } .pxl-template-grid .pxl-grid__item-inner .pxl-grid__item-button svg { transition: all 0.3s ease; transform: translateY(-1px); } .pxl-template-grid .pxl-grid__item-inner .pxl-grid__item-button:hover svg { transform: translateY(-1px) translateX(50%); } .pxl-template-grid .pxl-grid__item-inner:hover { border-color: transparent; border-radius: 16px; background: #fff; box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); } .pxl-blog-grid--layout-1 .pxl-grid__item+.pxl-grid__item { margin-top: 24px; } .pxl-blog-grid--layout-1 .pxl-grid__item-inner { padding-left: 96px; position: relative; display: flex; gap: 8px; flex-direction: column; justify-content: center; min-height: 80px; } .pxl-blog-grid--layout-1 .pxl-grid__item-inner .pxl-grid__item-featured { border-radius: 8px; overflow: hidden; position: absolute; left: 0; top: 0; } .pxl-blog-grid--layout-1 .pxl-grid__item-inner .pxl-grid__item-featured img { transform: scale(1); transition: all 0.3s ease; } .pxl-blog-grid--layout-1 .pxl-grid__item-inner .pxl-grid__item-date { color: var(--third-color); display: flex; align-items: center; gap: 4px; } .pxl-blog-grid--layout-1 .pxl-grid__item-inner .pxl-grid__item-date img { margin-top: -3px; } .pxl-blog-grid--layout-1 .pxl-grid__item-inner .pxl-grid__item-title { margin: 0; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; } .pxl-blog-grid--layout-1 .pxl-grid__item-inner:hover .pxl-grid__item-featured img { transform: scale(1.1); } .pxl-swiper-slider__inner { overflow: hidden; } .pxl-swiper-container { margin: 0 -15px; position: relative; overflow: hidden; } .pxl-swiper-container.swiper-fade .pxl-swiper-slider__item { opacity: 0 !important; } .pxl-swiper-container.swiper-fade .pxl-swiper-slider__item.swiper-slide-active { opacity: 1 !important; } .pxl-swiper-slider__wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; -o-transition-property: transform; transition-property: transform, -webkit-transform; -webkit-box-sizing: content-box; box-sizing: content-box; transition-timing-function: linear; } .pxl-swiper-slider__item { -ms-flex-negative: 0; flex-shrink: 0; width: auto; height: 100%; position: relative; padding: 0 15px; } .pxl-navigation-carousel { display: inline-flex; margin: 0 -10px; } .pxl-swiper-pagination { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; margin-top: 30px; } .pxl-swiper-pagination .pxl-swiper-current-slide, .pxl-swiper-pagination .pxl-swiper-total-slides { margin: 0 14px; } .pxl-swiper-pagination .pxl-swiper-current-slide:before, .pxl-swiper-pagination .pxl-swiper-total-slides:before { content: '0'; } .pxl-swiper-pagination .pxl-swiper-current-slide { color: #0a1316; } .pxl-swiper-boxshadow .pxl-swiper-slider__inner { margin: 0 -30px; } .pxl-swiper-boxshadow .pxl-swiper-slider__inner .pxl-swiper-container { padding: 0 30px; } .pxl-swiper-boxshadow .pxl-swiper-slider__item { transition: opacity 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); } .pxl-swiper-boxshadow .pxl-swiper-slider__item:not(.swiper-slide-visible) { opacity: 0; } .pxl-swiper-slider { position: relative; } .pxl-swiper-slider.pxl-swiper__nav-show .pxl-swiper__nav { opacity: 1; visibility: visible; } .pxl-swiper-nogap .pxl-swiper-container { margin: 0; } .pxl-swiper-nogap .pxl-swiper-container .pxl-swiper-slider__item { padding: 0; } .pxl-swiper-thumbs { overflow: hidden; padding: 0 15px; } .pxl-swiper-thumbs .swiper-slide { cursor: pointer; padding: 0 15px; } .swiper-container-vertical { height: 300px; } .swiper-container-vertical .pxl-swiper-slider__wrapper, .swiper-container-vertical .swiper-wrapper { flex-direction: column; } .swiper-container-vertical .pxl-swiper-slider__item, .swiper-container-vertical .swiper-slide { transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; } [data-slider-mode="fade"] .swiper-slide-active { z-index: 9; } .swiper-creative .pxl-swiper-slider__item { -webkit-backface-visibility: hidden; backface-visibility: hidden; overflow: hidden; transition-property: transform, opacity, height; transition-property: transform; } .swiper-3d .pxl-swiper-slider__wrapper { transform-style: preserve-3d; transform: translate3d(0px, 0, 0); transition-property: transform; transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial); } .swiper-3d .swiper-cube-shadow, .swiper-3d .pxl-swiper-slider__item { transform-style: preserve-3d; } .pxl-nav__hide .pxl-swiper__nav { opacity: 0; visibility: hidden; position: absolute; } .swiper-vertical { touch-action: pan-x; } .swiper-vertical>.pxl-swiper-slider__wrapper { flex-direction: column; } .swiper-vertical.swiper-backface-hidden .pxl-swiper-slider__item { transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; height: auto !important; } .swiper-filter-active .non-swiper-slide { display: none; } .swiper-filter-wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; } .swiper-filter-wrap .filter-item { display: inline-block; font-size: 14px; text-transform: uppercase; font-weight: 500; margin: 10px 24px; cursor: pointer; position: relative; z-index: 1; } .swiper-filter-wrap .filter-item:before { content: ''; width: 11px; height: 41px; border-radius: 12px; background-color: #f4f4f4; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) scaleY(0); opacity: 0; transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); z-index: -1; } .swiper-filter-wrap .filter-item span { color: #010927; transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); } .swiper-filter-wrap .filter-item.active { color: var(--primary-color); } .swiper-filter-wrap .filter-item.active:before { opacity: 1; transform: translate(-50%, -50%) scaleY(1); } .pxl-swiper-slider .pxl-post--image img, .pxl-swiper-slider .pxl-post--featured img { width: 100%; } .pxl-swiper-slider .pxl-post--title a, .pxl-swiper-slider .pxl-post--category a { color: inherit; } .pxl-swiper-slider .pxl-post--title a:hover, .pxl-swiper-slider .pxl-post--category a:hover { color: inherit; } .pxl-swiper-fraction-first, .pxl-swiper-fraction-last { color: #040505; margin: 0 16px; display: inline-flex; } .pxl-swiper__nav { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; margin-top: 30px; width: fit-content; margin: 0 auto; } .pxl-swiper__nav .pxl-swiper__nav-item { transition: all 300ms linear 0ms; cursor: pointer; /* Swiper Arrow Style */ } .pxl-swiper__nav-style-1 { padding: 4px; background-color: #2f3e4e; border-radius: 50px; } .pxl-swiper__nav-style-1 .pxl-swiper__nav-item { padding: 7px 16px; border-radius: 30px; background-color: transparent; display: flex; justify-content: center; align-items: center; } .pxl-swiper__nav-style-1 .pxl-swiper__nav-item svg { height: 18px; width: 18px; } .pxl-swiper__nav-style-1 .pxl-swiper__nav-item:hover { background-color: #fff; } .pxl-swiper__nav-style-2 { display: flex; gap: 16px; } .pxl-swiper__nav-style-2 .pxl-swiper__nav-item svg path { stroke: #d5d7da; transition: all 0.3s ease; } .pxl-swiper__nav-style-2 .pxl-swiper__nav-item:hover svg path { stroke: var(--primary-color); } .pxl-swiper-dots.pxl-swiper-pagination-bullets span { display: inline-flex; cursor: pointer; transition: all 300ms linear 0ms; } .pxl-swiper-dots.pxl-swiper-pagination-progressbar { height: 1px; background-color: #454545; width: 100%; position: relative; margin-top: 45px; /* Swiper Dots Style */ } .pxl-swiper-dots.pxl-swiper-pagination-progressbar .swiper-pagination-progressbar-fill { height: 3px; background-color: var(--primary-color); display: inline-flex; width: 100%; position: absolute; left: 0; bottom: 0; transform-origin: left top; } .pxl-swiper-dots__style-1 { margin: 0 auto; display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 48px; } @media screen and (max-width: 767px) { .pxl-swiper-dots__style-1 { margin-top: 32px; } } @media screen and (max-width: 575px) { .pxl-swiper-dots__style-1 { margin-top: 24px; } } .pxl-swiper-dots__style-1 .swiper-pagination-bullet { width: 48px; height: 4px; background-color: #d5d7da; border-radius: 10px; } @media screen and (max-width: 767px) { .pxl-swiper-dots__style-1 .swiper-pagination-bullet { width: 36px; height: 3px; } } @media screen and (max-width: 575px) { .pxl-swiper-dots__style-1 .swiper-pagination-bullet { width: 24px; height: 2px; } } .pxl-swiper-dots__style-1 .swiper-pagination-bullet-active { background-color: var(--primary-color); } .pxl-swiper-dots__style-2 { margin: 0 auto; display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 50px; width: 100%; display: flex; } .pxl-swiper-dots__style-2 .swiper-pagination-bullet { width: 100%; height: 4px; background-color: #d5d7da; border-radius: 10px; } .pxl-swiper-dots__style-2 .swiper-pagination-bullet-active { background-color: var(--primary-color); } .pxl-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: transparent; z-index: 99; opacity: 0; visibility: hidden; cursor: pointer; } .pxl-overlay.active { opacity: 1; visibility: visible; } .pxl-popup { position: fixed; top: 0; left: 0; width: 100%; height: 100%; max-height: 100vh; z-index: 99999; display: flex; flex-wrap: wrap; align-items: center; justify-content: end; transition: transform 0.3s ease; opacity: 0; visibility: hidden; } .pxl-popup__close { border-width: 8px; position: absolute; width: 50px; height: 50px; right: 0; top: 0; display: flex; align-items: center; justify-content: center; cursor: pointer; background-color: var(--primary-color); } .pxl-popup__close svg { width: 16px; height: 16px; } .pxl-popup__close svg path { stroke: #fff; } .pxl-popup__close:before, .pxl-popup__close:after { background-color: #a7a7a7; } .pxl-popup__overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.43); z-index: -1; } .pxl-popup__loading { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3); z-index: 9999; display: flex; align-items: center; justify-content: center; } .pxl-popup__loading .pxl-popup__loading-spinner { width: 50px; height: 50px; border: 4px solid #f3f3f3; border-top: 4px solid var(--primary-color); border-radius: 50%; animation: spin 1s linear infinite; } .pxl-popup--cart .pxl-popup__content { width: 100%; max-width: 400px; height: 100%; display: flex; flex-direction: column; background-color: #fff; position: relative; transition: all 0.3s ease-in-out; transform: translateX(100%); } .pxl-popup--cart .pxl-popup__content .pxl-popup__header { display: flex; min-height: 50px; justify-content: space-between; align-items: center; position: relative; border-bottom: 1px solid #e5e5e5; padding: 12px 24px; } .pxl-popup--cart .pxl-popup__content .pxl-popup__header-title { font-size: 20px; font-weight: 500; color: var(--primary-color); } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner { flex: 1 1 auto; overflow-y: auto; padding: 24px; } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner::-webkit-scrollbar { width: 5px; height: 5px; } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner::-webkit-scrollbar-track { background: #f1f1f1; } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner::-webkit-scrollbar-thumb { background: #888; } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner::-webkit-scrollbar-thumb:hover { background: #555; } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner .pxl-popup__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner .pxl-popup__list .pxl-popup__empty { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 15px; } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner .pxl-popup__list .pxl-popup__empty i { font-size: 40px; color: #fff; background-color: var(--primary-color); padding: 10px; border-radius: 50%; display: flex; align-items: center; justify-content: center; width: 100px; height: 100px; border-radius: 50%; } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner .pxl-popup__list .pxl-popup__empty>span { font-size: 24px; font-weight: 500; color: var(--primary-color); } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner .pxl-popup__list .pxl-popup__item { display: flex; align-items: start; gap: 15px; position: relative; } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner .pxl-popup__list .pxl-popup__item-remove { all: unset; position: absolute; top: 0; right: 0; width: 20px; height: 20px; padding: 0; cursor: pointer; } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner .pxl-popup__list .pxl-popup__item-image { width: 120px; aspect-ratio: 308/370; } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner .pxl-popup__list .pxl-popup__item-image img { width: 100%; height: 100%; object-fit: cover; } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner .pxl-popup__list .pxl-popup__item .pxl-popup__item-meta { display: flex; flex-direction: column; gap: 16px; } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner .pxl-popup__list .pxl-popup__item .pxl-popup__item-meta .product-name { font-size: 16px; font-weight: 500; color: var(--primary-color); overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; line-clamp: 1; } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner .pxl-popup__list .pxl-popup__item .pxl-popup__item-meta .product-variations { font-size: 14px; font-weight: 400; color: var(--third-color); } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner .pxl-popup__list .pxl-popup__item .pxl-popup__item-meta .quantity-controls { display: flex; align-items: center; justify-content: center; gap: 15px; width: 90px; height: 30px; border: 1px solid #e5e5e5; border-radius: 0px; } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner .pxl-popup__list .pxl-popup__item .pxl-popup__item-meta .quantity-controls .qty-display { line-height: 1; } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner .pxl-popup__list .pxl-popup__item .pxl-popup__item-meta .quantity-controls .qty-btn { all: unset; width: 20px; height: 20px; padding: 0; cursor: pointer; display: flex; align-items: center; justify-content: center; } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner .pxl-popup__list .pxl-popup__item .pxl-popup__item-meta .quantity-controls .qty-btn svg { width: 12px; height: 12px; } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner .pxl-popup__list .pxl-popup__item .pxl-popup__item-meta .quantity-controls .qty-btn.disabled { opacity: 0.5; cursor: not-allowed; } .pxl-popup--cart .pxl-popup__content .pxl-popup__content-inner .pxl-popup__list .pxl-popup__item .pxl-popup__item-meta .quantity-controls .unit-price { position: absolute; left: 245px; } .pxl-popup--cart .pxl-popup__content .pxl-popup__footer { border-top: 1px solid #e5e5e5; padding: 24px; } .pxl-popup--cart .pxl-popup__content .pxl-popup__footer-total { font-size: 20px; font-weight: 500; color: var(--primary-color); display: flex; align-items: center; justify-content: space-between; } .pxl-popup--cart .pxl-popup__content .pxl-popup__footer-total strong { font-size: 16px; font-weight: 400; } .pxl-popup--cart .pxl-popup__content .pxl-popup__footer-buttons { display: flex; align-items: center; justify-content: space-between; gap: 12px; } .pxl-popup--cart .pxl-popup__content .pxl-popup__footer-buttons .btn { width: 100%; overflow: hidden; text-align: center; } .pxl-popup.active { opacity: 1; visibility: visible; } .pxl-popup.active .pxl-popup__content { transform: translateX(0%); } html { box-sizing: border-box; } html.html-smooth-scroll { scroll-behavior: auto; } body { background-color: #fff; font-size: 16px; line-height: 1.35; color: var(--third-color); -webkit-font-smoothing: antialiased; font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-x: hidden; font-weight: normal; letter-spacing: -0.32px; font-family: 'Inter', sans-serif; margin: 0; padding: 0; } body.body-overflow { overflow: hidden; } @media screen and (max-width: 767px) { body.body-visible-sm { overflow: visible; } } body.body-overflow { overflow: hidden; } .elementor-editor-active .elementor-shape { display: none; } a { transition: all 300ms linear 0ms; color: var(--link-color); } a:before, a:after { -webkit-transition: inherit; -khtml-transition: inherit; -moz-transition: inherit; -ms-transition: inherit; -o-transition: inherit; transition: inherit; } a:hover { color: var(--link-color-hover); } a:active { color: var(--link-color-active); } a, a:hover, a:focus, a:before, a:after { outline: none; text-decoration: none; } .ft-secondary, blockquote cite, .widget_recent_comments ul, .widget_recent_comments ol, .widget_rss .rsswidget, .widget_block .wp-block-latest-posts__list, .widget_block .wp-block-latest-comments, .pxl-contact-info-widget .pxl-phone--number { font-family: "Inter", sans-serif; } h1, h2, h3, .pxl-counter--style-default .pxl-counter__number, h4, h5, h6, .pxl-swiper-pagination .pxl-swiper-current-slide, .pxl-swiper-pagination .pxl-swiper-total-slides, .pxl-swiper-fraction-first, .pxl-swiper-fraction-last { font-family: 'Inter', sans-serif; color: #000; font-weight: 500; margin: 0 0 16px; clear: both; } h1, .h1 { font-size: 80px; line-height: 1.1; letter-spacing: -4px; } h2, .h2, .error404 .error-cnt__left .error-cnt__tit { font-size: 64px; line-height: 1.1; letter-spacing: -3.2px; } h3, .pxl-counter--style-default .pxl-counter__number, .h3 { font-size: 48px; line-height: 1.2; letter-spacing: -2.4px; } h4, .h4 { font-size: 40px; line-height: 1.2; letter-spacing: -2px; } h5, .h5, .pxl-pricing__style-5 .pxl-pricing__price, .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary .product_title { font-size: 32px; line-height: 1.2; letter-spacing: -1.28px; } h6, .pxl-swiper-pagination .pxl-swiper-current-slide, .pxl-swiper-pagination .pxl-swiper-total-slides, .pxl-swiper-fraction-first, .pxl-swiper-fraction-last, .h6, .pxl-pricing__style-5 .pxl-pricing__title, .pxl-icon-box-carousel -title.pxl-icon-box__item { font-size: 24px; line-height: 1.25; letter-spacing: -0.96px; } .h7, .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary .price { font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.8px; } img { max-width: 100%; height: auto; vertical-align: middle; border-style: none; } p { margin: 0 0 16px; } table { width: 100%; } @media screen and (max-width: 1600px) { .pxl-table__mobile.column-xxl-1 { display: grid; grid-template-columns: repeat(1, 1fr); } .pxl-table__mobile.column-xxl-2 { display: grid; grid-template-columns: repeat(2, 1fr); } .pxl-table__mobile.column-xxl-3 { display: grid; grid-template-columns: repeat(3, 1fr); } .pxl-table__mobile.column-xxl-4 { display: grid; grid-template-columns: repeat(4, 1fr); } .pxl-table__mobile.column-xxl-5 { display: grid; grid-template-columns: repeat(5, 1fr); } .pxl-table__mobile.column-xxl-6 { display: grid; grid-template-columns: repeat(6, 1fr); } } @media screen and (max-width: 1400px) { .pxl-table__mobile.column-xl-1 { display: grid; grid-template-columns: repeat(1, 1fr); } .pxl-table__mobile.column-xl-2 { display: grid; grid-template-columns: repeat(2, 1fr); } .pxl-table__mobile.column-xl-3 { display: grid; grid-template-columns: repeat(3, 1fr); } .pxl-table__mobile.column-xl-4 { display: grid; grid-template-columns: repeat(4, 1fr); } .pxl-table__mobile.column-xl-5 { display: grid; grid-template-columns: repeat(5, 1fr); } .pxl-table__mobile.column-xl-6 { display: grid; grid-template-columns: repeat(6, 1fr); } } @media screen and (max-width: 1200px) { .pxl-table__mobile.column-lg-1 { display: grid; grid-template-columns: repeat(1, 1fr); } .pxl-table__mobile.column-lg-2 { display: grid; grid-template-columns: repeat(2, 1fr); } .pxl-table__mobile.column-lg-3 { display: grid; grid-template-columns: repeat(3, 1fr); } .pxl-table__mobile.column-lg-4 { display: grid; grid-template-columns: repeat(4, 1fr); } .pxl-table__mobile.column-lg-5 { display: grid; grid-template-columns: repeat(5, 1fr); } .pxl-table__mobile.column-lg-6 { display: grid; grid-template-columns: repeat(6, 1fr); } } @media screen and (max-width: 991px) { .pxl-table__mobile.column-md-1 { display: grid; grid-template-columns: repeat(1, 1fr); } .pxl-table__mobile.column-md-2 { display: grid; grid-template-columns: repeat(2, 1fr); } .pxl-table__mobile.column-md-3 { display: grid; grid-template-columns: repeat(3, 1fr); } .pxl-table__mobile.column-md-4 { display: grid; grid-template-columns: repeat(4, 1fr); } .pxl-table__mobile.column-md-5 { display: grid; grid-template-columns: repeat(5, 1fr); } .pxl-table__mobile.column-md-6 { display: grid; grid-template-columns: repeat(6, 1fr); } } @media screen and (max-width: 767px) { .pxl-table__mobile.column-sm-1 { display: grid; grid-template-columns: repeat(1, 1fr); } .pxl-table__mobile.column-sm-2 { display: grid; grid-template-columns: repeat(2, 1fr); } .pxl-table__mobile.column-sm-3 { display: grid; grid-template-columns: repeat(3, 1fr); } .pxl-table__mobile.column-sm-4 { display: grid; grid-template-columns: repeat(4, 1fr); } .pxl-table__mobile.column-sm-5 { display: grid; grid-template-columns: repeat(5, 1fr); } .pxl-table__mobile.column-sm-6 { display: grid; grid-template-columns: repeat(6, 1fr); } } @media screen and (max-width: 575px) { .pxl-table__mobile.column-xs-1 { display: grid; grid-template-columns: repeat(1, 1fr); } .pxl-table__mobile.column-xs-2 { display: grid; grid-template-columns: repeat(2, 1fr); } .pxl-table__mobile.column-xs-3 { display: grid; grid-template-columns: repeat(3, 1fr); } .pxl-table__mobile.column-xs-4 { display: grid; grid-template-columns: repeat(4, 1fr); } .pxl-table__mobile.column-xs-5 { display: grid; grid-template-columns: repeat(5, 1fr); } .pxl-table__mobile.column-xs-6 { display: grid; grid-template-columns: repeat(6, 1fr); } } dl { margin: 0 0 0 25px; } dl dt { font-weight: normal; line-height: 1.2; text-transform: uppercase; font-weight: 500; letter-spacing: -0.4px; color: #000; } dl dd { line-height: normal; margin-bottom: 20px; } dl dd a { color: #000; } dl dd a:hover { color: var(--primary-color); } code, kbd { background-color: transparent; border-radius: 4px; color: inherit; font-size: 100%; padding: 2px 4px; -webkit-box-shadow: none; -moz-box-shadow: none; -o-box-shadow: none; box-shadow: none; } ins { color: var(--primary-color); border: none; text-decoration: none; } pre { background: #f5f5f5; color: #666; font-size: 14px; margin: 20px 0; overflow: auto; padding: 20px; white-space: pre-wrap; word-wrap: break-word; } ol { list-style: outside none decimal; margin-bottom: 32px; } ul { padding: 0; margin: 0 0 32px; } ul li { list-style-position: inside; } dl+h2+ul { padding-left: 35px; } dl+h2+ul ul { padding-left: 35px; } dl+h2+ul ul li { list-style: outside; } .wp-caption { margin-bottom: 1.5em; max-width: 100%; } .wp-caption img[class*="wp-image-"] { display: block; margin-left: auto; margin-right: auto; } .wp-caption .wp-caption-text { padding: 0.8075em 0; font-size: 0.875em; font-style: italic; } .gallery-caption { opacity: 1; margin-top: 10px; } .wp-block-group.has-background { padding: 40px; margin-bottom: 30px; } .wp-caption-text { text-align: center; } .alignleft, .alignright, .aligncenter { margin-top: 15px; margin-bottom: 32px; } .alignleft { display: inline; float: left; margin-right: 30px; } .alignright { display: inline; float: right; margin-left: 35px; } .aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; } .sticky { display: block; } .screen-reader-text { display: none; } .bypostauthor { display: block; } blockquote { color: var(--third-color); font-style: italic; font-weight: 400; margin: 0; padding: 0 10px 0 18px; position: relative; } blockquote strong { font-weight: 500; color: var(--primary-color); font-style: normal; } blockquote:before { content: ""; position: absolute; width: 2px; height: 100%; top: 0; left: 0; background-color: var(--secondary-color); } @media screen and (max-width: 767px) { blockquote { padding-left: 20px; padding-right: 20px; } } blockquote cite { position: relative; padding-left: 76px; font-size: 18px; text-transform: uppercase; font-weight: 500; font-style: normal; margin-top: 15px; display: inline-block; } blockquote cite:before { content: ''; width: 65px; height: 2px; background-color: var(--gradient-color-from); background-image: -webkit-gradient(linear, right top, left top, from(var(--gradient-color-from)), to(var(--gradient-color-to))); background-image: -webkit-linear-gradient(to right, var(--gradient-color-from), var(--gradient-color-to)); background-image: -moz-linear-gradient(to right, var(--gradient-color-from), var(--gradient-color-to)); background-image: -ms-linear-gradient(to right, var(--gradient-color-from), var(--gradient-color-to)); background-image: -o-linear-gradient(to right, var(--gradient-color-from), var(--gradient-color-to)); background-image: linear-gradient(to right, var(--gradient-color-from), var(--gradient-color-to)); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='var(--gradient-color-from)', endColorStr='var(--gradient-color-to)', gradientType='1'); position: absolute; top: 50%; left: 0; transform: translate(0, -50%); } blockquote p { margin-bottom: 0 !important; } blockquote.wp-block-quote p { margin-bottom: 16px !important; } blockquote.wp-block-quote cite br { display: none; } blockquote.wp-block-quote.has-text-align-right:before { left: auto; right: 0; } .wp-block-button { margin-bottom: 20px; } .wp-block-button .wp-block-button__link { padding-left: 32px; padding-right: 32px; background-color: var(--secondary-color); font-size: 16px; font-weight: 500; line-height: 1.2; letter-spacing: -0.8px; } .wp-block-button .wp-block-button__link:not([href]) { color: #fff; } .wp-block-button .wp-block-button__link:hover { background-color: var(--primary-color); border-color: var(--primary-color); color: #fff; } .wp-block-button .wp-block-button__link:hover:not([href]) { color: #fff; } .wp-block-button.is-style-outline .wp-block-button__link { background-color: transparent; color: var(--primary-color); } .wp-block-button.is-style-outline .wp-block-button__link:hover { background-color: var(--primary-color); border-color: var(--primary-color); color: #fff; } .wp-block-button.is-style-squared .wp-block-button__link { -webkit-border-radius: 0px; -khtml-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; } .wp-block-button.aligncenter { justify-content: center; display: flex; flex-wrap: wrap; } .has-background-dim { color: #fff; margin-bottom: 30px; } .wp-block-gallery .blocks-gallery-item { float: left; } .wp-block-gallery .blocks-gallery-caption { margin-bottom: 22px; } .wp-block-gallery.alignleft { margin-right: 30px; } .wp-block-gallery.alignright { margin-left: 30px; } #tslOverlay { background-color: transparent !important; z-index: 999999 !important; /* Inter Font */ } @font-face { font-family: 'Inter'; src: url('../fonts/inter/Inter-VariableFont_opsz,wght.ttf') format('truetype'); font-weight: 100 900; font-style: normal; font-display: swap; } @font-face { font-family: 'Inter'; src: url('../fonts/inter/Inter-Italic-VariableFont_opsz,wght.ttf') format('truetype'); font-weight: 100 900; font-style: italic; font-display: swap; } @font-face { font-family: 'Arapey'; src: url('../fonts/arapey/Arapey-Regular.ttf') format('truetype'); font-weight: 400; font-style: normal; font-display: swap; } @font-face { font-family: 'Arapey'; src: url('../fonts/arapey/Arapey-Italic.ttf') format('truetype'); font-weight: 400; font-style: italic; font-display: swap; } @font-face { font-family: 'Allura'; src: url('../fonts/allura/Allura-Regular.ttf') format('truetype'); font-weight: 400; font-style: normal; font-display: swap; } @font-face { font-family: 'Rubik'; src: url('../fonts/rubik/Rubik-VariableFont_wght.ttf') format('truetype'); font-weight: 100 900; font-style: normal; font-display: swap; } @font-face { font-family: 'Rubik'; src: url('../fonts/rubik/Rubik-Italic-VariableFont_wght.ttf') format('truetype'); font-weight: 100 900; font-style: italic; font-display: swap; } @font-face { font-family: 'Geist'; src: url('../fonts/geist/Geist-VariableFont_wght.ttf') format('truetype'); font-weight: 100 900; font-style: normal; font-display: swap; } .ft-st { font-family: 'Inter', sans-serif !important; } .ft-nd { font-family: 'Arapey', sans-serif !important; } .ft-rd { font-family: 'Allura', sans-serif !important; } @media screen and (max-width: 1024px) { h1, .h1 { font-size: 64px; letter-spacing: -3.2px; } h2, .h2, .error404 .error-cnt__left .error-cnt__tit { font-size: 48px; letter-spacing: -2.4px; } h3, .pxl-counter--style-default .pxl-counter__number, .h3 { font-size: 36px; letter-spacing: -2px; } h4, .h4 { font-size: 32px; letter-spacing: -1.28px; } h5, .h5, .pxl-pricing__style-5 .pxl-pricing__price, .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary .product_title { font-size: 28px; letter-spacing: -0.96px; } h6, .pxl-swiper-pagination .pxl-swiper-current-slide, .pxl-swiper-pagination .pxl-swiper-total-slides, .pxl-swiper-fraction-first, .pxl-swiper-fraction-last, .h6, .pxl-pricing__style-5 .pxl-pricing__title, .pxl-icon-box-carousel -title.pxl-icon-box__item { font-size: 24px; letter-spacing: -0.32px; } } @media screen and (max-width: 767px) { h1, .h1 { font-size: 48px; letter-spacing: -2.4px; } h2, .h2, .error404 .error-cnt__left .error-cnt__tit { font-size: 36px; letter-spacing: -2px; } h3, .pxl-counter--style-default .pxl-counter__number, .h3 { font-size: 36px; letter-spacing: -1.28px; } h4, .h4 { font-size: 32px; letter-spacing: -0.96px; } h5, .h5, .pxl-pricing__style-5 .pxl-pricing__price, .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary .product_title { font-size: 28px; letter-spacing: -0.96px; } h6, .pxl-swiper-pagination .pxl-swiper-current-slide, .pxl-swiper-pagination .pxl-swiper-total-slides, .pxl-swiper-fraction-first, .pxl-swiper-fraction-last, .h6, .pxl-pricing__style-5 .pxl-pricing__title, .pxl-icon-box-carousel -title.pxl-icon-box__item { font-size: 24px; letter-spacing: -0.32px; } .h7, .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary .price { font-size: 20px; letter-spacing: -0.2px; } } @media screen and (max-width: 575px) { body { font-size: 14px; } h1, .h1 { font-size: 32px; letter-spacing: -1.28px; } h2, .h2, .error404 .error-cnt__left .error-cnt__tit { font-size: 28px; letter-spacing: -0.96px; } h3, .pxl-counter--style-default .pxl-counter__number, .h3 { font-size: 24px; letter-spacing: -0.64px; } h4, .h4 { font-size: 22px; letter-spacing: -0.32px; } h5, .h5, .pxl-pricing__style-5 .pxl-pricing__price, .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary .product_title { font-size: 20px; letter-spacing: -0.2px; } h6, .pxl-swiper-pagination .pxl-swiper-current-slide, .pxl-swiper-pagination .pxl-swiper-total-slides, .pxl-swiper-fraction-first, .pxl-swiper-fraction-last, .h6, .pxl-pricing__style-5 .pxl-pricing__title, .pxl-icon-box-carousel -title.pxl-icon-box__item { font-size: 18px; letter-spacing: -0.12px; } .h7, .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary .price { font-size: 16px; letter-spacing: -0.12px; } } @media screen and (min-width: 1400px) { .col-xxl-3 { width: 25%; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } } #pxl-wapper { overflow-x: clip; } @media screen and (min-width: 1201px) { #pxl-wapper .container { max-width: 1312px; } } @media screen and (min-width: 1201px) { #pxl-wapper.pxl-wrapper__standard .container { max-width: 1312px; } } @media screen and (max-width: 1200px) { #pxl-wapper .container { max-width: 100%; } } #pxl-wapper .elementor-widget:not(:last-child) { margin-bottom: 0; } @media screen and (max-width: 991px) { #pxl-wapper #pxl-sidebar-area { margin-top: 60px; } } @media screen and (min-width: 992px) { #pxl-wapper .pxl-has-sidebar.pxl-sidebar-left { flex-direction: row-reverse; } } #pxl-wapper .elementor-top-section:not(.elementor-container-full_width) .elementor-container.elementor-inner-section>.elementor-container.elementor-column-gap-extended { margin: 0 -16px; left: calc(50% + 16px); transform: translate(-50%, 0); position: relative; } @media screen and (max-width: 1200px) { #pxl-wapper .elementor-top-section>.elementor-column-gap-extended .elementor-inner-section>.elementor-column-gap-extended { margin-left: -16px; margin-right: -16px; } } #pxl-wapper .elementor-top-section:not(.elementor-container-full_width) .elementor-container.elementor-inner-section.pxl-inner-section-maxwidth>.elementor-container { max-width: 1170px !important; margin: auto; } #pxl-main { padding: 120px 0; min-height: calc(100vh - 606px); } @media screen and (max-width: 1200px) { #pxl-main { overflow-x: clip; } } @media screen and (max-width: 1024px) { #pxl-main>.elementor-container { padding: 0 16px; } } @media screen and (max-width: 767px) { #pxl-main { padding: 80px 0; } } @media screen and (max-width: 575px) { #pxl-main { padding: 60px 0; } } .elementor-page:not(.single-post):not(.single-product) #pxl-main { padding-top: 0; padding-bottom: 0; } .elementor-page.single-product .woocommerce-Tabs-panel>.elementor { margin: 0 -16px; } @media screen and (min-width: 1201px) { body:not(.elementor-editor-active) .pxl-row-scroll-fixed>.elementor-container { align-items: flex-start; justify-content: space-between; } body:not(.elementor-editor-active) .pxl-row-scroll-fixed .pxl-column-sticky { position: sticky; } } @media screen and (max-width: 1200px) { body:not(.elementor-editor-active) .pxl-row-scroll-fixed .pxl-column-sticky { top: 0 !important; } } body.elementor-editor-active .pxl-row-scroll-fixed .pxl-column-sticky { top: 0 !important; } body.elementor-editor-active .elementor-widget:not(:last-child) { margin-block-end: 0; } .elementor-page:not(.single-post):not(.single-product) #pxl-content-area.col-12, .elementor-page:not(.single-post):not(.single-product) #pxl-footer-elementor .row>.col-12 { padding: 0; min-height: 0px; } @media (min-width: 1025px) and (max-width: 1200px) { .elementor-page:not(.single) #pxl-content-area.col-12 { padding-left: 16px; padding-right: 16px; } } .single-post .pxl-item--excerpt>.elementor { margin: 0 -16px; } .pxl-bg-color-full { z-index: 1; } .pxl-bg-color-full .pxl-section-overlay-color { z-index: -1; content: ''; background-color: #070f01; position: absolute; top: 0; left: 0; right: 0; bottom: 0; transition: all 300ms linear 0ms; } .pxl-bg-color-skew { z-index: 1; } .pxl-bg-color-skew .pxl-section-overlay-color { z-index: -1; content: ''; background-color: #080808; position: absolute; top: 0; left: 6px; right: 6px; bottom: 0; transform: skewX(-12deg); max-width: 1160px; margin: auto; -webkit-transition: all 200ms linear 0ms; -khtml-transition: all 200ms linear 0ms; -moz-transition: all 200ms linear 0ms; -ms-transition: all 200ms linear 0ms; -o-transition: all 200ms linear 0ms; transition: all 200ms linear 0ms; } #pxl-ptit-elementor { background-color: #fff; } @media screen and (max-width: 1200px) { #pxl-ptit-elementor { overflow: hidden; } } #pxl-ptit-default { background-color: #f5f6f6; padding: 150px 0; } @media screen and (max-width: 767px) { #pxl-ptit-default { padding: 90px 0; } } #pxl-ptit-default .row { align-items: center; } #pxl-ptit-default .pxl-ptit { margin: 0; } @media screen and (max-width: 1200px) { #pxl-ptit-default .pxl-ptit { font-size: 48px; } } @media screen and (max-width: 767px) { #pxl-ptit-default .pxl-ptit { font-size: 42px; text-align: center; margin-bottom: 12px; } } #pxl-ptit-default .ptitle-col-right { justify-content: flex-end; display: inline-flex; } @media screen and (max-width: 767px) { #pxl-ptit-default .ptitle-col-right { justify-content: center; } } #pxl-footer-default { padding: 44px 0; background-color: #151a25; font-size: 16px; text-align: center; color: #fff; } #pxl-footer-default a { color: inherit; } #pxl-footer-default a:hover { color: inherit; text-decoration: underline; } .pxl-scroll-top { width: 46px; height: 46px; position: fixed; bottom: 20px; right: 40px; line-height: 46px; -webkit-border-radius: 50px; -khtml-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; border-radius: 50px; z-index: 9999; color: #fff; text-align: center; font-size: 18px; opacity: 0; visibility: hidden; box-shadow: inset 0 0 0 2px #d4d4d4; } @media screen and (max-width: 991px) { .pxl-scroll-top { right: 25px; } } .pxl-scroll-top:before { content: ''; position: absolute; top: 2px; right: 2px; bottom: 2px; left: 2px; z-index: -1; background-color: #01062e; border-radius: 100%; } .pxl-scroll-top .pxl-scroll__arrow { width: 20px; height: 20px; fill: #fff; } .pxl-scroll-top .pxl-scroll-progress-circle { position: absolute; top: 0; left: 0; z-index: -1; } .pxl-scroll-top .pxl-scroll-progress-circle path { fill: none; stroke: var(--primary-color); stroke-width: 4; box-sizing: border-box; -webkit-transition: all 200ms linear; transition: all 200ms linear; } .pxl-scroll-top.pxl-on { bottom: 40px; opacity: 1; visibility: visible; } @media screen and (max-width: 991px) { .pxl-scroll-top.pxl-on { bottom: 25px; } } .pxl-scroll-top:hover, .pxl-scroll-top:focus { color: #fff; } @keyframes pxl_scroll_top_effect { 0% { transform: translateX(3px); } 100% { transform: translateX(-3px); } } @keyframes pxl_scroll_bottom_effect { 0% { transform: translateY(-3px); } 100% { transform: translateY(3px); } } @media screen and (max-width: 1024px) { .section-bg-bl-lg { background-position: left bottom !important; } } #pxl-footer-elementor .pxl-footer-hide { display: none !important; } #pxl-footer-elementor .pxl-footer-elementor__inner>.container { max-width: 100%; } #pxl-footer-elementor .pxl-footer-elementor__inner>.container>.row>.col-12 { padding: 0; } @media screen and (max-width: 767px) { #pxl-footer-elementor { overflow-x: clip; } } .pxl-footer-fixed #pxl-footer-elementor { width: 100%; position: fixed; bottom: 0; left: 0; z-index: -1; } @media screen and (max-width: 1200px) { .pxl-footer-fixed #pxl-footer-elementor { position: static; overflow: hidden; } } .pxl-footer-fixed #pxl-header-elementor, .pxl-footer-fixed #pxl-ptit-elementor { background-color: #fff; } .pxl-footer-fixed #pxl-main { background-color: #fff; } @media screen and (max-width: 1200px) { .pxl-footer-fixed #pxl-main { margin-bottom: 0 !important; } } .elementor-editor-active #pxl-header-default, .elementor-editor-active #pxl-header-elementor, .elementor-editor-active #pxl-ptit-default, .elementor-editor-active #pxl-footer-elementor, .elementor-editor-active .pxl-menu__primary .sub-menu, .elementor-editor-active .pxl-menu__primary .children, .elementor-editor-active #pxl-ptit-elementor { display: none; } .elementor-editor-active.single-footer #pxl-main, .elementor-editor-active.single-header #pxl-main { max-width: 1200px; padding: 0 15px; margin: auto; } .elementor-editor-active.single-pxl-template { background-color: rgba(0, 0, 0, 0.1); } .elementor-editor-active .elementor-inner-section>.elementor-element-overlay>.elementor-editor-element-settings { margin-left: 84px; } .elementor-editor-active .elementor-inner-section .elementor-column .elementor-editor-element-settings { margin-left: 12px; } .elementor-editor-active .elementor-container-wrap.ui-sortable { margin-top: 30px; } body img.mfp-img { padding: 0 !important; } body .mfp-fade.mfp-bg.mfp-ready { opacity: 0.85; background-color: #000; } body .mfp-bottom-bar { margin-top: 0; } body .mfp-wrap .mfp-container .mfp-content { max-width: 1170px; position: static; } body .mfp-wrap .mfp-container .mfp-content .mfp-close { padding: 0; right: 0; text-align: center; top: -36px; width: 36px; height: 36px; border-radius: 0px; background: rgba(255, 255, 255, 0.12); cursor: pointer; opacity: 1; font-size: 0px; border: 9px solid transparent; position: absolute; } body .mfp-wrap .mfp-container .mfp-content .mfp-close:before, body .mfp-wrap .mfp-container .mfp-content .mfp-close:after { content: ''; position: absolute; height: 2px; width: 100%; top: 50%; left: 0; margin-top: -1px; transform-origin: 50% 50%; -webkit-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -khtml-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -moz-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -ms-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); background-color: #fff; } body .mfp-wrap .mfp-container .mfp-content .mfp-close:before { -webkit-transform: rotate(45deg); -khtml-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } body .mfp-wrap .mfp-container .mfp-content .mfp-close:after { -webkit-transform: rotate(-45deg); -khtml-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } body .mfp-wrap .mfp-container .mfp-content .mfp-close:hover:before, body .mfp-wrap .mfp-container .mfp-content .mfp-close:hover:after { -webkit-transform: rotate(0deg); -khtml-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } body .mfp-wrap .mfp-container .mfp-iframe-scaler { position: relative; overflow: visible; } body .mfp-wrap .mfp-container .mfp-arrow { background-color: var(--primary-color); width: 60px; height: 120px; opacity: 1; position: absolute; } body .mfp-wrap .mfp-container .mfp-arrow:before, body .mfp-wrap .mfp-container .mfp-arrow:after { border: none; } body .mfp-wrap .mfp-container .mfp-arrow:before { font-family: "Caseicon"; font-size: 20px; color: #fff; margin: 0; padding: 0; line-height: normal; position: absolute; top: 50%; display: block; -webkit-transform: translate(-50%, -50%); -khtml-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); opacity: 1; left: 50%; width: auto; height: auto; } body .mfp-wrap .mfp-container .mfp-arrow.mfp-arrow-left:before { content: "\f136"; } body .mfp-wrap .mfp-container .mfp-arrow.mfp-arrow-right:before { content: "\f14d"; } @media screen and (min-width: 1201px) { body .mfp-wrap .mfp-container { padding: 0 120px; } } @media screen and (min-width: 992px) { .pxl-post { max-width: 1040px; margin-left: auto; margin-right: auto; } } .pxl-row-divider-active { z-index: 1; } .pxl-row-divider-active>.elementor-container { z-index: 2; } .pxl-row-divider-active .pxl-row-angle { position: absolute; left: 0; right: 0; width: 100%; height: 100px; } .pxl-row-divider-wave-animation-top .pxl-row-angle { top: -1px; -webkit-transform: scaleY(-1); -khtml-transform: scaleY(-1); -moz-transform: scaleY(-1); -ms-transform: scaleY(-1); -o-transform: scaleY(-1); transform: scaleY(-1); height: 150px; } .pxl-row-divider-wave-animation-bottom .pxl-row-angle { bottom: -1px; height: 150px; } .pxl-row-divider-angle-top .pxl-row-angle { top: -1px; -webkit-transform: scaleX(-1) scaleY(-1); -khtml-transform: scaleX(-1) scaleY(-1); -moz-transform: scaleX(-1) scaleY(-1); -ms-transform: scaleX(-1) scaleY(-1); -o-transform: scaleX(-1) scaleY(-1); transform: scaleX(-1) scaleY(-1); } .pxl-row-divider-angle-top-right .pxl-row-angle { top: -1px; -webkit-transform: scaleX(1) scaleY(-1); -khtml-transform: scaleX(1) scaleY(-1); -moz-transform: scaleX(1) scaleY(-1); -ms-transform: scaleX(1) scaleY(-1); -o-transform: scaleX(1) scaleY(-1); transform: scaleX(1) scaleY(-1); } .pxl-row-divider-angle-bottom .pxl-row-angle { bottom: -1px; } .pxl-row-divider-angle-bottom-left .pxl-row-angle { bottom: -1px; -webkit-transform: scaleX(-1); -khtml-transform: scaleX(-1); -moz-transform: scaleX(-1); -ms-transform: scaleX(-1); -o-transform: scaleX(-1); transform: scaleX(-1); } .pxl-row-divider-angle-top-bottom .pxl-row-angle-top { top: -1px; -webkit-transform: scaleX(-1) scaleY(-1); -khtml-transform: scaleX(-1) scaleY(-1); -moz-transform: scaleX(-1) scaleY(-1); -ms-transform: scaleX(-1) scaleY(-1); -o-transform: scaleX(-1) scaleY(-1); transform: scaleX(-1) scaleY(-1); } .pxl-row-divider-angle-top-bottom .pxl-row-angle-bottom { bottom: -1px; } .pxl-row-divider-angle-top-bottom-left .pxl-row-angle-top { top: -1px; -webkit-transform: scaleX(1) scaleY(-1); -khtml-transform: scaleX(1) scaleY(-1); -moz-transform: scaleX(1) scaleY(-1); -ms-transform: scaleX(1) scaleY(-1); -o-transform: scaleX(1) scaleY(-1); transform: scaleX(1) scaleY(-1); } .pxl-row-divider-angle-top-bottom-left .pxl-row-angle-bottom { bottom: -1px; -webkit-transform: scaleX(-1); -khtml-transform: scaleX(-1); -moz-transform: scaleX(-1); -ms-transform: scaleX(-1); -o-transform: scaleX(-1); transform: scaleX(-1); } .pxl-row-divider-curved-top .pxl-row-angle { top: -1px; } .pxl-row-divider-curved-top .pxl-row-angle path { fill-rule: evenodd; } .pxl-row-divider-curved-bottom .pxl-row-angle { bottom: -1px; -webkit-transform: scaleY(-1); -khtml-transform: scaleY(-1); -moz-transform: scaleY(-1); -ms-transform: scaleY(-1); -o-transform: scaleY(-1); transform: scaleY(-1); } .pxl-row-divider-curved-bottom .pxl-row-angle path { fill-rule: evenodd; } .pxl-row-divider-vertical1 .pxl-divider-vertical { position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100%; max-width: 1490px; margin: 0 auto; } .pxl-row-divider-vertical1 .pxl-divider-vertical>div { background-color: #303233; position: absolute; width: 1px; height: 100%; top: 0; } .pxl-row-divider-vertical1 .pxl-divider-vertical .pxl-section-line1 { left: 0; } .pxl-row-divider-vertical1 .pxl-divider-vertical .pxl-section-line2 { left: 20%; } .pxl-row-divider-vertical1 .pxl-divider-vertical .pxl-section-line3 { left: 40%; } .pxl-row-divider-vertical1 .pxl-divider-vertical .pxl-section-line4 { left: 60%; } .pxl-row-divider-vertical1 .pxl-divider-vertical .pxl-section-line5 { left: 80%; } .pxl-row-divider-vertical1 .pxl-divider-vertical .pxl-section-line6 { right: 0; } .pxl-row-divider-rounded-top:before, .pxl-row-divider-rounded-top:after { content: ''; position: absolute; height: 53px; background-color: #fff; top: -53px; width: 50%; } @media screen and (max-width: 767px) { .pxl-row-divider-rounded-top:before, .pxl-row-divider-rounded-top:after { top: -30px; height: 30px; } } .pxl-row-divider-rounded-top:before { left: 0; border-radius: 28px 53px 0 0; } @media screen and (max-width: 767px) { .pxl-row-divider-rounded-top:before { border-radius: 15px 30px 0 0; } } .pxl-row-divider-rounded-top:after { right: 0; border-radius: 53px 28px 0 0; } @media screen and (max-width: 767px) { .pxl-row-divider-rounded-top:after { border-radius: 30px 15px 0 0; } } .pxl-curved-arrow { position: absolute; height: 48px; z-index: 99; left: 50%; -webkit-transform: translate(-50%, 0); -khtml-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); transform: translate(-50%, 0); } .pxl-curved-arrow.pxl-curved-arrow-top { top: -48px; } .pxl-curved-arrow.pxl-curved-arrow-bottom { bottom: -48px; transform: translate(-50%, 0) scaleY(-1); } .pxl-curved-arrow-inner-top, .pxl-curved-arrow-inner-bottom { height: 48px; position: absolute; left: 50%; -webkit-transform: translate(-50%, 0); -khtml-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); transform: translate(-50%, 0); } .pxl-curved-arrow-inner-top { top: 0; transform: translate(-50%, 0) scaleY(-1); } .pxl-curved-arrow-inner-bottom { bottom: 0; } .pxl-divider-border { position: absolute; top: 62px; left: 70px; right: 70px; bottom: 52px; } @media screen and (max-width: 1200px) { .pxl-divider-border { left: 15px; right: 15px; } } .pxl-divider-border .pxl-divider-border-top, .pxl-divider-border .pxl-divider-border-bottom { background-color: #fff; height: 12px; position: absolute; width: 100%; } @media screen and (max-width: 767px) { .pxl-divider-border .pxl-divider-border-top, .pxl-divider-border .pxl-divider-border-bottom { height: 8px; } } .pxl-divider-border .pxl-divider-border-top:before, .pxl-divider-border .pxl-divider-border-bottom:before, .pxl-divider-border .pxl-divider-border-top:after, .pxl-divider-border .pxl-divider-border-bottom:after { content: ''; height: 94px; background-color: #fff; width: 12px; position: absolute; } @media screen and (max-width: 767px) { .pxl-divider-border .pxl-divider-border-top:before, .pxl-divider-border .pxl-divider-border-bottom:before, .pxl-divider-border .pxl-divider-border-top:after, .pxl-divider-border .pxl-divider-border-bottom:after { width: 8px; } } .pxl-divider-border .pxl-divider-border-top:before, .pxl-divider-border .pxl-divider-border-bottom:before { left: 0; } .pxl-divider-border .pxl-divider-border-top:after, .pxl-divider-border .pxl-divider-border-bottom:after { right: 0; } .pxl-divider-border .pxl-divider-border-top { top: 0; } .pxl-divider-border .pxl-divider-border-top:before, .pxl-divider-border .pxl-divider-border-top:after { top: 0; } .pxl-divider-border .pxl-divider-border-bottom { bottom: 0; } .pxl-divider-border .pxl-divider-border-bottom:before, .pxl-divider-border .pxl-divider-border-bottom:after { bottom: 0; } .pxl-row-divider-top, .pxl-row-divider-bottom { position: absolute; left: 0; width: 100%; z-index: 1; } .pxl-row-divider-top { top: -2px; } .pxl-row-divider-bottom { bottom: -2px; } .pxl-row-particles { position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; } @keyframes pxl_loader_digital1 { 0% { left: 20%; } 50% { left: 50%; } 100% { left: 20%; } } @keyframes pxl_loader_digital2 { 0% { left: 80%; } 50% { left: 50%; } 100% { left: 80%; } } @keyframes pxl_folding { 0%, 10% { transform: perspective(140px) rotateX(-180deg); opacity: 0; } 25%, 75% { transform: perspective(140px) rotateX(0deg); opacity: 1; } 90%, 100% { transform: perspective(140px) rotateY(180deg); opacity: 0; } } @keyframes pxl_loader_prixClipFix { 0% { clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0); } 25% { clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0); } 50% { clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%); } 75% { clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%); } 100% { clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0); } } @keyframes pxl_loader_anim { 0% { box-shadow: 20px -10px, 40px 10px, 60px 0px; } 25% { box-shadow: 20px 0px, 40px 0px, 60px 10px; } 50% { box-shadow: 20px 10px, 40px -10px, 60px 0px; } 75% { box-shadow: 20px 0px, 40px 0px, 60px -10px; } 100% { box-shadow: 20px -10px, 40px 10px, 60px 0px; } } @keyframes pxl_loaderFlash { 0% { background-color: rgba(24, 29, 39, 0.28); box-shadow: 32px 0 rgba(24, 29, 39, 0.28), -32px 0 var(--primary-color); } 50% { background-color: var(--primary-color); box-shadow: 32px 0 rgba(24, 29, 39, 0.28), -32px 0 rgba(24, 29, 39, 0.28); } 100% { background-color: rgba(24, 29, 39, 0.28); box-shadow: 32px 0 var(--primary-color), -32px 0 rgba(24, 29, 39, 0.28); } } @keyframes pxl_animloader { 50% { transform: scale(1) translate(-50%, -50%); } } @keyframes pxl_loader_photography { 0% { left: 0; transform: translateX(-100%); } 100% { left: 100%; transform: translateX(0%); } } @-webkit-keyframes pxl_site_loading { 0% { -webkit-transform: translate(0) scaleX(0); transform: translate(0) scaleX(0); } 30% { -webkit-transform: translate(0) scaleX(1); transform: translate(0) scaleX(1); } 100%, 80% { -webkit-transform: translate(100%) scaleX(0); transform: translate(100%) scaleX(0); } } @keyframes pxl_site_loading { 0% { -webkit-transform: translate(0) scaleX(0); transform: translate(0) scaleX(0); } 30% { -webkit-transform: translate(0) scaleX(1); transform: translate(0) scaleX(1); } 100%, 80% { -webkit-transform: translate(100%) scaleX(0); transform: translate(100%) scaleX(0); } } @-webkit-keyframes pxl_reveal { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 80% { -webkit-transform: translateY(100%); transform: translateY(100%); } 100% { -webkit-transform: translateY(100%); transform: translateY(100%); } } @keyframes pxl_reveal { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 80% { -webkit-transform: translateY(100%); transform: translateY(100%); } 100% { -webkit-transform: translateY(100%); transform: translateY(100%); } } @keyframes pxl_loader_rotate1 { 0% { transform: rotateX(35deg) rotateY(-45deg) rotateZ(0deg); } 100% { transform: rotateX(35deg) rotateY(-45deg) rotateZ(360deg); } } @keyframes pxl_loader_rotate2 { 0% { transform: rotateX(50deg) rotateY(10deg) rotateZ(0deg); } 100% { transform: rotateX(50deg) rotateY(10deg) rotateZ(360deg); } } @keyframes pxl_loader_rotate3 { /* Site Loader */ /* Mouse Move Animation */ 0% { transform: rotateX(35deg) rotateY(55deg) rotateZ(0deg); } 100% { transform: rotateX(35deg) rotateY(55deg) rotateZ(360deg); } } .pxl-cursor { visibility: hidden; position: fixed; pointer-events: none; z-index: 999999; display: flex; justify-content: center; align-items: center; -webkit-transition: transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); -khtml-transition: transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); -moz-transition: transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); -ms-transition: transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); transition: transform 0.2s cubic-bezier(0.165, 0.84, 0.44, 1); pointer-events: none; top: 0; left: 0; } .pxl-cursor .pxl-cursor-wrapper { display: flex; justify-content: center; align-items: center; -webkit-transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -khtml-transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -moz-transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -ms-transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); } .pxl-cursor .pxl-cursor--follower { position: absolute; background-color: transparent; border: 1px solid var(--primary-color); opacity: 1; border-radius: 100%; width: 30px; height: 30px; -webkit-transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), background-color 0.1s cubic-bezier(0.165, 0.84, 0.44, 1); -khtml-transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), background-color 0.1s cubic-bezier(0.165, 0.84, 0.44, 1); -moz-transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), background-color 0.1s cubic-bezier(0.165, 0.84, 0.44, 1); -ms-transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), background-color 0.1s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), background-color 0.1s cubic-bezier(0.165, 0.84, 0.44, 1); transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), background-color 0.1s cubic-bezier(0.165, 0.84, 0.44, 1); } .pxl-cursor .pxl-cursor--follower:before { content: ''; width: 6px; height: 6px; background-color: var(--secondary-color); position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; border-radius: 6px; } .pxl-cursor .pxl-cursor--label { position: absolute; display: flex; justify-content: center; align-items: center; color: white; font-size: 15px; transform: scale(0); will-change: transform, opacity; -webkit-transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -khtml-transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -moz-transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -ms-transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); } .pxl-cursor .pxl-cursor--drag { line-height: 87px; text-align: center; width: 87px; height: 87px; background-color: var(--secondary-color); font-size: 0px; -webkit-border-radius: 87px; -khtml-border-radius: 87px; -moz-border-radius: 87px; -ms-border-radius: 87px; -o-border-radius: 87px; border-radius: 87px; -webkit-transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -khtml-transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -moz-transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -ms-transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transform: scale(0); will-change: transform, opacity; color: #fff; } .pxl-cursor .pxl-cursor--drag:before, .pxl-cursor .pxl-cursor--drag:after { content: "\f10b"; font-family: "Caseicon"; font-size: 10px; display: inline-flex; } .pxl-cursor .pxl-cursor--drag:before { -webkit-transform: scaleX(-1); -khtml-transform: scaleX(-1); -moz-transform: scaleX(-1); -ms-transform: scaleX(-1); -o-transform: scaleX(-1); transform: scaleX(-1); } .pxl-cursor .pxl-cursor--drag:after { margin-left: 10px; } .pxl-cursor .pxl-cursor--icon { position: absolute; display: flex; justify-content: center; align-items: center; color: white; transform: scale(0); will-change: transform, opacity; -webkit-transition: transform 500ms cubic-bezier(0.165, 0.84, 0.44, 1), opacity 500ms cubic-bezier(0.165, 0.84, 0.44, 1); -khtml-transition: transform 500ms cubic-bezier(0.165, 0.84, 0.44, 1), opacity 500ms cubic-bezier(0.165, 0.84, 0.44, 1); -moz-transition: transform 500ms cubic-bezier(0.165, 0.84, 0.44, 1), opacity 500ms cubic-bezier(0.165, 0.84, 0.44, 1); -ms-transition: transform 500ms cubic-bezier(0.165, 0.84, 0.44, 1), opacity 500ms cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: transform 500ms cubic-bezier(0.165, 0.84, 0.44, 1), opacity 500ms cubic-bezier(0.165, 0.84, 0.44, 1); transition: transform 500ms cubic-bezier(0.165, 0.84, 0.44, 1), opacity 500ms cubic-bezier(0.165, 0.84, 0.44, 1); } .pxl-cursor.is-enabled { visibility: visible; } .pxl-cursor.is-hidden .pxl-cursor-wrapper { transform: scale(0) !important; } .pxl-cursor.is-mouse-down .pxl-cursor-wrapper { transform: scale(0.8); } .pxl-cursor.is-active .pxl-cursor--follower { background-color: rgba(var(--primary-color-rgb), 0.25); -webkit-transform: scale(3); -khtml-transform: scale(3); -moz-transform: scale(3); -ms-transform: scale(3); -o-transform: scale(3); transform: scale(3); border: none; } .pxl-cursor.is-active .pxl-cursor--follower:before { display: none; } .pxl-cursor.is-active.has-label .pxl-cursor--follower { background-color: var(--secondary-color); opacity: 1; } .pxl-cursor.is-active.has-drag .pxl-cursor--drag { transform: scale(1); } .pxl-cursor.is-active.has-label .pxl-cursor--label { transform: scale(1); } .pxl-cursor.is-active.has-icon .pxl-cursor--follower, .pxl-cursor.is-active.has-icon-left .pxl-cursor--follower, .pxl-cursor.is-active.has-icon-right .pxl-cursor--follower { background-color: black; opacity: 0.8; } .pxl-cursor.is-active.has-icon .pxl-cursor--icon { transform: scale(1); } .pxl-cursor.is-active.has-icon .pxl-cursor--icon:before { content: "\f10e"; font-family: "Caseicon"; font-size: 24px; color: #fff; } .pxl-cursor.is-active.has-icon-right .pxl-cursor--icon { transform: scale(1); } .pxl-cursor.is-active.has-icon-right .pxl-cursor--icon:before { content: "\f142"; font-family: "Caseicon"; font-size: 22px; color: #fff; } .pxl-cursor.is-active.has-icon-left .pxl-cursor--icon { transform: scale(1); } .pxl-cursor.is-active.has-icon-left .pxl-cursor--icon:before { content: "\f142"; font-family: "Caseicon"; font-size: 22px; color: #fff; transform: scaleX(-1); } .pxl-cursor.is-active.has-remove { opacity: 0; } .pxl-cursor.is-active-section .pxl-cursor--follower { opacity: 0; -webkit-transform: scale(0); -khtml-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); } .pxl-cursor.drag-style1 .pxl-cursor--drag { background-color: #fff; height: 135px; width: 135px; line-height: 135px; color: #000; } .pxl-cursor.drag-style1 .pxl-cursor--drag:before, .pxl-cursor.drag-style1 .pxl-cursor--drag:after { font-size: 12px; } .elementor-editor-active.page-template-default { /* Section Overlay Image */ } .elementor-editor-active.page-template-default #pxl-content-area { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .elementor-editor-active.page-template-default #pxl-sidebar-area { display: none; } .pxl-section-overlay-image { /* End Section Overlay Image */ } .pxl-section-overlay-image .pxl-overlay--image { position: absolute; top: 0; left: 0; bottom: 0; right: 0; width: 100%; } .pxl-section-overlay-image .pxl-overlay--image.pxl-overlay--imageLeft { right: auto; } .pxl-section-overlay-image .pxl-overlay--image.pxl-overlay--imageRight { right: 0; left: auto; } .pxl-section-overlay-image .pxl-overlay--image .bg-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .pxl-section-overlay-image.pxl-custom--bgposition .pxl-overlay--image { right: 140px; left: 46%; } @media screen and (max-width: 1024px) { .pxl-section-overlay-image.pxl-custom--bgposition .pxl-overlay--image { display: none; } } .pxl-section-effect-images { position: absolute; top: 0; left: 0; bottom: 0; right: 0; } .pxl-section-effect-images .pxl-image__item { position: absolute; } body.rtl { /* Start Page Popup */ } body.rtl .pxl-cursor.is-active.has-icon .pxl-cursor--icon:before { content: "\f111"; } body.rtl .pxl-cursor.is-active.has-icon-right .pxl-cursor--icon:before { content: "\f110"; } .pxl-popup--page { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999; background-color: rgba(0, 0, 0, 0.6); display: flex; flex-wrap: wrap; align-content: center; justify-content: center; padding: 60px 0; -webkit-transition: all 200ms linear 0ms; -khtml-transition: all 200ms linear 0ms; -moz-transition: all 200ms linear 0ms; -ms-transition: all 200ms linear 0ms; -o-transition: all 200ms linear 0ms; transition: all 200ms linear 0ms; opacity: 0; visibility: hidden; -webkit-transform: scale(0.85); -khtml-transform: scale(0.85); -moz-transform: scale(0.85); -ms-transform: scale(0.85); -o-transform: scale(0.85); transform: scale(0.85); } .pxl-popup--page.active { opacity: 1; visibility: visible; -webkit-transform: scale(1); -khtml-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } .pxl-popup--page .pxl-popup__conent { overflow-x: hidden; overflow-y: scroll; max-height: 80vh; } .pxl-popup--page .pxl-popup__close { position: absolute; top: 30px; right: 30px; } .pxl-popup--page .pxl-popup__close .pxl-close { border-width: 0px; } @media screen and (max-width: 1400px) { .pxl-popup--page .pxl-popup__close { top: 20px; right: 20px; } .pxl-popup--page .pxl-popup__close .pxl-close { border-width: 3px; } } .admin-bar .pxl-popup--page { top: 32px; /* End Page Popup */ /* Waves Animation */ } @media screen and (max-width: 782px) { .admin-bar .pxl-popup--page { top: 46px; } } @media screen and (max-width: 600px) { .admin-bar .pxl-popup--page { top: 0; } } .pxl-section-waves1 { position: absolute; width: 100%; height: 140px; bottom: 0px; } @media screen and (max-width: 767px) { .pxl-section-waves1 { height: 80px; } } .pxl-wave-parallax>use { animation: pxl-move-forever 25s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite; fill: #ebeef6; } .pxl-wave-parallax>use:nth-child(1) { animation-delay: -2s; animation-duration: 7s; opacity: 0.5; } .pxl-wave-parallax>use:nth-child(2) { animation-delay: -3s; animation-duration: 10s; opacity: 0.4; } .pxl-wave-parallax>use:nth-child(3) { animation-delay: -4s; animation-duration: 13s; opacity: 0.3; } .pxl-wave-parallax>use:nth-child(4) { animation-delay: -5s; animation-duration: 20s; } @keyframes pxl-move-forever { 0% { transform: translate3d(-90px, 0, 0); } 100% { transform: translate3d(85px, 0, 0); } } @media (min-width: 768px) and (max-width: 1024px) { body:not(.elementor-editor-active) .elementor .elementor-hidden-tablet { position: absolute; visibility: hidden; opacity: 0; display: block !important; text-indent: -99999px; } } @media screen and (max-width: 767px) { /* Section Parallax */ body:not(.elementor-editor-active) .elementor .elementor-hidden-mobile { position: absolute; visibility: hidden; opacity: 0; display: block !important; text-indent: -99999px; top: 0; left: 0; } } .pxl-section-bg-parallax, .pxl-column-bg-parallax { background-repeat: no-repeat; background-size: cover; top: 0; right: 0; bottom: 0; left: 0; position: absolute; } body:not(.elementor-editor-active) .pxl-section-parallax-overflow>.elementor-background-overlay { z-index: 2; } body:not(.elementor-editor-active) .pxl-section-parallax-overflow>.elementor-background-overlay+.pxl-section-bg-parallax, body:not(.elementor-editor-active) .pxl-section-parallax-overflow>.elementor-background-overlay .pxl-column-bg-parallax { z-index: 1; } body:not(.elementor-editor-active) .pxl-section-parallax-overflow.elementor-top-section>.elementor-container { z-index: 3; } .pxl-section-parallax-overflow, .pxl-section-overflow-hidden { overflow: hidden !important; } .elementor-column.pxl-column-overflow-hidden-yes { overflow: hidden !important; } .pxl-zoom-point-true { z-index: 1; } .pxl-zoom-point-wrap { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; } .pxl-zoom-point { width: 240px; height: 240px; position: absolute; z-index: -1; right: 0; top: -240px; margin: auto; left: 0; } .pxl-zoom-point .pxl-item--overlay { width: 100%; height: 100%; background-color: #151a25; z-index: -1; -webkit-border-radius: 240px; -khtml-border-radius: 240px; -moz-border-radius: 240px; -ms-border-radius: 240px; -o-border-radius: 240px; border-radius: 240px; -webkit-transition: all 0.25s cubic-bezier(0.3, 0.3, 0, 0.8); -khtml-transition: all 0.25s cubic-bezier(0.3, 0.3, 0, 0.8); -moz-transition: all 0.25s cubic-bezier(0.3, 0.3, 0, 0.8); -ms-transition: all 0.25s cubic-bezier(0.3, 0.3, 0, 0.8); -o-transition: all 0.25s cubic-bezier(0.3, 0.3, 0, 0.8); transition: all 0.25s cubic-bezier(0.3, 0.3, 0, 0.8); } @keyframes px_bouncedelay { 0%, 80%, 100% { -webkit-transform: scale(0); transform: scale(0); } 40% { -webkit-transform: scale(1); transform: scale(1); } } .pxl-loader:not(.style-3) { background-color: #fff; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 999999; } .pxl-loader:not(.style-3).is-loaded { opacity: 0; visibility: hidden; } .pxl-loader:not(.style-3).style-1 .pxl-loader-spinner { position: absolute; left: 0; right: 0; margin: auto; top: 50%; -webkit-transform: translate(0, -50%); -khtml-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); width: 70px; text-align: center; } .pxl-loader:not(.style-3).style-1 .pxl-loader-spinner>div { width: 18px; height: 18px; background-color: var(--primary-color); -webkit-border-radius: 100%; -khtml-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; display: inline-block; -webkit-animation: px_bouncedelay 1.4s infinite ease-in-out both; animation: px_bouncedelay 1.4s infinite ease-in-out both; } .pxl-loader:not(.style-3).style-1 .pxl-loader-spinner .pxl-loader-bounce1 { -webkit-animation-delay: -0.32s; animation-delay: -0.32s; } .pxl-loader:not(.style-3).style-1 .pxl-loader-spinner .pxl-loader-bounce2 { -webkit-animation-delay: -0.16s; animation-delay: -0.16s; } .pxl-loader:not(.style-3).style-2 { background-color: #000; } .pxl-loader:not(.style-3).style-2 .loader-circle { width: 120px; height: 120px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1); border-radius: 100%; direction: ltr; } .pxl-loader:not(.style-3).style-2 .loader-line-mask { position: absolute; left: 50%; top: 50%; width: 30px; height: 120px; margin-left: -60px; margin-top: -60px; overflow: hidden; transform-origin: 60px 60px; animation: pxl_spin 1.2s infinite linear; } .pxl-loader:not(.style-3).style-2 .loader-line-mask .loader-line { width: 120px; height: 120px; border-radius: 50%; background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.44)), to(rgba(255, 255, 255, 0))); background-image: -webkit-linear-gradient(to bottom, rgba(255, 255, 255, 0.44), rgba(255, 255, 255, 0)); background-image: -moz-linear-gradient(to bottom, rgba(255, 255, 255, 0.44), rgba(255, 255, 255, 0)); background-image: -ms-linear-gradient(to bottom, rgba(255, 255, 255, 0.44), rgba(255, 255, 255, 0)); background-image: -o-linear-gradient(to bottom, rgba(255, 255, 255, 0.44), rgba(255, 255, 255, 0)); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.44), rgba(255, 255, 255, 0)); filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='rgba(255, 255, 255, 0.44)', endColorStr='rgba(255, 255, 255, 0)'); background-color: transparent; position: relative; } .pxl-loader:not(.style-3).style-2 .loader-line-mask .loader-line:before { content: ''; position: absolute; top: 1px; left: 1px; right: 1px; bottom: 1px; background-color: #000; z-index: 99; border-radius: inherit; } .pxl-loader:not(.style-3).style-2 .loader-logo { position: absolute; top: 50%; transform: translate(0%, -50%); left: 0; right: 0; text-align: center; display: flex; justify-content: center; } .pxl-loader:not(.style-3).style-2 .loader-logo img { height: 42px; width: auto; opacity: 0.87; } @media screen and (max-width: 575px) { .pxl-loader:not(.style-3).style-2 .loader-logo img { height: 32px; } } .elementor>.pin-spacer { width: 100% !important; } .elementor>.pin-spacer>.elementor-container { max-width: 100% !important; width: 100% !important; left: 0 !important; } .elementor-editor-active #pxl-loadding { display: none !important; } .elementor-editor-active .pin-spacer>.elementor-element { position: static !important; height: auto !important; max-height: 100% !important; } .pxl-section-fix-bottom { z-index: 999; } .scroll-top-active>.elementor-container { top: 0; left: 0; position: relative; } @media screen and (max-width: 1260px) { .pxl-section-fix-bottom .pxl-section-overlay-color { left: 0 !important; right: 0 !important; } } @media screen and (max-width: 1400px) { body:not(.elementor-editor-active) .pxl-hide-sr-lg { display: none !important; } } @media screen and (max-width: 1200px) { body:not(.elementor-editor-active) .pxl-hide-sr-md { display: none !important; } } @media screen and (max-width: 1200px) { .elementor-container .elementor-container { flex-wrap: wrap; } } .loader-dark #pxl-loadding { background-color: #000; } .loader-dark #pxl-loadding .pxl-loader-spinner>div { background-color: #fff; } .pxl-col-align-start>.elementor-widget-wrap { justify-content: flex-start; } .pxl-col-align-start .elementor-inner-section>.elementor-container { margin-left: 0; } .pxl-col-align-center>.elementor-widget-wrap { justify-content: center; } .pxl-col-align-end>.elementor-widget-wrap { justify-content: flex-end; } .pxl-col-align-end .elementor-inner-section>.elementor-container { margin-right: 0; } body.rtl .pxl-popup--hidden-panel { right: auto; left: 0; } body.rtl .pxl-popup--hidden-panel.pxl-pos-right { margin-right: 0; margin-left: -30px; } body.rtl .pxl-popup--hidden-panel.pxl-pos-right .pxl-popup__conent { right: auto; left: 0; transform: translateX(-100%); } body.rtl .pxl-popup--hidden-panel.active.pxl-pos-right .pxl-popup__conent { transform: translateX(0%); } body.rtl .pxl-scroll-top { right: auto; left: 40px; } body.rtl .pxl-popup--page .pxl-popup__close { right: auto; left: 30px; } .pxl-loader.style-3 .preloader { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 999999; opacity: 1; visibility: visible; pointer-events: none; } .pxl-loader.style-3 .preloader.loaded { opacity: 0; visibility: hidden; } .pxl-loader.style-3 .preloader.loader-style3 { overflow: hidden; } .pxl-loader.style-3 .preloader.loader-style3 .line { position: absolute; top: 50%; left: 0; width: 0; height: 1px; transform: translateY(-50%); background-color: #fff; opacity: 1; transition: width 1.5s ease, opacity 0.25s linear 1.25s; z-index: 9; } .pxl-loader.style-3 .preloader.loader-style3 .split { position: absolute; left: 0; width: 100%; height: calc(50% + 1px); background-color: #000; transition: transform 1.5s ease 1.5s; z-index: 1; } .pxl-loader.style-3 .preloader.loader-style3 .split.top { top: 0; } .pxl-loader.style-3 .preloader.loader-style3 .split.bottom { bottom: 0; } .pxl-loader.style-3 .preloader.loader-style3.loading { opacity: 1; visibility: visible; } .pxl-loader.style-3 .preloader.loader-style3.loading .line { width: 100%; opacity: 0; } .pxl-loader.style-3 .preloader.loader-style3.loading .split.top { transform: translateY(-100%); } .pxl-loader.style-3 .preloader.loader-style3.loading .split.bottom { transform: translateY(100%); } .pxl-loader.style-3 .preloader.loader-style3.loaded { opacity: 0; visibility: hidden; } .fs-body, .pxl-cinfo__layout-2 ul li, .pxl-icon-box-carousel -desc.pxl-icon-box__item { font-size: 16px; font-weight: 400; line-height: 1.35; letter-spacing: -0.32px; } .fs-8 { font-size: 8px; font-style: normal; font-weight: 500; line-height: 1.2; } .fs-10 { font-size: 10px; font-weight: 500; line-height: 1.4; letter-spacing: -0.2px; } .fs-12, .pxl-progressbar__layout-1 .pxl-progressbar__item { font-size: 12px; font-weight: 400; line-height: 1.2; letter-spacing: -0.24px; } .fs-14, .pxl-grid__filter.style-2 .filter-item, .pxl-template-grid .pxl-grid__item-inner .pxl-grid__item-tags a, .pxl-blog-grid--layout-1 .pxl-grid__item-inner .pxl-grid__item-date, .pxl-pricing__style-4 .pxl-pricing__top .pxl-pricing__popular, .pxl-pricing__style-4 .pxl-pricing__top -period.pxl-pricing__price, .pxl-pricing__style-5 .pxl-pricing__option, .pxl-cinfo__layout-2 ul li span.pxl-cinfo__item-gray, .pxl-image-box--layout-1 .pxl-image-box__content .pxl-image-box__position, .error404 .error-cnt__left .error-cnt__slg { font-size: 14px; font-weight: 500; line-height: 1.3; letter-spacing: -0.28px; } .fs-18, .pxl-blog-grid--layout-1 .pxl-grid__item-inner .pxl-grid__item-title, .pxl-link__default .pxl-link__title { font-size: 18px; font-weight: 500; line-height: 1.35; letter-spacing: -0.36px; } .fs-20, .pxl-template-grid .pxl-grid__item-inner .pxl-grid__item-title, .pxl-banner-box__style-9 .pxl-banner-box__top .pxl-banner-box__title { font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.8px; } .flex-center { display: flex; justify-content: center; } .flex-center__col { display: flex; justify-content: center; } .flex-middle { display: flex; justify-content: center; align-items: center; } .abs-center__top { position: absolute; top: 50%; transform: translate(0, -50%); } .abs-center__left { position: absolute; left: 50%; transform: translate(-50%, 0); } .abs-middle, .pxl-scroll-top .pxl-scroll__arrow, __linear-blur.pxl-button { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .pxl-hide { display: none; } .pxl-star { position: absolute; width: 100%; height: 100%; top: 0; left: 0; display: block; opacity: 0; transition: opacity 1s ease; } .pxl-star .dot { position: absolute; width: 2px; height: 2px; background: #fff; border-radius: 50%; box-shadow: 0 0 3px rgba(255, 255, 255, 0.5); transition: opacity 0.5s ease; } @media (min-width: 1201px) { .pxl-hide-xl { display: none; } } #pxl-header-default { position: relative; z-index: 999; background-color: #fff; /* Header Elementor */ } #pxl-header-default .row { align-items: center; } @media screen and (min-width: 1201px) { #pxl-header-default .row>div { padding: 0 16px; } } #pxl-header-default .container { max-width: 1312px; } #pxl-header-default .pxl-header-branding { display: flex; align-items: center; flex-grow: 1; } #pxl-header-default .pxl-header-branding a { display: inline-flex; } #pxl-header-default .pxl-header-branding img { height: 47px; max-width: inherit; } #pxl-header-default #pxl-nav-mobile { display: none; } @media screen and (min-width: 1201px) { #pxl-header-elementor { min-height: 0px !important; position: relative; z-index: 1001; } #pxl-header-elementor .col-12 { min-height: 0px; } } #pxl-header-elementor #pxl-header-mobile { display: none; } #pxl-header-elementor .pxl-header-elementor-main { position: relative; z-index: 999; } #pxl-header-elementor .pxl-header-elementor-sticky { position: fixed; top: 0; left: 0; right: 0; z-index: 999; top: 0; -webkit-transform: translateY(-120%); -khtml-transform: translateY(-120%); -moz-transform: translateY(-120%); -ms-transform: translateY(-120%); -o-transform: translateY(-120%); transform: translateY(-120%); -webkit-transition: 0.6s cubic-bezier(0.24, 0.74, 0.58, 1); -khtml-transition: 0.6s cubic-bezier(0.24, 0.74, 0.58, 1); -moz-transition: 0.6s cubic-bezier(0.24, 0.74, 0.58, 1); -ms-transition: 0.6s cubic-bezier(0.24, 0.74, 0.58, 1); -o-transition: 0.6s cubic-bezier(0.24, 0.74, 0.58, 1); transition: 0.6s cubic-bezier(0.24, 0.74, 0.58, 1); visibility: hidden; } #pxl-header-elementor .pxl-header-elementor-sticky.pxl-header-fixed { -webkit-transform: translateY(0%); -khtml-transform: translateY(0%); -moz-transform: translateY(0%); -ms-transform: translateY(0%); -o-transform: translateY(0%); transform: translateY(0%); visibility: visible; } #pxl-header-elementor.pxl-header-rmboxshadow .pxl-header-elementor-sticky.pxl-header-fixed { -webkit-box-shadow: none; -khtml-box-shadow: none; -moz-box-shadow: none; -ms-box-shadow: none; -o-box-shadow: none; box-shadow: none; } #pxl-header-elementor.pxl-header-rmboxshadow .pxl-header-elementor-sticky.pxl-header-fixed .pxl-logo-nav { -webkit-box-shadow: 0 3px 18px rgba(2, 21, 78, 0.09); -khtml-box-shadow: 0 3px 18px rgba(2, 21, 78, 0.09); -moz-box-shadow: 0 3px 18px rgba(2, 21, 78, 0.09); -ms-box-shadow: 0 3px 18px rgba(2, 21, 78, 0.09); -o-box-shadow: 0 3px 18px rgba(2, 21, 78, 0.09); box-shadow: 0 3px 18px rgba(2, 21, 78, 0.09); } #pxl-header-elementor .px-header--transparent { position: absolute; top: 0; left: 0; right: 0; width: 100%; z-index: 999; } #pxl-header-elementor .elementor-container .elementor-container, #pxl-header-elementor .elementor-inner-section, #pxl-header-elementor .elementor-widget:not(.elementor-absolute), #pxl-header-elementor .elementor-widget-wrap, #pxl-header-elementor .elementor-column, #pxl-header-elementor .elementor-column-wrap { position: static; } .pxl-header-mobile-elementor { opacity: 0; /* Header Menu */ } .pxl-header-mobile-elementor.px-header--transparent { position: absolute; top: 0; left: 0; right: 0; width: 100%; z-index: 999; } @media screen and (min-width: 1201px) { /* Header Tablet/Mobile */ .pxl-menu.pxl-menu__mega-boxed .pxl-megamenu>.sub-menu { max-width: 1280px; } .pxl-menu.pxl-menu__mega-boxed .pxl-megamenu>.sub-menu .pxl-mega-menu-elementor { border-radius: 16px; } .pxl-menu__primary { list-style: none; margin: 0; padding: 0; } .pxl-menu__primary.pxl-primary-menu-not-set>li>a { line-height: 104px; } .pxl-menu__primary ul { list-style: none; margin: 0; } .pxl-menu__primary li { position: relative; color: var(--primary-color); } .pxl-menu__primary li a { font-size: 15px; color: var(--primary-color); position: relative; font-weight: 500; } .pxl-menu__primary>li { display: inline-block; vertical-align: middle; margin: 0 20px; } .pxl-menu__primary>li>a { line-height: 104px; font-size: 16px; font-weight: 400; color: var(--primary-color); display: flex; align-items: center; justify-content: space-between; gap: 8px; } .pxl-menu__primary>li.menu-item-has-children>a { display: flex; align-items: center; justify-content: center; gap: 7.5px; } .pxl-menu__primary>li.menu-item-has-children>a>i { font-size: 10px; display: inline-flex; transition: all 0.3s ease; } .pxl-menu__primary>li.menu-item-has-children:hover>a>i { transform: scaleY(-1); } .pxl-menu__primary .sub-menu, .pxl-menu__primary .children { position: absolute; top: 100%; left: 0; background-color: #fff; margin-top: 30px; margin-bottom: 0; min-width: 235px; z-index: 99; visibility: hidden; opacity: 0; -webkit-box-shadow: 0 15px 30px 0px rgba(0, 0, 0, .14); -khtml-box-shadow: 0 15px 30px 0px rgba(0, 0, 0, .14); -moz-box-shadow: 0 15px 30px 0px rgba(0, 0, 0, .14); -ms-box-shadow: 0 15px 30px 0px rgba(0, 0, 0, .14); -o-box-shadow: 0 15px 30px 0px rgba(0, 0, 0, .14); box-shadow: 0 15px 30px 0px rgba(0, 0, 0, .14); transition: all 300ms linear 0ms; transform-origin: 0 0 0; text-align: left; padding: 18px 0; border-radius: 8px; } .pxl-menu__primary .sub-menu li, .pxl-menu__primary .children li { white-space: nowrap; } .pxl-menu__primary .sub-menu li a, .pxl-menu__primary .children li a { padding: 10px 30px; display: flex; align-items: center; justify-content: space-between; } .pxl-menu__primary .sub-menu li a .pxl-menu__text, .pxl-menu__primary .children li a .pxl-menu__text { display: flex; align-items: center; } .pxl-menu__primary .sub-menu li a .pxl-menu__text:before, .pxl-menu__primary .children li a .pxl-menu__text:before { content: ''; display: block; width: 0px; height: 2px; background-color: var(--primary-color); transition: all 0.3s ease; margin-right: 0px; } .pxl-menu__primary .sub-menu li>a:hover, .pxl-menu__primary .children li>a:hover, .pxl-menu__primary .sub-menu li.current_page_item>a, .pxl-menu__primary .children li.current_page_item>a, .pxl-menu__primary .sub-menu li.current-menu-item>a, .pxl-menu__primary .children li.current-menu-item>a, .pxl-menu__primary .sub-menu li.current_page_ancestor>a, .pxl-menu__primary .children li.current_page_ancestor>a, .pxl-menu__primary .sub-menu li.current-menu-ancestor>a, .pxl-menu__primary .children li.current-menu-ancestor>a { color: var(--primary-color); } .pxl-menu__primary .sub-menu li>a:hover .pxl-menu__text:before, .pxl-menu__primary .children li>a:hover .pxl-menu__text:before, .pxl-menu__primary .sub-menu li.current_page_item>a .pxl-menu__text:before, .pxl-menu__primary .children li.current_page_item>a .pxl-menu__text:before, .pxl-menu__primary .sub-menu li.current-menu-item>a .pxl-menu__text:before, .pxl-menu__primary .children li.current-menu-item>a .pxl-menu__text:before, .pxl-menu__primary .sub-menu li.current_page_ancestor>a .pxl-menu__text:before, .pxl-menu__primary .children li.current_page_ancestor>a .pxl-menu__text:before, .pxl-menu__primary .sub-menu li.current-menu-ancestor>a .pxl-menu__text:before, .pxl-menu__primary .children li.current-menu-ancestor>a .pxl-menu__text:before { width: 20px; margin-right: 10px; } .pxl-menu__primary .sub-menu li.menu-item-has-children>a, .pxl-menu__primary .children li.menu-item-has-children>a { display: flex; justify-content: space-between; } .pxl-menu__primary .sub-menu li.menu-item-has-children>a>i, .pxl-menu__primary .children li.menu-item-has-children>a>i { transform: rotate(-90deg) translateY(10px); display: inline-flex; font-size: 10px; } .pxl-menu__primary .sub-menu.pxl-sub-reverse, .pxl-menu__primary .children.pxl-sub-reverse { left: auto; right: 0; } .pxl-menu__primary .sub-menu .sub-menu, .pxl-menu__primary .children .sub-menu, .pxl-menu__primary .sub-menu .children, .pxl-menu__primary .children .children { top: 0; left: 100%; } .pxl-menu__primary .sub-menu .sub-menu.pxl-sub-reverse, .pxl-menu__primary .children .sub-menu.pxl-sub-reverse, .pxl-menu__primary .sub-menu .children.pxl-sub-reverse, .pxl-menu__primary .children .children.pxl-sub-reverse { left: auto; right: 100%; } .pxl-menu__primary li:hover>.sub-menu, .pxl-menu__primary li:hover>.children { visibility: visible; opacity: 1; margin-top: 0; } .pxl-menu__primary .sub-menu li:hover>.sub-menu { margin-top: -18px; } .pxl-menu__primary .pxl-megamenu { position: static; } .pxl-menu__primary .pxl-megamenu>.sub-menu { padding: 20px 0; max-width: 100%; margin-left: auto; margin-right: auto; left: 0; right: 0; padding: 0; border-radius: 16px; overflow: hidden; } .pxl-menu__primary .pxl-megamenu>.sub-menu+.sub-menu { display: none; } .pxl-menu__primary .pxl-megamenu>.sub-menu a { color: #fff; } .pxl-menu-toggle { display: none; } .pxl-menu.divider-move { border-radius: 50px; position: relative; } .pxl-menu.divider-move::before { content: ''; position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 100%; height: 48px; background-color: #191919; border-radius: 50px; z-index: -1; } .pxl-menu.divider-move .pxl-menu__divider { height: 32px; border-radius: 34px; border: 0.6px solid rgba(255, 255, 255, 0.24); background: #333; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1); position: absolute; top: 50%; transform: translateY(-50%); transition: all 300ms linear 0ms; opacity: 0; z-index: -1; } .pxl-menu.divider-move .pxl-menu__divider+.pxl-divider-move { display: none; } .pxl-menu.divider-move .pxl-menu__divider.active { opacity: 1; } .pxl-menu.divider-move .pxl-menu__primary { padding: 8px; } .pxl-menu.divider-move .pxl-menu__primary .pxl-megamenu>.sub-menu { position: absolute; z-index: 2; left: 50%; right: unset; min-width: 1320px; transform: translate(-50%, -5px); max-width: unset; } .pxl-menu.divider-move .pxl-menu__primary>li { margin: 0; } .pxl-menu.divider-move .pxl-menu__primary>li>a { padding: 0 20px; color: #a4a7ae; } .pxl-menu.divider-move .pxl-menu__primary>li>a:hover { color: #fff; } } @media screen and (max-width: 1200px) { #pxl-header-default, #pxl-header-elementor { position: relative; background-color: #fff; } #pxl-header-default .pxl-header-main, #pxl-header-elementor .pxl-header-main { position: relative; } #pxl-header-default .pxl-header-branding, #pxl-header-elementor .pxl-header-branding { margin: 15px; min-height: 50px; align-items: center; display: flex; } #pxl-header-default .pxl-header-branding img, #pxl-header-elementor .pxl-header-branding img { height: 33px; } #pxl-header-default #pxl-nav-mobile, #pxl-header-elementor #pxl-nav-mobile { display: block; position: absolute; top: 50%; right: 15px; -webkit-transform: translate(0, -50%); -khtml-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); display: flex; flex-wrap: wrap; align-items: center; } #pxl-header-default #pxl-nav-mobile .pxl-mobile-meta-item, #pxl-header-elementor #pxl-nav-mobile .pxl-mobile-meta-item { margin-left: 10px; } .pxl-header-menu-backdrop { z-index: 998; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); -webkit-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -khtml-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -moz-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -ms-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); opacity: 0; visibility: hidden; } .pxl-header-menu { position: fixed; height: 100vh; width: 300px; top: 0; left: 0; bottom: 0; margin: 0; overflow: hidden; z-index: 999; -webkit-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -khtml-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -moz-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -ms-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -webkit-transform: translateX(-100%); -khtml-transform: translateX(-100%); -moz-transform: translateX(-100%); -ms-transform: translateX(-100%); -o-transform: translateX(-100%); transform: translateX(-100%); visibility: hidden; -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.08); -khtml-box-shadow: 0 0 15px rgba(0, 0, 0, 0.08); -moz-box-shadow: 0 0 15px rgba(0, 0, 0, 0.08); -ms-box-shadow: 0 0 15px rgba(0, 0, 0, 0.08); -o-box-shadow: 0 0 15px rgba(0, 0, 0, 0.08); box-shadow: 0 0 15px rgba(0, 0, 0, 0.08); background-color: #fff; overflow-y: scroll; } .pxl-header-menu.active { visibility: visible; opacity: 1; -webkit-transform: translateX(0%); -khtml-transform: translateX(0%); -moz-transform: translateX(0%); -ms-transform: translateX(0%); -o-transform: translateX(0%); transform: translateX(0%); } .pxl-header-menu.active+.pxl-header-menu-backdrop { opacity: 1; visibility: visible; } .pxl-header-menu-scroll { padding: 40px 35px; } .pxl-menu-toggle { position: absolute; top: 10px; height: 28px; line-height: 28px; text-align: center; right: 0px; width: 28px; cursor: pointer; font-size: 10px; -webkit-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -khtml-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -moz-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -ms-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); color: #1b1b1b; -webkit-border-radius: 3px; -khtml-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; background-color: rgba(0, 0, 0, 0.03); } .pxl-menu-toggle:before { content: "\f150"; font-family: "Caseicon"; } .pxl-menu-toggle.active:before { content: "\f13d"; } .pxl-menu__primary { list-style: none; margin: 0; padding: 0; } .pxl-menu__primary li.menu-item, .pxl-menu__primary li.pxl-item-link { position: relative; } .pxl-menu__primary li.menu-item>a, .pxl-menu__primary li.pxl-item-link>a { display: block; line-height: 46px; color: #000; font-size: 15px; font-weight: 400; border-bottom: 1px solid rgba(0, 0, 0, 0.06); } .pxl-menu__primary li.menu-item>a:hover, .pxl-menu__primary li.pxl-item-link>a:hover, .pxl-menu__primary li.menu-item>a.current, .pxl-menu__primary li.pxl-item-link>a.current, .pxl-menu__primary li.menu-item.current_page_item>a, .pxl-menu__primary li.pxl-item-link.current_page_item>a, .pxl-menu__primary li.menu-item.current-menu-item>a, .pxl-menu__primary li.pxl-item-link.current-menu-item>a, .pxl-menu__primary li.menu-item.current_page_ancestor>a, .pxl-menu__primary li.pxl-item-link.current_page_ancestor>a, .pxl-menu__primary li.menu-item.current-menu-ancestor>a, .pxl-menu__primary li.pxl-item-link.current-menu-ancestor>a { color: var(--primary-color); } .pxl-menu__primary .sub-menu, .pxl-menu__primary .children { position: relative; display: none; list-style: none; margin: 0; padding: 0; } .pxl-menu__primary .sub-menu li a, .pxl-menu__primary .children li a { font-weight: 500; padding-left: 14px; } .pxl-menu__primary>li>.sub-menu>li>.sub-menu>li a { padding-left: 28px; } .pxl-logo-mobile { margin-bottom: 35px; } .pxl-logo-mobile img { height: 42px; } .pxl-logo-mobile .pxl-logo--light { display: none; } .pxl-header-mobile-search { margin-bottom: 20px; } .pxl-header-mobile-search form { position: relative; } .pxl-header-mobile-search .searchform-wrap { position: relative; } .pxl-header-mobile-search .searchform-wrap img { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); width: 20px; } .pxl-header-mobile-search .search-field { height: 44px; border: none; padding: 0 22px 0 35px; background-color: #f8f8f8; } .pxl-header-mobile-search .search-submit { position: absolute; top: 0; right: 5px; -webkit-border-radius: 0px; -khtml-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; line-height: 44px; padding: 0; width: 44px; height: 44px; line-height: 44px; background: var(--primary-color); display: flex; align-items: center; justify-content: center; border: none; } .pxl-header-mobile-search .search-submit svg { width: 16px; height: 16px; } .pxl-menu-close { background-color: var(--primary-color); position: absolute; top: 0; right: 0; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 0px; -khtml-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; } .pxl-menu-close:before, .pxl-menu-close:after { content: ''; display: block; width: 50%; height: 2px; background-color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .pxl-menu-close:before { transform: translate(-50%, -50%) rotate(45deg); } .pxl-menu-close:after { transform: translate(-50%, -50%) rotate(-45deg); } #pxl-header-elementor .pxl-header-elementor-main, #pxl-header-elementor .pxl-header-elementor-sticky { /* display: none; */ } #pxl-header-elementor #pxl-header-mobile { display: block; position: relative; z-index: 999; } #pxl-header-elementor #pxl-header-mobile.style-dark { background-color: #0b0c10; } #pxl-header-elementor #pxl-header-mobile.style-dark .pxl-logo-mobile .pxl-logo--dark { display: none; } #pxl-header-elementor #pxl-header-mobile.style-dark .pxl-logo-mobile .pxl-logo--light { display: block; } #pxl-header-elementor #pxl-header-mobile.style-dark.pxl-header-mobile-fixed { background-color: #0b0c10; } #pxl-header-elementor #pxl-header-mobile.style-dark .pxl-nav-mobile-button .pxl-icon-line:after, #pxl-header-elementor #pxl-header-mobile.style-dark .pxl-nav-mobile-button .pxl-icon-line:before { background-color: #fff; } #pxl-header-elementor #pxl-header-mobile.style-dark .pxl-header-menu { background-color: #000; } #pxl-header-elementor #pxl-header-mobile.style-dark .pxl-header-mobile-search .search-field { background-color: rgba(255, 255, 255, 0.12); border-color: rgba(255, 255, 255, 0.12); color: rgba(255, 255, 255, 0.67); } #pxl-header-elementor #pxl-header-mobile.style-dark .pxl-header-mobile-search .search-field:focus { color: #fff; } #pxl-header-elementor #pxl-header-mobile.style-dark .pxl-header-mobile-search .search-submit { color: rgba(255, 255, 255, 0.8); font-size: 14px; } #pxl-header-elementor #pxl-header-mobile.style-dark .pxl-menu__primary li a { color: rgba(255, 255, 255, 0.8); border-color: rgba(255, 255, 255, 0.08); } #pxl-header-elementor #pxl-header-mobile.style-dark .pxl-menu__primary li>a:hover, #pxl-header-elementor #pxl-header-mobile.style-dark .pxl-menu__primary li>a.current, #pxl-header-elementor #pxl-header-mobile.style-dark .pxl-menu__primary li.current_page_item>a, #pxl-header-elementor #pxl-header-mobile.style-dark .pxl-menu__primary li.current-menu-item>a, #pxl-header-elementor #pxl-header-mobile.style-dark .pxl-menu__primary li.current_page_ancestor>a, #pxl-header-elementor #pxl-header-mobile.style-dark .pxl-menu__primary li.current-menu-ancestor>a { color: #fff; } #pxl-header-elementor #pxl-header-mobile.style-dark .pxl-menu-close { background-color: rgba(255, 255, 255, 0.12); } #pxl-header-elementor #pxl-header-mobile.style-dark .pxl-menu-close:before, #pxl-header-elementor #pxl-header-mobile.style-dark .pxl-menu-close:after { background-color: #fff; } #pxl-header-elementor #pxl-header-mobile.style-dark .pxl-menu-toggle { background-color: rgba(255, 255, 255, 0.1); color: rgba(255, 255, 255, 0.8); } #pxl-header-elementor #pxl-header-mobile .pxl-header-sticky { position: fixed; left: 0; top: 0; right: 0; opacity: 0; visibility: hidden; } #pxl-header-elementor #pxl-header-mobile.pxl-header-mobile-fixed .pxl-header-sticky { visibility: visible; opacity: 1; -webkit-animation: 0.95s ease 0s normal forwards 1 running PXL_Header_SlideDown; -khtml-animation: 0.95s ease 0s normal forwards 1 running PXL_Header_SlideDown; -moz-animation: 0.95s ease 0s normal forwards 1 running PXL_Header_SlideDown; -ms-animation: 0.95s ease 0s normal forwards 1 running PXL_Header_SlideDown; -o-animation: 0.95s ease 0s normal forwards 1 running PXL_Header_SlideDown; animation: 0.95s ease 0s normal forwards 1 running PXL_Header_SlideDown; } } @media screen and (max-width: 767px) { /* Hidden Panel */ .pxl-header-menu { width: 100%; } } .pxl-popup--page .pxl-popup--close { position: absolute; right: 10px; top: 10px; cursor: pointer; z-index: 1000; } .pxl-popup--page .pxl-popup--close svg path { stroke: #fff; } .pxl-popup--hidden-panel { position: fixed; top: 0; right: 0; z-index: 99999; height: 100vh; width: 100%; visibility: hidden; } @media screen and (max-width: 1200px) { .pxl-popup--hidden-panel { display: none; } } .pxl-popup--hidden-panel .pxl-popup--overlay { z-index: -1; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(31, 32, 34, 0.76); opacity: 0; visibility: hidden; -webkit-transition: all 0.5s cubic-bezier(0.46, 0.03, 0.52, 0.96); -khtml-transition: all 0.5s cubic-bezier(0.46, 0.03, 0.52, 0.96); -moz-transition: all 0.5s cubic-bezier(0.46, 0.03, 0.52, 0.96); -ms-transition: all 0.5s cubic-bezier(0.46, 0.03, 0.52, 0.96); -o-transition: all 0.5s cubic-bezier(0.46, 0.03, 0.52, 0.96); transition: all 0.5s cubic-bezier(0.46, 0.03, 0.52, 0.96); cursor: pointer; } .pxl-popup--hidden-panel .elementor>.elementor-container { width: 100% !important; left: 0 !important; right: 0 !important; } .pxl-popup--hidden-panel .pxl-popup--conent { max-height: 100vh; overflow-y: auto; overflow-x: hidden; scrollbar-width: none; background-color: #fff; } .pxl-popup--hidden-panel.pxl-pos-top .pxl-popup--conent { position: absolute; height: 100%; width: 100%; top: 0; left: 0; -webkit-transition: all 0.5s cubic-bezier(0.46, 0.03, 0.52, 0.96); -khtml-transition: all 0.5s cubic-bezier(0.46, 0.03, 0.52, 0.96); -moz-transition: all 0.5s cubic-bezier(0.46, 0.03, 0.52, 0.96); -ms-transition: all 0.5s cubic-bezier(0.46, 0.03, 0.52, 0.96); -o-transition: all 0.5s cubic-bezier(0.46, 0.03, 0.52, 0.96); transition: all 0.5s cubic-bezier(0.46, 0.03, 0.52, 0.96); -webkit-transform: translateY(-100%); -khtml-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); } .pxl-popup--hidden-panel.pxl-pos-right .pxl-popup--conent { position: absolute; top: 0; right: 0; height: 100%; width: 470px; -webkit-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -khtml-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -moz-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -ms-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -webkit-transform: translateX(100%); -khtml-transform: translateX(100%); -moz-transform: translateX(100%); -ms-transform: translateX(100%); -o-transform: translateX(100%); transform: translateX(100%); padding: 60px 0; overflow-y: scroll; overflow-x: hidden; margin-right: -30px; } .pxl-popup--hidden-panel.active { visibility: visible; } .pxl-popup--hidden-panel.active .pxl-popup--conent { -webkit-transform: translateY(0%); -khtml-transform: translateY(0%); -moz-transform: translateY(0%); -ms-transform: translateY(0%); -o-transform: translateY(0%); transform: translateY(0%); transition-delay: 0s !important; } .pxl-popup--hidden-panel.active .pxl-popup--overlay { opacity: 1; visibility: visible; transition-delay: 0s !important; } .pxl-popup--hidden-panel.active .pxl-search-form .pxl-searchform-divider { webkit-animation-name: PXLfadeInMove; animation-name: PXLfadeInMove; -webkit-animation-duration: 0.7s; animation-duration: 0.7s; -webkit-animation-fill-mode: both; animation-fill-mode: both; visibility: visible; animation-delay: 0.8s; -webkit-animation-delay: 0.8s; } .pxl-popup--hidden-panel:not(.active) .pxl-search-form .pxl-searchform-divider { webkit-animation-name: PXLfadeOutMove; animation-name: PXLfadeOutMove; -webkit-animation-duration: 0.7s; animation-duration: 0.7s; -webkit-animation-fill-mode: both; animation-fill-mode: both; visibility: visible; } .pxl-anchor-divider { overflow: hidden; width: 30px; height: 21px; cursor: pointer; position: relative; } .pxl-anchor-divider .pxl-icon-line { height: 3px; position: absolute; right: 0; border-radius: 3px; } .pxl-anchor-divider .pxl-icon-line:before, .pxl-anchor-divider .pxl-icon-line:after { content: ''; position: absolute; height: 100%; top: 0; right: 0; bottom: 0; right: 0; background: #000; opacity: 1; width: 100%; -webkit-border-radius: 3px; -khtml-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; } .pxl-anchor-divider .pxl-icon-line:before { -webkit-transform: translate3d(100%, 0, 0); -khtml-transform: translate3d(100%, 0, 0); -moz-transform: translate3d(100%, 0, 0); -ms-transform: translate3d(100%, 0, 0); -o-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } .pxl-anchor-divider .pxl-icon-line:after { -webkit-transform: translate3d(0, 0, 0); -khtml-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .pxl-anchor-divider .pxl-icon-line.pxl-icon-line1 { top: 0; width: 22px; } .pxl-anchor-divider .pxl-icon-line.pxl-icon-line2 { top: 50%; width: 100%; transform: translate(0, -50%); } .pxl-anchor-divider .pxl-icon-line.pxl-icon-line3 { width: 16px; bottom: 0; } .pxl-anchor-button { cursor: pointer; } .pxl-anchor-button.style-2 { height: 46px; width: 46px; border-radius: 46px; border: 2px solid rgba(207, 207, 207, 0.45); background-color: rgba(83, 82, 84, 0.45); display: inline-flex; justify-content: center; align-items: center; } .pxl-anchor-button.style-2 .pxl-anchor-divider { height: 16px; width: 25px; } .pxl-anchor-button.style-2 .pxl-anchor-divider .pxl-icon-line { height: 2px; } .pxl-anchor-button.style-2 .pxl-anchor-divider .pxl-icon-line:before, .pxl-anchor-button.style-2 .pxl-anchor-divider .pxl-icon-line:after { background-color: #fff; } .pxl-anchor-button.style-2 .pxl-anchor-divider .pxl-icon-line.pxl-icon-line1 { width: 19px; } .pxl-anchor-button.style-2 .pxl-anchor-divider .pxl-icon-line.pxl-icon-line2 { top: 7px; } .pxl-anchor-button.style-2 .pxl-anchor-divider .pxl-icon-line.pxl-icon-line3 { width: 14px; } .pxl-anchor-button .pxl-anchor-theme-style1 { position: relative; width: 29px; height: 26px; cursor: pointer; } .pxl-anchor-button .pxl-anchor-theme-style1 span { position: absolute; width: 13px; height: 12px; border: 2px solid #141515; transition: all 300ms linear 0ms; } .pxl-anchor-button .pxl-anchor-theme-style1 span:nth-child(1) { top: 0; left: 0; border-radius: 13px 0 0 0; } .pxl-anchor-button .pxl-anchor-theme-style1 span:nth-child(2) { top: 0; right: 0; border-radius: 0 13px 0 0; } .pxl-anchor-button .pxl-anchor-theme-style1 span:nth-child(3) { bottom: 0; right: 0; border-radius: 0 0 13px 0; } .pxl-anchor-button .pxl-anchor-theme-style1 span:nth-child(4) { bottom: 0; left: 0; border-radius: 0 0 0 13px; } .pxl-anchor-button .pxl-anchor-theme-style1:hover span { border-color: var(--primary-color); } .pxl-anchor-button.type-icon { display: inline-flex; align-items: center; color: #2c2c2b; transition: all 300ms linear 0ms; } .pxl-anchor-button.type-icon:hover { color: var(--primary-color); } .pxl-anchor-button.type-icon label { font-size: 19px; font-weight: 600; cursor: pointer; } .pxl-anchor-button.type-icon i { font-size: 20px; } .pxl-anchor-divider:hover .pxl-icon-line.pxl-icon-line1:before, .pxl-anchor-button.type-menu-hidden:hover .pxl-icon-line.pxl-icon-line1:before, .pxl-menu-hidden-sidebar .pxl-menu-button:hover .pxl-icon-line.pxl-icon-line1:before { -webkit-transform: translate3d(0, 0, 0); -khtml-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; -webkit-transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 460ms, opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 460ms; -khtml-transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 460ms, opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 460ms; -moz-transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 460ms, opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 460ms; -ms-transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 460ms, opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 460ms; -o-transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 460ms, opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 460ms; transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 460ms, opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 460ms; } .pxl-anchor-divider:hover .pxl-icon-line.pxl-icon-line1:after, .pxl-anchor-button.type-menu-hidden:hover .pxl-icon-line.pxl-icon-line1:after, .pxl-menu-hidden-sidebar .pxl-menu-button:hover .pxl-icon-line.pxl-icon-line1:after { -webkit-transform: translate3d(-36px, 0, 0); -khtml-transform: translate3d(-36px, 0, 0); -moz-transform: translate3d(-36px, 0, 0); -ms-transform: translate3d(-36px, 0, 0); -o-transform: translate3d(-36px, 0, 0); transform: translate3d(-36px, 0, 0); opacity: 0; -webkit-transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 0s, opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 0s; -khtml-transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 0s, opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 0s; -moz-transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 0s, opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 0s; -ms-transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 0s, opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 0s; -o-transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 0s, opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 0s; transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 0s, opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 0s; } .pxl-anchor-divider:hover .pxl-icon-line.pxl-icon-line2:before, .pxl-anchor-button.type-menu-hidden:hover .pxl-icon-line.pxl-icon-line2:before, .pxl-menu-hidden-sidebar .pxl-menu-button:hover .pxl-icon-line.pxl-icon-line2:before { -webkit-transform: translate3d(0, 0, 0); -khtml-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; -webkit-transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 620ms, opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 620ms; -khtml-transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 620ms, opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 620ms; -moz-transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 620ms, opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 620ms; -ms-transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 620ms, opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 620ms; -o-transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 620ms, opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 620ms; transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 620ms, opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 620ms; } .pxl-anchor-divider:hover .pxl-icon-line.pxl-icon-line2:after, .pxl-anchor-button.type-menu-hidden:hover .pxl-icon-line.pxl-icon-line2:after, .pxl-menu-hidden-sidebar .pxl-menu-button:hover .pxl-icon-line.pxl-icon-line2:after { -webkit-transform: translate3d(-36px, 0, 0); -khtml-transform: translate3d(-36px, 0, 0); -moz-transform: translate3d(-36px, 0, 0); -ms-transform: translate3d(-36px, 0, 0); -o-transform: translate3d(-36px, 0, 0); transform: translate3d(-36px, 0, 0); opacity: 0; -webkit-transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 160ms, opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 160ms; -khtml-transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 160ms, opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 160ms; -moz-transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 160ms, opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 160ms; -ms-transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 160ms, opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 160ms; -o-transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 160ms, opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 160ms; transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 160ms, opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 160ms; } .pxl-anchor-divider:hover .pxl-icon-line.pxl-icon-line3:before, .pxl-anchor-button.type-menu-hidden:hover .pxl-icon-line.pxl-icon-line3:before, .pxl-menu-hidden-sidebar .pxl-menu-button:hover .pxl-icon-line.pxl-icon-line3:before { -webkit-transform: translate3d(0, 0, 0); -khtml-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; -webkit-transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 780ms, opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 780ms; -khtml-transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 780ms, opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 780ms; -moz-transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 780ms, opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 780ms; -ms-transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 780ms, opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 780ms; -o-transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 780ms, opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 780ms; transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 780ms, opacity 0.8s cubic-bezier(0.215, 0.61, 0.355, 1) 780ms; } .pxl-anchor-divider:hover .pxl-icon-line.pxl-icon-line3:after, .pxl-anchor-button.type-menu-hidden:hover .pxl-icon-line.pxl-icon-line3:after, .pxl-menu-hidden-sidebar .pxl-menu-button:hover .pxl-icon-line.pxl-icon-line3:after { -webkit-transform: translate3d(-36px, 0, 0); -khtml-transform: translate3d(-36px, 0, 0); -moz-transform: translate3d(-36px, 0, 0); -ms-transform: translate3d(-36px, 0, 0); -o-transform: translate3d(-36px, 0, 0); transform: translate3d(-36px, 0, 0); opacity: 0; -webkit-transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 320ms, opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 320ms; -khtml-transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 320ms, opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 320ms; -moz-transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 320ms, opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 320ms; -ms-transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 320ms, opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 320ms; -o-transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 320ms, opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 320ms; transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 320ms, opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) 320ms; } .admin-bar #pxl-header-elementor .pxl-header-elementor-sticky.pxl-header-fixed, .admin-bar #pxl-search-popup, .admin-bar .pxl-hidden-panel-popup { top: 32px; } @media screen and (max-width: 782px) { .admin-bar #pxl-header-elementor .pxl-header-elementor-sticky.pxl-header-fixed, .admin-bar #pxl-search-popup, .admin-bar .pxl-hidden-panel-popup { top: 46px; } } @media screen and (max-width: 600px) { .admin-bar #pxl-header-elementor .pxl-header-elementor-sticky.pxl-header-fixed, .admin-bar #pxl-search-popup, .admin-bar .pxl-hidden-panel-popup { top: 0; } } .admin-bar .pxl-header-menu { top: 32px; } @media screen and (max-width: 782px) { .admin-bar .pxl-header-menu { top: 46px; } } @-moz-keyframes PXL_Header_SlideDown { 0% { margin-top: -150px; } 100% { margin-top: 0; } } @-ms-keyframes PXL_Header_SlideDown { 0% { margin-top: -150px; } 100% { margin-top: 0; } } @-webkit-keyframes PXL_Header_SlideDown { 0% { margin-top: -150px; } 100% { margin-top: 0; } } @keyframes PXL_Header_SlideDown { /* Header Left Sidebar */ 0% { margin-top: -150px; } 100% { margin-top: 0; } } .px-header--left_sidebar.px-header-sidebar-style1, .px-header--left_sidebar.px-header--left_shadow { -webkit-box-shadow: 0px 0 18px rgba(109, 109, 109, 0.13); -khtml-box-shadow: 0px 0 18px rgba(109, 109, 109, 0.13); -moz-box-shadow: 0px 0 18px rgba(109, 109, 109, 0.13); -ms-box-shadow: 0px 0 18px rgba(109, 109, 109, 0.13); -o-box-shadow: 0px 0 18px rgba(109, 109, 109, 0.13); box-shadow: 0px 0 18px rgba(109, 109, 109, 0.13); } .px-header--left_sidebar.px-header-sidebar-style2 { overflow: hidden; } .px-header--left_sidebar.px-header-sidebar-style2 .pxl-header-content { overflow-y: scroll; height: 100vh; width: calc(100% + 60px); margin: 0 -30px; } @media screen and (max-width: 1260px) { .bd-px-header--left_sidebar:not(.elementor-editor-active) .elementor-container.elementor-container-boxed>.elementor-container { max-width: 1130px; } } @media screen and (min-width: 1201px) { .bd-px-header--left_sidebar .pxl-content-wrap.no-sidebar { margin-left: 0; margin-right: 0; } .bd-px-header--left_sidebar:not(.elementor-editor-active) #pxl-header-elementor .px-header--left_sidebar { width: 300px; position: fixed; top: 0; left: 0; height: 100vh; background-color: #fff; } .bd-px-header--left_sidebar:not(.elementor-editor-active) #pxl-main, .bd-px-header--left_sidebar:not(.elementor-editor-active) #pxl-footer-elementor, .bd-px-header--left_sidebar:not(.elementor-editor-active) #pxl-ptit-elementor { padding-left: 300px; } .bd-px-header--left_sidebar:not(.elementor-editor-active) #pxl-main .elementor>.elementor-container, .bd-px-header--left_sidebar:not(.elementor-editor-active) #pxl-footer-elementor .elementor>.elementor-container, .bd-px-header--left_sidebar:not(.elementor-editor-active) #pxl-ptit-elementor .elementor>.elementor-container { left: 0 !important; right: 0 !important; width: 100% !important; } .bd-px-header--left_sidebar:not(.elementor-editor-active) #pxl-footer-elementor .container { max-width: 100%; } .bd-px-header--left_sidebar:not(.elementor-editor-active).pxl-footer-fixed #pxl-wapper #pxl-main { margin-bottom: 0 !important; } .bd-px-header--left_sidebar:not(.elementor-editor-active).pxl-footer-fixed #pxl-footer-elementor { position: static; } .admin-bar.bd-px-header--left_sidebar:not(.elementor-editor-active) #pxl-header-elementor .px-header--left_sidebar { top: 32px; } } .post-type-archive-career .pxl-posts__style-4 .pxl-posts__item-img { max-width: 400px; } .pxl-grid.pxl-blog-grid .pxl-grid__filter { margin: 0 auto 44px; padding: 0; } .pxl-grid.pxl-blog-grid .pxl-grid__filter:after { display: none; } .pxl-grid.pxl-blog-grid .pxl-grid__loadmore { margin: 44px 0 0; padding: 0; } .pxl-grid.pxl-blog-grid .pxl-grid__loadmore:before { display: none; } .pxl-blog-grid--layout-2 .pxl-grid__inner { margin: 0 -20px; } @media screen and (max-width: 767px) { .pxl-blog-grid--layout-2 .pxl-grid__inner { margin: 0 -10px; } } @media screen and (max-width: 575px) { .pxl-blog-grid--layout-2 .pxl-grid__inner { margin: 0 -16px; } } .pxl-blog-grid--layout-2 .pxl-grid__inner .pxl-grid__item { padding: 20px; } @media screen and (max-width: 767px) { .pxl-blog-grid--layout-2 .pxl-grid__inner .pxl-grid__item { padding: 10px; } } @media screen and (max-width: 575px) { .pxl-blog-grid--layout-2 .pxl-grid__inner .pxl-grid__item { padding: 16px; } } .pxl-blog-grid--layout-3 .pxl-grid__inner { margin: 0 -20px; } @media screen and (max-width: 767px) { .pxl-blog-grid--layout-3 .pxl-grid__inner { margin: 0 -10px; } } @media screen and (max-width: 575px) { .pxl-blog-grid--layout-3 .pxl-grid__inner { margin: 0 -16px; } } .pxl-blog-grid--layout-3 .pxl-grid__inner .pxl-grid__item { padding: 20px; } @media screen and (max-width: 767px) { .pxl-blog-grid--layout-3 .pxl-grid__inner .pxl-grid__item { padding: 10px; } } @media screen and (max-width: 575px) { .pxl-blog-grid--layout-3 .pxl-grid__inner .pxl-grid__item { padding: 16px; } } @media screen and (min-width: 1201px) { .pxl-sidebar-sticky { position: -webkit-sticky; position: sticky; top: 110px; } .admin-bar .pxl-sidebar-sticky { top: 142px; } } .widget .widget-title, .pxl-widget-title, .wp-block-heading { font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.8px; margin-bottom: 24px; } @media screen and (max-width: 1200px) { .pxl-sidebar-area .pxl-sidebar-sticky { padding-left: 0px; padding-right: 0px; } } .pxl-sidebar-area .widget { position: relative; } .pxl-sidebar-area .widget+.widget { margin-top: 40px; padding-top: 41px; } @media screen and (max-width: 575px) { .pxl-sidebar-area .widget+.widget { margin-top: 20px; padding-top: 20px; } } .pxl-sidebar-area .widget+.widget::before { content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 1px; background: linear-gradient(90deg, rgba(102, 102, 102, 0.00) 0%, rgba(102, 102, 102, 0.13) 25%, rgba(102, 102, 102, 0.16) 50%, rgba(102, 102, 102, 0.13) 75%, rgba(102, 102, 102, 0.00) 100%); } .pxl-sidebar-area .pxl-widget__author+.widget { margin-top: 0; } .widget_search .searchform-wrap { position: relative; } .widget_search .searchform-wrap img { position: absolute; width: 16px; top: 16px; left: 16px; } @media screen and (max-width: 767px) { .widget_search .searchform-wrap img { top: 12px; left: 12px; } } .widget_search .search-field { padding: 4px 44px 4px 37px; border-radius: 8px; color: var(--primary-color); } .widget_search .search-field::placeholder { color: var(--third-color); } .widget_search .search-submit { width: 40px; height: 40px; border-radius: 8px; background-color: var(--primary-color); position: absolute; top: 4px; right: 4px; bottom: 4px; display: flex; justify-content: center; align-items: center; padding: 0; } @media screen and (max-width: 767px) { .widget_search .search-submit { top: 0px; right: 0px; bottom: 0px; } } .widget_search+.widget_pxl_elementor_box { padding-top: 0 !important; } .widget_search+.widget_pxl_elementor_box::before { display: none !important; } .widget_product_categories ul, .widget_categories ul, .widget_nav_menu ul, .widget_pages ul, .widget_archive ul, .widget_meta ul, .widget_recent_entries ul { list-style: none; margin-bottom: 0; padding: 0; } .widget_product_categories ul li a, .widget_categories ul li a, .widget_nav_menu ul li a, .widget_pages ul li a, .widget_archive ul li a, .widget_meta ul li a, .widget_recent_entries ul li a { font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -0.32px; padding: 13px 36px; display: flex; justify-content: space-between; align-items: center; position: relative; border-radius: 8px; } .widget_product_categories ul li a::before, .widget_categories ul li a::before, .widget_nav_menu ul li a::before, .widget_pages ul li a::before, .widget_archive ul li a::before, .widget_meta ul li a::before, .widget_recent_entries ul li a::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background-color: var(--primary-color); position: absolute; top: 23px; left: 22px; } .widget_product_categories ul li>ul, .widget_categories ul li>ul, .widget_nav_menu ul li>ul, .widget_pages ul li>ul, .widget_archive ul li>ul, .widget_meta ul li>ul, .widget_recent_entries ul li>ul, .widget_product_categories ul li>.sub-menu, .widget_categories ul li>.sub-menu, .widget_nav_menu ul li>.sub-menu, .widget_pages ul li>.sub-menu, .widget_archive ul li>.sub-menu, .widget_meta ul li>.sub-menu, .widget_recent_entries ul li>.sub-menu, .widget_product_categories ul li>.children, .widget_categories ul li>.children, .widget_nav_menu ul li>.children, .widget_pages ul li>.children, .widget_archive ul li>.children, .widget_meta ul li>.children, .widget_recent_entries ul li>.children { margin-top: 12px; margin-left: 5px; } .widget_product_categories ul li>ul>li>ul, .widget_categories ul li>ul>li>ul, .widget_nav_menu ul li>ul>li>ul, .widget_pages ul li>ul>li>ul, .widget_archive ul li>ul>li>ul, .widget_meta ul li>ul>li>ul, .widget_recent_entries ul li>ul>li>ul, .widget_product_categories ul li>.sub-menu>li>.sub-menu, .widget_categories ul li>.sub-menu>li>.sub-menu, .widget_nav_menu ul li>.sub-menu>li>.sub-menu, .widget_pages ul li>.sub-menu>li>.sub-menu, .widget_archive ul li>.sub-menu>li>.sub-menu, .widget_meta ul li>.sub-menu>li>.sub-menu, .widget_recent_entries ul li>.sub-menu>li>.sub-menu, .widget_product_categories ul li>.children>li>.children, .widget_categories ul li>.children>li>.children, .widget_nav_menu ul li>.children>li>.children, .widget_pages ul li>.children>li>.children, .widget_archive ul li>.children>li>.children, .widget_meta ul li>.children>li>.children, .widget_recent_entries ul li>.children>li>.children { margin-left: 10px; } .widget_product_categories ul li>ul>li>ul>li>ul, .widget_categories ul li>ul>li>ul>li>ul, .widget_nav_menu ul li>ul>li>ul>li>ul, .widget_pages ul li>ul>li>ul>li>ul, .widget_archive ul li>ul>li>ul>li>ul, .widget_meta ul li>ul>li>ul>li>ul, .widget_recent_entries ul li>ul>li>ul>li>ul, .widget_product_categories ul li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_categories ul li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_nav_menu ul li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_pages ul li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_archive ul li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_meta ul li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_recent_entries ul li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_product_categories ul li>.children>li>.children>li>.children, .widget_categories ul li>.children>li>.children>li>.children, .widget_nav_menu ul li>.children>li>.children>li>.children, .widget_pages ul li>.children>li>.children>li>.children, .widget_archive ul li>.children>li>.children>li>.children, .widget_meta ul li>.children>li>.children>li>.children, .widget_recent_entries ul li>.children>li>.children>li>.children { margin-left: 15px; } .widget_product_categories ul li>ul>li>ul>li>ul>li>ul, .widget_categories ul li>ul>li>ul>li>ul>li>ul, .widget_nav_menu ul li>ul>li>ul>li>ul>li>ul, .widget_pages ul li>ul>li>ul>li>ul>li>ul, .widget_archive ul li>ul>li>ul>li>ul>li>ul, .widget_meta ul li>ul>li>ul>li>ul>li>ul, .widget_recent_entries ul li>ul>li>ul>li>ul>li>ul, .widget_product_categories ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_categories ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_nav_menu ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_pages ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_archive ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_meta ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_recent_entries ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_product_categories ul li>.children>li>.children>li>.children>li>.children, .widget_categories ul li>.children>li>.children>li>.children>li>.children, .widget_nav_menu ul li>.children>li>.children>li>.children>li>.children, .widget_pages ul li>.children>li>.children>li>.children>li>.children, .widget_archive ul li>.children>li>.children>li>.children>li>.children, .widget_meta ul li>.children>li>.children>li>.children>li>.children, .widget_recent_entries ul li>.children>li>.children>li>.children>li>.children { margin-left: 20px; } .widget_product_categories ul li>ul>li>ul>li>ul>li>ul>li>ul, .widget_categories ul li>ul>li>ul>li>ul>li>ul>li>ul, .widget_nav_menu ul li>ul>li>ul>li>ul>li>ul>li>ul, .widget_pages ul li>ul>li>ul>li>ul>li>ul>li>ul, .widget_archive ul li>ul>li>ul>li>ul>li>ul>li>ul, .widget_meta ul li>ul>li>ul>li>ul>li>ul>li>ul, .widget_recent_entries ul li>ul>li>ul>li>ul>li>ul>li>ul, .widget_product_categories ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_categories ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_nav_menu ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_pages ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_archive ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_meta ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_recent_entries ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_product_categories ul li>.children>li>.children>li>.children>li>.children>li>.children, .widget_categories ul li>.children>li>.children>li>.children>li>.children>li>.children, .widget_nav_menu ul li>.children>li>.children>li>.children>li>.children>li>.children, .widget_pages ul li>.children>li>.children>li>.children>li>.children>li>.children, .widget_archive ul li>.children>li>.children>li>.children>li>.children>li>.children, .widget_meta ul li>.children>li>.children>li>.children>li>.children>li>.children, .widget_recent_entries ul li>.children>li>.children>li>.children>li>.children>li>.children { margin-left: 25px; } .widget_product_categories ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_categories ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_nav_menu ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_pages ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_archive ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_meta ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_recent_entries ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_product_categories ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_categories ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_nav_menu ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_pages ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_archive ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_meta ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_recent_entries ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_product_categories ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_categories ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_nav_menu ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_pages ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_archive ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_meta ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_recent_entries ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children { margin-left: 30px; } .widget_product_categories ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_categories ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_nav_menu ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_pages ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_archive ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_meta ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_recent_entries ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_product_categories ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_categories ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_nav_menu ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_pages ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_archive ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_meta ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_recent_entries ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_product_categories ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_categories ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_nav_menu ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_pages ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_archive ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_meta ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_recent_entries ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children { margin-left: 35px; } .widget_product_categories ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_categories ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_nav_menu ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_pages ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_archive ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_meta ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_recent_entries ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_product_categories ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_categories ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_nav_menu ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_pages ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_archive ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_meta ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_recent_entries ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_product_categories ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_categories ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_nav_menu ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_pages ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_archive ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_meta ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_recent_entries ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children { margin-left: 40px; } .widget_product_categories ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_categories ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_nav_menu ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_pages ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_archive ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_meta ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_recent_entries ul li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul>li>ul, .widget_product_categories ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_categories ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_nav_menu ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_pages ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_archive ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_meta ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_recent_entries ul li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu>li>.sub-menu, .widget_product_categories ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_categories ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_nav_menu ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_pages ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_archive ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_meta ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children, .widget_recent_entries ul li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children>li>.children { margin-left: 45px; } .widget_tag_cloud .tagcloud { display: flex; flex-wrap: wrap; gap: 6px; } .widget_tag_cloud a { background-color: #eaecf5; font-size: 14px !important; font-style: normal; font-weight: 500; line-height: 1.3; letter-spacing: -0.28px; padding: 3px 8px; border-radius: 8px; } .widget_tag_cloud a:before { content: '#'; transition: none; } .widget_tag_cloud a:hover { color: #fff; background-color: var(--primary-color); } .gallery { margin: -10px -5px 0 -5px !important; display: flex; flex-wrap: wrap; } .gallery .gallery-item { padding: 0 5px !important; margin: 24px 0 0 !important; } .gallery .gallery-item img { border: none !important; } .gallery.gallery-columns-2 .gallery-item { width: 50% !important; } .gallery.gallery-columns-3 .gallery-item { width: 33.33% !important; } .gallery.gallery-columns-4 .gallery-item { width: 25% !important; } .gallery.gallery-columns-5 .gallery-item { width: 20% !important; } #pxl-content-main .gallery { margin: -5px -12px 38px -12px !important; } #pxl-content-main .gallery .gallery-item { padding: 0 12px !important; margin: 24px 0 0 !important; } .widget_media_gallery .gallery, .elementor-widget-wp-widget-media_gallery .gallery, .elementor-widget-image-gallery .gallery { margin: -10px -5px 0 -5px; } .widget_media_gallery .gallery .gallery-item, .elementor-widget-wp-widget-media_gallery .gallery .gallery-item, .elementor-widget-image-gallery .gallery .gallery-item { padding: 0 5px; margin-top: 10px !important; margin-bottom: 0; } .widget_media_gallery .gallery .gallery-item img, .elementor-widget-wp-widget-media_gallery .gallery .gallery-item img, .elementor-widget-image-gallery .gallery .gallery-item img { -webkit-border-radius: 0px; -khtml-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; width: 100%; border: none !important; } .widget_media_gallery .gallery .gallery-item a, .elementor-widget-wp-widget-media_gallery .gallery .gallery-item a, .elementor-widget-image-gallery .gallery .gallery-item a { display: block; position: relative; } .widget_media_gallery .gallery .gallery-item a:before, .elementor-widget-wp-widget-media_gallery .gallery .gallery-item a:before, .elementor-widget-image-gallery .gallery .gallery-item a:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.67); -webkit-transition: all 250ms linear 0ms; -khtml-transition: all 250ms linear 0ms; -moz-transition: all 250ms linear 0ms; -ms-transition: all 250ms linear 0ms; -o-transition: all 250ms linear 0ms; transition: all 250ms linear 0ms; opacity: 0; z-index: 1; } .widget_media_gallery .gallery .gallery-item a:after, .elementor-widget-wp-widget-media_gallery .gallery .gallery-item a:after, .elementor-widget-image-gallery .gallery .gallery-item a:after { content: "\f12c"; font-size: 15px; font-family: "Caseicon"; color: #fff; z-index: 2; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -khtml-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transition: all 250ms linear 0ms; -khtml-transition: all 250ms linear 0ms; -moz-transition: all 250ms linear 0ms; -ms-transition: all 250ms linear 0ms; -o-transition: all 250ms linear 0ms; transition: all 250ms linear 0ms; opacity: 0; font-weight: 400; } .widget_media_gallery .gallery .gallery-item a:hover:before, .elementor-widget-wp-widget-media_gallery .gallery .gallery-item a:hover:before, .elementor-widget-image-gallery .gallery .gallery-item a:hover:before, .widget_media_gallery .gallery .gallery-item a:hover:after, .elementor-widget-wp-widget-media_gallery .gallery .gallery-item a:hover:after, .elementor-widget-image-gallery .gallery .gallery-item a:hover:after { opacity: 1; } .elementor-lightbox .swiper-container .elementor-lightbox-image { width: auto; height: auto; } .elementor-lightbox .swiper-container .swiper-slide { background-color: transparent; } .pxl-gallery { margin: -8px -15px 26px -15px; display: flex; flex-wrap: wrap; } .pxl-gallery img { width: 100%; } .pxl-gallery .pxl--item { padding: 26px 15px 0 15px; } .pxl-gallery .pxl--item-inner { -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; border-radius: 10px; overflow: hidden; position: relative; } .pxl-gallery .pxl--item-inner.video-active:before { background-color: rgba(27, 27, 27, 0.5); } .pxl-gallery .pxl--item-inner .pxl-btn-video { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -khtml-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 99; } .pxl-gallery.gallery-2-columns .pxl--item { width: 50%; } @media screen and (max-width: 575px) { .pxl-gallery.gallery-2-columns .pxl--item { width: 100%; } } .pxl-gallery.gallery-3-columns .pxl--item { width: 33.33%; } @media screen and (max-width: 575px) { .pxl-gallery.gallery-3-columns .pxl--item { width: 100%; } } .pxl-gallery.gallery-4-columns .pxl--item { width: 25%; } @media screen and (max-width: 767px) { .pxl-gallery.gallery-4-columns .pxl--item { width: 50%; } } @media screen and (max-width: 575px) { .pxl-gallery.gallery-4-columns .pxl--item { width: 100%; } } .pxl-gallery.gallery-5-columns .pxl--item { width: 20%; } @media screen and (max-width: 767px) { .pxl-gallery.gallery-5-columns .pxl--item { width: 50%; } } @media screen and (max-width: 575px) { .pxl-gallery.gallery-5-columns .pxl--item { width: 100%; } } .pxl-gallery.masonry-style1 .pxl--item-inner { -webkit-border-radius: 0px; -khtml-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; } .widget_recent_comments ul, .widget_recent_comments ol { list-style: none; font-size: 16px; line-height: 24px; color: #080808; font-weight: 500; } .widget_recent_comments ul a, .widget_recent_comments ol a { color: inherit; } .widget_recent_comments ul a:hover, .widget_recent_comments ol a:hover { color: var(--primary-color); } .widget_recent_comments ul li+li, .widget_recent_comments ol li+li { margin-top: 18px; } .widget_rss .rss-widget-title { color: inherit; } .widget_rss ul, .widget_rss ol { margin: 0; list-style: none; } .widget_rss .rsswidget { display: block; font-size: 16px; line-height: 24px; color: #080808; font-weight: 500; } .widget_rss .rss-date { font-size: 14px; display: block; margin-top: 4px; margin-bottom: 10px; } .widget_rss li+li { margin-top: 34px; } .widget_rss cite { display: block; margin-top: 4px; color: var(--primary-color); } .widget_block ul, .widget_block ol { margin-bottom: 0; padding: 0; list-style: none; } .widget_block .wp-block-search__label, .widget_block .wp-block-group__inner-container>h2 { font-size: 22px; margin-bottom: 27px; position: relative; color: #080808; font-weight: 500; display: block; } .widget_block .wp-block-latest-posts__list, .widget_block .wp-block-latest-comments { font-size: 16px; line-height: 24px; color: #080808; font-weight: 600; } .widget_block .wp-block-latest-posts__list a, .widget_block .wp-block-latest-comments a { color: inherit; } .widget_block .wp-block-latest-posts__list a:hover, .widget_block .wp-block-latest-comments a:hover { color: var(--primary-color); } .widget_block .wp-block-latest-posts__list li+li, .widget_block .wp-block-latest-comments li+li { margin-top: 18px; } .widget_block .wp-block-latest-comments { color: #666; } .widget_block .wp-block-latest-comments a { color: #080808; } .widget_block .wp-block-latest-comments a:hover { color: var(--primary-color); } .widget_block.widget_search .wp-block-search__inside-wrapper { position: relative; } .widget_block.widget_search .wp-block-search__inside-wrapper .wp-block-search__button { height: 40px; width: 40px; background: transparent; top: 50%; right: 4px; transform: translateY(-50%); border-radius: 8px; padding: 0; position: absolute; color: #fff; line-height: 40px; z-index: 1; font-size: 0px; border: none; outline: none; background-color: var(--primary-color); } .widget_block.widget_search .wp-block-search__inside-wrapper .wp-block-search__button:before { content: "\f12c"; font-family: "Caseicon"; font-size: 14px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .widget_block.widget_search .wp-block-search__inside-wrapper .wp-block-search__button:hover { border-color: var(--primary-color); background-color: var(--secondary-color); color: #fff; } .widget_block.widget_search .wp-block-search__inside-wrapper .wp-block-search__input { border-color: #ececf0; color: #222; padding-left: 24px; } .widget_archive .nice-select ul.list { max-width: 320px; } .wp-calendar-table { background-color: #fff; } .pxl-wg-categories { margin: -20px -10px 0 -10px; display: flex; flex-wrap: wrap; } .pxl-wg-categories .pxl-category { padding: 0 10px; margin-top: 20px; } .pxl-wg-categories .pxl-category--inner { min-height: 90px; position: relative; z-index: 1; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; overflow: hidden; } @media screen and (max-width: 575px) { .pxl-wg-categories .pxl-category--inner { min-height: 120px; } } .pxl-wg-categories .pxl-category--inner:before { content: ''; background-color: rgba(0, 0, 0, 0.36); z-index: 12; } .pxl-wg-categories .pxl-category--inner a { z-index: 99; } .pxl-wg-categories .pxl-category--inner span { color: #fff; font-size: 16px; font-weight: 500; position: relative; z-index: 88; } .pxl-wg-categories .pxl-category--inner .pxl-category--img { z-index: 11; -webkit-transition: all 0.5s ease; -khtml-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; transform: scale(1.01, 1.01); } .pxl-wg-categories .pxl-category--inner:hover .pxl-category--img { -webkit-transform: scale(1.07, 1.07); transform: scale(1.07, 1.07); } .pxl-wg-categories.columns-2 .pxl-category { width: 50%; } @media screen and (max-width: 575px) { .pxl-wg-categories.columns-2 .pxl-category { width: 100%; } } .pxl-contact-info-widget { border-radius: 5px; overflow: hidden; position: relative; z-index: 1; text-align: center; padding: 62px 30px; font-weight: 500; color: rgba(255, 255, 255, 0.8); } .pxl-contact-info-widget .pxl-phone--number { margin-bottom: 16px; color: #fff; font-size: 34px; font-weight: 800; } @media screen and (max-width: 1200px) { .pxl-contact-info-widget .pxl-phone--number { font-size: 28px; } } .pxl-contact-info-widget .pxl-item--icon { height: 62px; width: 62px; background-color: red; border-radius: 62px; font-size: 34px; display: inline-flex; justify-content: center; align-items: center; position: relative; z-index: 1; margin-bottom: 23px; } .pxl-contact-info-widget .pxl-item--icon:before { content: ''; background-color: #020626; position: absolute; top: 3px; right: 3px; bottom: 3px; left: 3px; border-radius: 100%; z-index: -1; } .pxl-contact-info-widget .pxl-item--icon i.active { animation: pxl_zigzag 0.8s ease-out infinite; -webkit-animation: pxl_zigzag 0.8s ease-out infinite; } .pxl-contact-info-widget .pxl-phone--link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 99; } .pxl-contact-info-widget:before { z-index: -1; background-color: rgba(2, 6, 38, 0.85); } .pxl-widget__author { padding: 40px 24px; border-radius: 16px; background: #f8f9fc; display: flex; flex-direction: column; align-items: center; } .pxl-widget__author-image { width: 70px; height: 70px; border-radius: 50%; border: 3px solid #fff; margin-bottom: 21px; } .pxl-widget__author-name { font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.8px; color: var(--primary-color); margin-bottom: 8px; } .pxl-widget__author-row { display: flex; gap: 5px; font-size: 14px; } .pxl-widget__author-hobbie { display: flex; gap: 5px; } .pxl-widget__author-hobbie img { width: 14px; } .pxl-widget__author-bio { color: var(--primary-color); margin: 25px 0 24px; padding-top: 24px; position: relative; } .pxl-widget__author-bio::before { content: ""; position: absolute; background: linear-gradient(90deg, rgba(102, 102, 102, 0.00) 0%, rgba(102, 102, 102, 0.13) 25%, rgba(102, 102, 102, 0.16) 50%, rgba(102, 102, 102, 0.13) 75%, rgba(102, 102, 102, 0.00) 100%); display: block; width: 100%; height: 1px; top: 0; left: 0; } .pxl-widget__author-pos { font-weight: 500; color: var(--primary-color); } .pxl-widget__author .social { display: flex; flex-wrap: wrap; flex-flow: row wrap; justify-content: center; gap: 8px; margin-top: 24px; } .pxl-widget__author .social-item a { width: 40px; height: 40px; display: flex; justify-content: center; align-items: center; border: 1px solid #d5d7da; border-radius: 50%; background-color: transparent; } .pxl-widget__author .social-item a svg { width: 12px; height: 12px; transition: all 0.3s ease; } .pxl-widget__author .social-item a:hover { background-color: var(--primary-color); } .pxl-widget__author .social-item a:hover svg { fill: #fff; } .widget_calendar { position: relative; } .widget_calendar .calendar_wrap { position: relative; } .widget_calendar .calendar_wrap table { position: relative; z-index: 1; width: 100%; border-collapse: collapse; line-height: 2; width: 100%; border-bottom: 1px solid #ededed; border-left: 1px solid #ededed; border-spacing: 0px; margin: 0px 0px 32px; border-radius: 0px; } .widget_calendar .calendar_wrap table caption { background-color: var(--primary-color); color: #fff; font-size: 18px; min-height: 32px; } .widget_calendar .calendar_wrap table tr th { color: var(--primary-color); padding: 10px; border-top: 1px solid #ededed; border-right: 1px solid #ededed; font-weight: 500; } .widget_calendar .calendar_wrap table tr td { padding: 10px; border-top: 1px solid #ededed; border-right: 1px solid #ededed; text-align: center; } .widget_calendar .calendar_wrap table tr td a { display: block; width: 100%; height: 100%; color: var(--primary-color); } .widget_calendar .calendar_wrap table tr td a:hover { color: var(--secondary-color); } .widget_calendar .calendar_wrap nav { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; height: 36px; padding: 0 16px; } .widget_calendar .calendar_wrap nav .wp-calendar-nav-prev a, .widget_calendar .calendar_wrap nav .wp-calendar-nav-next a { color: #fff; } .widget_calendar .calendar_wrap nav .wp-calendar-nav-prev a:hover, .widget_calendar .calendar_wrap nav .wp-calendar-nav-next a:hover { font-weight: 500; } body.rtl .widget .widget-title { padding-left: 0; padding-right: 42px; } body.rtl .widget .widget-title:before { left: auto; right: 0; } .pxl-breadcrumbs { position: relative; } .pxl-breadcrumbs .pxl-breadcrumb { display: flex; align-items: center; justify-content: start; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; } .pxl-breadcrumbs .pxl-breadcrumb li { font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -0.32px; } .pxl-breadcrumbs .pxl-breadcrumb li::after { content: "/"; margin: 0 14px; } @media screen and (max-width: 575px) { .pxl-breadcrumbs .pxl-breadcrumb li { font-size: 14px; } .pxl-breadcrumbs .pxl-breadcrumb li::after { margin: 0 8px; } } .pxl-breadcrumbs .pxl-breadcrumb li:last-child::after { display: none; } .pxl-logo img, .pxl-logo a img { width: auto; } .pxl-logo__style-circle { position: relative; width: 455px; height: 339px; margin: 0 auto; } @media screen and (max-width: 575px) { .pxl-logo__style-circle { width: 288px; height: 203px; } } .pxl-logo__style-circle a, .pxl-logo__style-circle img { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .pxl-logo__style-circle .cirle-1, .pxl-logo__style-circle .circle-2 { transform-origin: center; transition: transform 0.1s linear; will-change: transform; } .pxl-logo__style-circle .circle-1 { left: 49%; top: 50%; transform: translate(-50%, -50%); position: absolute; z-index: 2; } .pxl-logo__style-circle .circle-2 { left: 50%; top: 47%; transform: translate(-50%, -50%); position: absolute; z-index: 2; } .pxl-logo__style-circle .pxl-logo__image { display: flex; align-items: center; width: 100%; height: 100%; position: absolute; width: 132px; height: 132px; top: 50%; left: 50%; transform: translate(-50%, -50%); } .pxl-logo__style-circle .pxl-logo__image::before { content: ""; position: absolute; width: 100%; height: 100%; border-radius: 23px; background: #5df7f7; filter: blur(107.85px); } .pxl-logo__style-circle .pxl-logo__image img { max-width: 132px; } .pxl-logo__style-3 { padding-top: 280px; position: relative; width: 406px; overflow: hidden; } @media screen and (max-width: 1200px) { .pxl-logo__style-3 { padding-top: 220px; } } @media screen and (max-width: 575px) { .pxl-logo__style-3 { padding-top: 80px; width: 290px; } } .pxl-logo__style-3 .pxl-logo__line-1, .pxl-logo__style-3 .pxl-logo__line-2, .pxl-logo__style-3 .pxl-logo__line-3 { position: absolute; width: 1px; height: 100%; background: linear-gradient(180deg, rgba(255, 255, 255, 0.24) 0%, rgba(255, 255, 255, 0.00) 100%); top: 0; } .pxl-logo__style-3 .pxl-logo__line-1:before, .pxl-logo__style-3 .pxl-logo__line-2:before, .pxl-logo__style-3 .pxl-logo__line-3:before, .pxl-logo__style-3 .pxl-logo__line-1:after, .pxl-logo__style-3 .pxl-logo__line-2:after, .pxl-logo__style-3 .pxl-logo__line-3:after { content: ''; position: absolute; width: 3px; height: 68px; bottom: 0; left: 50%; transform: translateX(-50%); background: linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, 0.00) 100%); border-radius: 99px; z-index: 1; backdrop-filter: blur(20px); } @media screen and (max-width: 575px) { .pxl-logo__style-3 .pxl-logo__line-1:before, .pxl-logo__style-3 .pxl-logo__line-2:before, .pxl-logo__style-3 .pxl-logo__line-3:before, .pxl-logo__style-3 .pxl-logo__line-1:after, .pxl-logo__style-3 .pxl-logo__line-2:after, .pxl-logo__style-3 .pxl-logo__line-3:after { height: 30px; } } .pxl-logo__style-3 .pxl-logo__line-1 { left: 1px; } .pxl-logo__style-3 .pxl-logo__line-1:before { animation: pxl_run_line_11 5s linear infinite; } .pxl-logo__style-3 .pxl-logo__line-1:after { animation: pxl_run_line_12 5s linear infinite; } .pxl-logo__style-3 .pxl-logo__line-2 { left: 50%; transform: translateX(-50%); } .pxl-logo__style-3 .pxl-logo__line-2:before { animation: pxl_run_line_21 5s linear infinite; bottom: 20%; } .pxl-logo__style-3 .pxl-logo__line-2:after { bottom: 70%; animation: pxl_run_line_22 5s linear infinite; } .pxl-logo__style-3 .pxl-logo__line-3 { right: 1px; } .pxl-logo__style-3 .pxl-logo__line-3:before { animation: pxl_run_line_31 5s linear infinite; } .pxl-logo__style-3 .pxl-logo__line-3:after { animation: pxl_run_line_32 5s linear infinite; } .pxl-logo__style-3 .pxl-logo__image { width: 160px; height: 160px; display: flex; align-items: center; justify-content: center; position: relative; margin: 0 auto; } @media screen and (max-width: 575px) { .pxl-logo__style-3 .pxl-logo__image { width: 120px; height: 120px; } } .pxl-logo__style-3 .pxl-logo__image::before { content: ''; all: unset; content: ''; position: absolute; top: 3px; left: 3px; width: calc(100% - 6px); height: calc(100% - 6px); border-radius: 40px; background: linear-gradient(180deg, rgba(102, 102, 102, 0.20) 0%, rgba(102, 102, 102, 0.00) 32.69%), linear-gradient(180deg, rgba(102, 102, 102, 0.00) 50%, rgba(102, 102, 102, 0.40) 100%), rgba(29, 29, 29, 0.20); z-index: 1; backdrop-filter: blur(20px); } .pxl-logo__style-3 .pxl-logo__image img { max-height: 80px; position: relative; z-index: 3; } .pxl-logo__style-3 .pxl-logo__image::after { content: ''; position: absolute; top: -1px; left: -1px; border-radius: 40px; background-blend-mode: screen, screen, color-burn; box-shadow: 23px 32px 13px -34px #fff inset, -23px -30px 21px -34px #fff inset, 4px 4px 2px -4px rgba(255, 255, 255, 0.2) inset, 0px 0px 44px 0px rgba(255, 255, 255, 0.2) inset; backdrop-filter: blur(20px); z-index: 2; height: calc(100% + 2px); width: calc(100% + 2px); } .pxl-heading { position: relative; } .pxl-heading .clip { position: relative; } .pxl-heading .clip svg { position: absolute; top: 0; left: 0; transform: translate(-100%, -100%); } .pxl-heading .clip .pxl-heading__line-left { position: absolute; top: 0; left: 0; background-color: var(--secondary-color); width: 4px; height: 100%; border-radius: 99px; } .pxl-heading .clip .pxl-heading__words { background: linear-gradient(90deg, rgba(105, 56, 239, 0.20) -28.95%, rgba(105, 56, 239, 0.06) 100%); padding-bottom: 10px; } .pxl-heading .clip .pxl-heading__words b { font-weight: 500; } .pxl-heading__sub-box { padding: 7px 16px; border-radius: 8px; background-color: #ebe9fe; width: fit-content; font-size: 14px; line-height: 1.3; letter-spacing: -0.28px; font-weight: 500; } .pxl-heading__icon-center { display: flex; flex-direction: column; } .pxl-heading__highlight { color: var(--secondary-color); } .pxl-heading__highlight-box-text-gradient { --gradient-color-from: #28c6ff; --gradient-color-to: #573cf1; } .pxl-heading__highlight-box-text-gradient .pxl-heading__highlight-text { background: linear-gradient(90deg, var(--gradient-color-from) 0%, var(--gradient-color-to) 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .pxl-heading__highlight-gradient .pxl-heading__highlight { --gradient-color-1: #e464f5; --gradient-color-2: #8255e8; --gradient-color-3: #44dac3; --gradient-color-4: #48d6ee; --gradient-color-5: #0478ce; background: linear-gradient(89deg, var(--gradient-color-1) 0.48%, var(--gradient-color-2) 27.38%, var(--gradient-color-3) 51.79%, var(--gradient-color-4) 75.69%, var(--gradient-color-5) 99.52%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .pxl-heading__highlight-gradient-nd .pxl-heading__highlight { background: linear-gradient(100deg, var(--gradient-color-1) 4.49%, var(--gradient-color-2) 51.2%, var(--gradient-color-3) 97.92%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .pxl-heading__highlight-gradient-4th .pxl-heading__highlight { background: linear-gradient(90deg, var(--gradient-color-1) 0%, var(--gradient-color-2) 32.21%, var(--gradient-color-3) 66.83%, var(--gradient-color-4) 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .pxl-heading__style-gradient { background: linear-gradient(90deg, #fff 17.81%, #535353 131.33%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .pxl-heading__style-scroll-gradient .pxl-heading__text .split-line { --scroll-gradient-title-color-1: #fff; --scroll-gradient-title-color-2: #fff; --scroll-gradient-title-color-3: #89ffe7; --scroll-gradient-title-color-4: #535862; --scroll-gradient-title-color-5: #535862; color: inherit; -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-image: linear-gradient(84deg, var(--scroll-gradient-title-color-1) -12%, var(--scroll-gradient-title-color-2) 20%, var(--scroll-gradient-title-color-3) 50%, var(--scroll-gradient-title-color-4) 50%, var(--scroll-gradient-title-color-5) 100%); background-size: 200% 100%; background-position: 100%; transition: all 0.3s linear; } .pxl-heading .pxl-heading__has-quote .quote-svg { position: absolute; width: 40px; height: 41px; } .pxl-heading .pxl-heading__has-quote .quote-svg.quote-svg-left { left: 0; top: 0; transform: translate(-100%, -100%); } .pxl-heading .pxl-heading__has-quote .quote-svg.quote-svg-right { right: 0; bottom: 0; transform: translate(100%, 100%); } .pxl-heading .pxl-heading__sub-left { margin-left: 0; margin-right: auto; } .pxl-heading .pxl-heading__sub-center { margin-left: auto; margin-right: auto; } .pxl-heading .pxl-heading__sub-right { margin-left: auto; margin-right: 0; } .pxl-heading .pxl-heading__sub-justify { text-align: center; width: unset; } .pxl-heading .pxl-heading__sub-border { border: 1px solid #d5d7da; border-radius: 50px; padding: 7px 16px; width: fit-content; font-size: 14px; font-weight: 500; line-height: 1.3; letter-spacing: -0.28px; } .pxl-heading .pxl-heading__sub-slogan { -webkit-border-radius: 50px; -khtml-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; border-radius: 50px; border: 1px solid #d5d7da; background: #fff; display: flex; gap: 8px; padding: 4px 16px 4px 4px; width: fit-content; display: flex; align-items: center; gap: 8px; } .pxl-heading .pxl-heading__sub-slogan .pxl-heading__sub-slogan--bef { padding: 7px 16px; -webkit-border-radius: 50px; -khtml-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; border-radius: 50px; background-color: var(--primary-color); color: #fff; font-size: 14px; font-weight: 500; line-height: 1.3; letter-spacing: -0.28px; } .pxl-heading .pxl-heading__sub-slogan .pxl-heading__sub-slogan--aft { font-size: 14px; line-height: 1.3; letter-spacing: -0.28px; display: flex; gap: 6px; color: var(--primary-color); font-weight: 500; } .pxl-heading__words { position: relative; display: inline-block; overflow: hidden; vertical-align: top; } .pxl-heading__words b { position: absolute; opacity: 0; white-space: nowrap; } .pxl-heading__words b.is-visible { position: relative; opacity: 1; } .pxl-heading__highlight-line-bottom .pxl-heading__highlight { position: relative; padding-bottom: 20px; } .pxl-heading__highlight-line-bottom .pxl-heading__highlight svg { position: absolute; bottom: 0; left: 50%; transform: translateX(-48%); width: 260px; height: auto; } .pxl-heading__highlight-allura .pxl-heading__highlight { font-family: 'Allura', sans-serif; } .pxl-link { position: relative; } .pxl-link .pxl-link__wrap { display: flex; gap: 16px; list-style: none; padding: 0; margin: 0; } @media screen and (max-width: 575px) { .pxl-link .pxl-link__wrap { flex-flow: row wrap; justify-content: center; } } .pxl-link__item-box ul li { display: block; background-color: #f5f5f5; color: #000; } .pxl-link__item-box ul li a { padding: 12px 24px; font-weight: 500; line-height: 1.35; letter-spacing: -0.32px; width: 100%; display: flex; gap: 16px; } .pxl-link__vertical .pxl-link__wrap { flex-direction: column; } .pxl-link__horizontal .pxl-link__wrap { flex-direction: row; flex-wrap: wrap; } .pxl-link__horizontal .pxl-link__wrap.pxl-link__item-box li a { width: auto; } .pxl-link__default .pxl-link__title { margin-bottom: 24px; color: var(--primary-color); } .pxl-link__default .pxl-link__wrap .pxl-link__item a { font-size: 16px; color: #535862; letter-spacing: -0.32px; } .pxl-link__default .pxl-link__wrap .pxl-link__item a:hover { color: var(--secondary-color); } .pxl-link__menu-sticky { position: relative; } .pxl-link__menu-sticky .pxl-link__wrap { border-radius: 99px; border: 1px solid #d5d7da; background: #fff; padding: 4px; gap: 4px; } .pxl-link__menu-sticky .pxl-link__wrap .pxl-link__item { padding: 7px 16px; border-radius: 30px; background-color: transparent; transition: all 0.3s ease; } .pxl-link__menu-sticky .pxl-link__wrap .pxl-link__item a { color: var(--primary-color); font-weight: 500; } .pxl-link__menu-sticky .pxl-link__wrap .pxl-link__item:hover, .pxl-link__menu-sticky .pxl-link__wrap .pxl-link__item.active { background-color: var(--primary-color); } .pxl-link__menu-sticky .pxl-link__wrap .pxl-link__item:hover a, .pxl-link__menu-sticky .pxl-link__wrap .pxl-link__item.active a { color: #fff; } .pxl-list { position: relative; list-style: none; margin: 0; padding: 0; } .pxl-list__vertical { display: grid; grid-template-columns: repeat(1, 1fr); } .pxl-list__horizontal { display: flex; flex-flow: row wrap; } .pxl-list__item { display: flex; gap: 8px; } .pxl-list__item-icon { line-height: 1; } .pxl-list__style-dot li { position: relative; padding-left: 24px; font-weight: 400; } .pxl-list__style-dot li b { color: var(--primary-color); font-weight: 500; } .pxl-list__style-dot li.pxl-list__item-left { gap: 0; } .pxl-list__style-dot li.pxl-list__item-center { flex-direction: column; align-items: center; } .pxl-list__style-dot li.pxl-list__item-right { flex-direction: row-reverse; } .pxl-list__style-dot li::before { content: ""; position: absolute; width: 5px; height: 5px; left: 12px; top: 9px; transform: translate(-50%, 0%); background-color: var(--primary-color); border-radius: 50%; } .pxl-list__style-icon--box { gap: 40px 80px; } .pxl-list__style-icon--box .pxl-list__item { display: flex; align-items: center; gap: 16px; } .pxl-list__style-icon--box .pxl-list__item-icon { width: 48px; height: 48px; border-radius: 13.714px; background: #fbf9ef; display: flex; align-items: center; justify-content: center; } .pxl-list__style-icon--box .pxl-list__item-icon i { font-size: 24px; } .pxl-list__style-icon--box .pxl-list__item-icon img, .pxl-list__style-icon--box .pxl-list__item-icon svg { width: 24px; } .pxl-list__style-icon--box .pxl-list__item-text { font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.8px; color: var(--primary-color); } .pxl-list__style-border li { border-radius: 99px; border: 1px solid #d5d7da; background: #fff; padding: 12px 16px; font-size: 16px; font-weight: 400; line-height: 1.3; letter-spacing: -0.32px; padding: 8px; display: flex; align-items: center; gap: 8px; } .pxl-list__style-border li .pxl-list__item-icon { width: 24px; height: 24px; } .pxl-list__style-border li .pxl-list__item-icon+.pxl-list__item-text { padding-right: 8px; } .pxl-list__style-border li .pxl-list__item-text { font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -0.32px; color: #0a0d12; } .pxl-icons { position: relative; display: flex; } .pxl-icons__vertical { flex-direction: column; } .pxl-icons__vertical.pxl-icons__left { justify-content: flex-start; } .pxl-icons__vertical.pxl-icons__center { justify-content: center; } .pxl-icons__vertical.pxl-icons__right { justify-content: flex-end; } .pxl-icons__horizontal { flex-direction: row; } .pxl-icons__horizontal.pxl-icons__left { align-items: flex-start; } .pxl-icons__horizontal.pxl-icons__center { align-items: center; } .pxl-icons__horizontal.pxl-icons__right { align-items: flex-end; } .pxl-icons__wrap { flex-wrap: wrap; } .pxl-icons__no-wrap { flex-wrap: nowrap; } .pxl-icons__style-1 { gap: 8px; } .pxl-icons__style-1 .pxl-icons__item { width: 40px; height: 40px; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; border: 1px solid #d5d7da; display: flex; justify-content: center; align-items: center; transition: all 0.3s ease; } .pxl-icons__style-1 .pxl-icons__item i { font-size: 20px; color: #000; transition: all 0.3s ease; } .pxl-icons__style-1 .pxl-icons__item svg { transition: all 0.3s ease; } .pxl-icons__style-1 .pxl-icons__item:hover { border-color: var(--secondary-color); background-color: var(--secondary-color); } .pxl-icons__style-1 .pxl-icons__item:hover i { color: #fff; } .pxl-icons__style-1 .pxl-icons__item:hover svg, .pxl-icons__style-1 .pxl-icons__item:hover path { fill: #fff; } .pxl-icons .pxl-icons__item { line-height: 0; } .pxl-icons__style-3 { position: relative; } .pxl-icons__style-3 .pxl-icons__item { width: 11.326%; height: 22.652%; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; position: absolute; border-radius: 49.5px; border: 0.257px solid #efefef; background: #fff; box-shadow: 0 0.4px 0.4px -0.2px rgba(0, 0, 0, 0.04), 0 1.2px 1.2px -0.6px rgba(0, 0, 0, 0.04), 0 9.6px 9.6px -4.8px rgba(0, 0, 0, 0.04); display: flex; align-items: center; justify-content: center; } .pxl-icons__style-3 .pxl-icons__item:nth-child(2) { top: calc((130 / 212) * 100%); left: calc((-10 / 424) * 100%); } .pxl-icons__style-3 .pxl-icons__item:nth-child(3) { top: calc((-8 / 212) * 100%); left: calc((91 / 424) * 100%); animation: scale_icon 3s ease infinite 2s; } .pxl-icons__style-3 .pxl-icons__item:nth-child(4) { top: calc((112 / 212) * 100%); left: calc((127 / 424) * 100%); animation: scale_icon 3s ease infinite 3s; } .pxl-icons__style-3 .pxl-icons__item:nth-child(5) { top: calc((42 / 212) * 100%); left: calc((233 / 424) * 100%); animation: scale_icon 3s ease infinite 4s; } .pxl-icons__style-3 .pxl-icons__item:nth-child(6) { top: calc((164 / 212) * 100%); left: calc((281 / 424) * 100%); animation: scale_icon 3s ease infinite 5s; } .pxl-icons__style-3 .pxl-icons__item:nth-child(7) { top: calc((90 / 212) * 100%); left: calc((378 / 424) * 100%); animation: scale_icon 3s ease infinite 6s; } .pxl-icons__style-3 .half-circle-wrap { width: 424px; aspect-ratio: 2/1; position: relative; } .pxl-icons__style-3 .half-circle { border-radius: 1000px 1000px 0 0; bottom: 0%; left: 50%; transform: translateX(-50%); position: absolute; } .pxl-icons__style-3 .half-circle--1 { width: 100%; height: 100%; background: linear-gradient(180deg, #f5f5f5 0%, #fff 100%); } .pxl-icons__style-3 .half-circle--2 { width: 73%; height: 73%; background: linear-gradient(180deg, #efefef 0%, #fff 100%); } .pxl-icons__style-3 .half-circle--3 { width: 47%; height: 47%; background: linear-gradient(180deg, #eaeaea 0%, #fff 100%); } .pxl-swiper-slider__partner-style-1 .pxl-swiper-slider__item-logo { text-align: center; } @media screen and (min-width: 1400px) { .pxl-swiper-slider__partner-style-1 .pxl-swiper-slider__partner-auto .pxl-swiper-slider__wrapper { gap: 64px; } .pxl-swiper-slider__partner-style-1 .pxl-swiper-slider__partner-auto .pxl-swiper-slider__wrapper .pxl-swiper-slider__item { padding: 0; } } .pxl-swiper-slider__partner-style-2 .pxl-swiper-slider__inner, .pxl-swiper-slider__partner-style-2 .pxl-swiper-container { overflow: visible; } .pxl-swiper-slider__partner-style-2 .pxl-swiper-slider__item { width: 480px; aspect-ratio: 1/1; display: flex; align-items: center; justify-content: center; border-radius: 999px; position: relative; padding: 0; } .pxl-swiper-slider__partner-style-2 .pxl-swiper-slider__item-inner, .pxl-swiper-slider__partner-style-2 .pxl-swiper-slider__item-logo, .pxl-swiper-slider__partner-style-2 .pxl-swiper-slider__item-logo a { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; } .pxl-swiper-slider__partner-style-2 .pxl-swiper-slider__item::before { content: ""; position: absolute; width: calc(100% + 80px); height: calc(100% + 80px); background-color: transparent; border-radius: 999px; border: 2px solid #717680; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: -1; opacity: 0.24; } .pxl-swiper-slider__partner-style-2 .pxl-swiper-slider__item.swiper-slide-active::before { opacity: 1; } @media screen and (max-width: 1200px) { .pxl-swiper-slider__partner-style-2 .pxl-swiper-slider__item { width: 320px; } .pxl-swiper-slider__partner-style-2 .pxl-swiper-slider__item::before { width: calc(100% + 40px); height: calc(100% + 40px); } } @media screen and (max-width: 991px) { .pxl-swiper-slider__partner-style-2 .pxl-swiper-slider__item { width: 240px; } .pxl-swiper-slider__partner-style-2 .pxl-swiper-slider__item::before { width: calc(100% + 20px); height: calc(100% + 20px); } } .pxl-swiper-slider__language .pxl-swiper-slider__inner { overflow: unset; } .pxl-swiper-slider__language .pxl-swiper-container { overflow: unset; } .pxl-swiper-slider__language .pxl-swiper-slider__item { padding: 0 6px; } .pxl-swiper-slider__language .pxl-swiper-slider__item-inner { display: flex; justify-content: center; align-items: center; padding: 13px 16px; gap: 12px; background-color: #f5f5f5; box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); -webkit-border-radius: 12px; -khtml-border-radius: 12px; -moz-border-radius: 12px; -ms-border-radius: 12px; -o-border-radius: 12px; border-radius: 12px; } .pxl-swiper-slider__language .pxl-swiper-slider__item-inner img { -webkit-border-radius: 4px; -khtml-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; opacity: 0; visibility: hidden; } .pxl-swiper-slider__language .pxl-swiper-slider__item-inner p { margin: 0; opacity: 0; visibility: hidden; color: var(--primary-color); } .pxl-swiper-slider__language .pxl-swiper-slider__item.swiper-slide-prev, .pxl-swiper-slider__language .pxl-swiper-slider__item.swiper-slide-active, .pxl-swiper-slider__language .pxl-swiper-slider__item.swiper-slide-next { background-color: #fff; } .pxl-swiper-slider__language .pxl-swiper-slider__item.swiper-slide-prev img, .pxl-swiper-slider__language .pxl-swiper-slider__item.swiper-slide-active img, .pxl-swiper-slider__language .pxl-swiper-slider__item.swiper-slide-next img { opacity: 1; visibility: visible; } .pxl-swiper-slider__language .pxl-swiper-slider__item.swiper-slide-prev p, .pxl-swiper-slider__language .pxl-swiper-slider__item.swiper-slide-active p, .pxl-swiper-slider__language .pxl-swiper-slider__item.swiper-slide-next p { opacity: 1; visibility: visible; } .testimonial { position: relative; } .testimonial-1 .pxl-swiper-slider__inner, .testimonial-1 .pxl-swiper-container { overflow: visible; } .testimonial-1 .testimonial-item { padding: 40px 16px; } .testimonial-1 .testimonial-item::before { content: ''; background: linear-gradient(299deg, rgba(173, 157, 255, 0) 0%, rgba(158, 229, 255, 0) 49.19%, rgba(220, 160, 255, 0) 98.39%); filter: blur(28px); width: calc(100% - 120px); height: calc(100% - 120px); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-border-radius: 16px; -khtml-border-radius: 16px; -moz-border-radius: 16px; -ms-border-radius: 16px; -o-border-radius: 16px; border-radius: 16px; z-index: -1; transition: all 0.3s ease; } .testimonial-1 .testimonial-item__inner { padding: 34px 32px 32px; min-height: 558px; background-color: #f5f5f5; -webkit-border-radius: 16px; -khtml-border-radius: 16px; -moz-border-radius: 16px; -ms-border-radius: 16px; -o-border-radius: 16px; border-radius: 16px; display: flex; flex-direction: column; justify-content: space-between; transition: all 0.3s ease; } .testimonial-1 .testimonial-item__hidden-content { width: 100%; max-width: 256px; margin-left: auto; height: 90px; position: relative; margin-bottom: 24px; } .testimonial-1 .testimonial-item__hidden-content span { width: 100%; height: 10px; background-color: #e9edeb; -webkit-border-radius: 50px; -khtml-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; border-radius: 50px; display: block; position: absolute; bottom: 36px; } .testimonial-1 .testimonial-item__hidden-content span:before { content: ""; width: 100%; height: 10px; background-color: #e9edeb; -webkit-border-radius: 50px; -khtml-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; border-radius: 50px; display: block; position: absolute; bottom: -18px; } .testimonial-1 .testimonial-item__hidden-content span:after { content: ""; display: block; width: 100%; height: 10px; background-color: #e9edeb; -webkit-border-radius: 50px; -khtml-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; border-radius: 50px; position: absolute; bottom: -36px; width: 176px; } .testimonial-1 .testimonial-item__name-content { color: #a4a7ae; margin-left: 16px; } .testimonial-1 .testimonial-item__content { padding: 16px; background-color: #fff; -webkit-border-radius: 16px; -khtml-border-radius: 16px; -moz-border-radius: 16px; -ms-border-radius: 16px; -o-border-radius: 16px; border-radius: 16px; margin: 8px 0 0 0; transition: all 0.3s ease; } .testimonial-1 .testimonial-item__content-1 { margin-top: 12px; } .testimonial-1 .testimonial-item__holder { position: relative; display: flex; gap: 16px; } .testimonial-1 .testimonial-item__holder::before { content: ""; background: linear-gradient(90deg, rgba(233, 234, 235, 0.00) 0%, #e9eaeb 50%, rgba(233, 234, 235, 0.00) 100%); display: flex; height: 2px; top: -33px; position: absolute; width: 100%; } .testimonial-1 .testimonial-item__holder .testimonial-item__avatar { width: 48px; object-fit: cover; aspect-ratio: 1/1; overflow: hidden; } .testimonial-1 .testimonial-item__holder .testimonial-item__avatar img { width: 100%; height: 100%; } .testimonial-1 .testimonial-item__holder .testimonial-item__meta { display: flex; flex-direction: column; gap: 6px; justify-content: center; } .testimonial-1 .testimonial-item__holder .testimonial-item__meta-name { font-size: 16px; color: var(--primary-color); font-weight: 500; margin: 0; } .testimonial-1 .testimonial-item__holder .testimonial-item__meta-position { font-size: 14px; color: #535862; margin: 0; } .testimonial-1 .testimonial-item:hover::before { background: linear-gradient(299deg, rgba(173, 157, 255, 0.88) 0%, rgba(158, 229, 255, 0.88) 49.19%, rgba(220, 160, 255, 0.88) 98.39%); } .testimonial-1 .testimonial-item:hover .testimonial-item__inner { background-color: #fff; } .testimonial-1 .testimonial-item:hover .testimonial-item__content { background-color: #7f56d9; color: #fff; } .testimonial-2 .pxl-swiper-slider__inner, .testimonial-2 .pxl-swiper-container { overflow: visible; } .testimonial-2 .pxl-swiper-slider__wrapper { padding: 24px 0; transition-timing-function: linear; } .testimonial-2 .pxl-swiper-slider__wrapper .pxl-swiper-slider__item .testimonial-item__inner { display: flex; gap: 40px; align-items: center; padding: 12px; border-radius: 16px; border: 1px solid #e9eaeb; } .testimonial-2 .pxl-swiper-slider__wrapper .pxl-swiper-slider__item .testimonial-item__inner .testimonial-item__image { width: 100%; } @media screen and (max-width: 1200px) { .testimonial-2 .pxl-swiper-slider__wrapper .pxl-swiper-slider__item .testimonial-item__inner .testimonial-item__image { width: 150px; } } @media screen and (max-width: 575px) { .testimonial-2 .pxl-swiper-slider__wrapper .pxl-swiper-slider__item .testimonial-item__inner .testimonial-item__image { width: 120px; } } .testimonial-2 .pxl-swiper-slider__wrapper .pxl-swiper-slider__item .testimonial-item__inner .testimonial-item__image img { width: 100%; max-width: 294px; min-width: 294px; border-radius: 8px; aspect-ratio: 1/1; } @media screen and (max-width: 1200px) { .testimonial-2 .pxl-swiper-slider__wrapper .pxl-swiper-slider__item .testimonial-item__inner .testimonial-item__image img { max-width: 150px; min-width: 150px; } } @media screen and (max-width: 575px) { .testimonial-2 .pxl-swiper-slider__wrapper .pxl-swiper-slider__item .testimonial-item__inner .testimonial-item__image img { max-width: 120px; min-width: 120px; } } .testimonial-2 .pxl-swiper-slider__wrapper .pxl-swiper-slider__item .testimonial-item__inner .testimonial-item__content { display: flex; flex-direction: column; gap: 16px; } .testimonial-2 .pxl-swiper-slider__wrapper .pxl-swiper-slider__item .testimonial-item__inner .testimonial-item__content-text { font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.8px; color: var(--primary-color); } @media screen and (max-width: 1200px) { .testimonial-2 .pxl-swiper-slider__wrapper .pxl-swiper-slider__item .testimonial-item__inner .testimonial-item__content-text { font-size: 18px; } } @media screen and (max-width: 767px) { .testimonial-2 .pxl-swiper-slider__wrapper .pxl-swiper-slider__item .testimonial-item__inner .testimonial-item__content-text { font-size: 16px; } } @media screen and (max-width: 575px) { .testimonial-2 .pxl-swiper-slider__wrapper .pxl-swiper-slider__item .testimonial-item__inner .testimonial-item__content-text { font-size: 14px; } } .testimonial-2 .pxl-swiper-slider__wrapper .pxl-swiper-slider__item .testimonial-item__inner .testimonial-item__content-name { font-size: 14px; font-weight: 500; line-height: 1.3; letter-spacing: -0.28px; color: #535862; } .testimonial-3>svg { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 0; } .testimonial-3 .pxl-swiper-slider__inner, .testimonial-3 .pxl-swiper-container { overflow: hidden; z-index: 1; } .testimonial-3 .pxl-swiper-slider__avatars { width: 368px; height: 80px; position: relative; margin: 0 auto; margin-bottom: 48px; z-index: 1; } @media screen and (max-width: 575px) { .testimonial-3 .pxl-swiper-slider__avatars { width: 290px; } } .testimonial-3 .pxl-swiper-slider__avatars .pxl-swiper-slider__avatar { cursor: pointer; display: none; position: absolute; bottom: 0; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; } .testimonial-3 .pxl-swiper-slider__avatars .pxl-swiper-slider__avatar img { width: 56px; object-fit: cover; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; } @media screen and (max-width: 575px) { .testimonial-3 .pxl-swiper-slider__avatars .pxl-swiper-slider__avatar img { width: 48px; } } .testimonial-3 .pxl-swiper-slider__avatars .pxl-swiper-slider__avatar.active { display: block; left: 50%; transform: translateX(-50%); padding: 4px; border: 2px solid #717680; } .testimonial-3 .pxl-swiper-slider__avatars .pxl-swiper-slider__avatar.active img { width: 64px; } .testimonial-3 .pxl-swiper-slider__avatars .pxl-swiper-slider__avatar.active-1 { display: block; left: 0; opacity: 0.4; } .testimonial-3 .pxl-swiper-slider__avatars .pxl-swiper-slider__avatar.active-2 { display: block; left: 72px; opacity: 0.88; } @media screen and (max-width: 575px) { .testimonial-3 .pxl-swiper-slider__avatars .pxl-swiper-slider__avatar.active-2 { left: 56px; } } .testimonial-3 .pxl-swiper-slider__avatars .pxl-swiper-slider__avatar.active-4 { display: block; right: 72px; opacity: 0.88; } @media screen and (max-width: 575px) { .testimonial-3 .pxl-swiper-slider__avatars .pxl-swiper-slider__avatar.active-4 { right: 56px; } } .testimonial-3 .pxl-swiper-slider__avatars .pxl-swiper-slider__avatar.active-5 { display: block; right: 0; opacity: 0.4; } .testimonial-3 .testimonial-item__content { text-align: center; } .testimonial-3 .testimonial-item__content-text { font-size: 48px; font-weight: 500; line-height: 1.2; letter-spacing: -2.4px; color: #717680; margin-bottom: 48px; } .testimonial-3 .testimonial-item__content-text em { color: #fff; font-style: normal; } .testimonial-3 .testimonial-item__meta { display: flex; justify-content: center; align-items: center; margin-bottom: 64px; gap: 6px; } .testimonial-3 .testimonial-item__meta-name { color: #fff; } .testimonial-3 .testimonial-item__meta-position { color: #717680; } .testimonial-3 .pxl-swiper__nav { z-index: 1; position: relative; } .testimonial-4 .pxl-swiper-container, .testimonial-4 .pxl-swiper-slider__inner { overflow: unset; } .testimonial-4 .testimonial-item { padding: 30px 15px; overflow: visible; } .testimonial-4 .testimonial-item__meta { display: flex; flex-direction: column; gap: 8px; } .testimonial-4 .testimonial-item__meta .testimonial-item__avatar { margin-bottom: 8px; border: 3px solid #f8f9fc; border-radius: 50%; overflow: hidden; width: fit-content; margin: 0 auto; } .testimonial-4 .testimonial-item__meta .testimonial-item__name { font-size: 18px; font-weight: 500; line-height: 1.35; letter-spacing: -0.36px; } .testimonial-4 .testimonial-item__meta .testimonial-item__pos { font-size: 14px; font-weight: 400; line-height: 1.3; letter-spacing: -0.28px; } .testimonial-4 .testimonial-item.swiper-slide-visible .testimonial-item__inner { opacity: 1; visibility: visible; } .testimonial-4 .testimonial-item__inner { opacity: 0; visibility: hidden; will-change: opacity; min-height: 368px; padding: 40px; border-radius: 16px; background: #fff; box-shadow: 0px 16px 80px -16px rgba(24, 29, 39, 0.16); display: flex; flex-direction: column; gap: 48px; text-align: center; align-items: center; transition: all 0.3s ease; } .testimonial-4 .testimonial-item__inner .testimonial-item__content { display: flex; flex-direction: column; gap: 16px; } .testimonial-4 .testimonial-item__inner .testimonial-item__content .testimonial-item__star { display: flex; gap: 8px; justify-content: center; } .testimonial-4 .testimonial-item__inner .testimonial-item__content .testimonial-item__star-wrap { display: flex; gap: 4px; } .testimonial-4 .testimonial-item__inner .testimonial-item__content .testimonial-item__star-number { font-size: 14px; color: var(--third-color); letter-spacing: -0.28px; } .testimonial-4 .testimonial-item__inner .testimonial-item__content-text { color: var(--primary-color); font-weight: 500; } .testimonial-5 .testimonial-item__inner { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 64px; max-width: 924px; margin: 0 auto; } @media screen and (max-width: 575px) { .testimonial-5 .testimonial-item__inner { gap: 24px; } } .testimonial-5 .testimonial-item__inner .testimonial-item__content { font-size: 32px; font-weight: 500; line-height: 1.2; letter-spacing: -1.28px; text-align: center; } @media screen and (max-width: 575px) { .testimonial-5 .testimonial-item__inner .testimonial-item__content { font-size: 24px; } } .testimonial-5 .testimonial-item__inner .testimonial-item__content em { font-style: normal; color: var(--primary-color); } .testimonial-5 .testimonial-item__inner .testimonial-item__author { display: flex; gap: 16px; align-items: center; } .testimonial-5 .testimonial-item__inner .testimonial-item__author-avt { width: 70px; height: 70px; border: 3px solid #fff; border-radius: 50%; } .testimonial-5 .testimonial-item__inner .testimonial-item__author-cnt { display: flex; flex-direction: column; gap: 8px; } .testimonial-5 .testimonial-item__inner .testimonial-item__author-name { color: var(--primary-color); font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.8px; } .testimonial-6 { display: flex; flex-direction: column; justify-content: space-between; height: 100%; } .testimonial-6 .testimonial-item__inner { display: flex; flex-direction: column; justify-content: center; gap: 40px; max-width: 924px; margin: 0 auto; } .testimonial-6 .testimonial-item__inner .testimonial-item__content { font-size: 32px; font-weight: 500; line-height: 1.2; letter-spacing: -1.28px; color: var(--primary-color); } .testimonial-6 .testimonial-item__inner .testimonial-item__author { display: flex; gap: 16px; align-items: center; margin-left: -3px; } .testimonial-6 .testimonial-item__inner .testimonial-item__author-avt { width: 70px; height: 70px; border: 3px solid #fff; border-radius: 50%; overflow: hidden; } .testimonial-6 .testimonial-item__inner .testimonial-item__author-cnt { display: flex; flex-direction: column; gap: 8px; } .testimonial-6 .testimonial-item__inner .testimonial-item__author-name { color: var(--primary-color); font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.8px; } .testimonial-6 .pxl-swiper__nav { margin-top: 40px; } .pxl-tabs { position: relative; } .pxl-tabs__inner { display: flex; flex-direction: column; } .pxl-tabs__loadmore { display: flex; gap: 6px; align-items: center; cursor: pointer; } .pxl-tabs__list { display: flex; flex-wrap: wrap; flex-flow: row wrap; align-items: center; cursor: pointer; width: fit-content; margin-left: auto; margin-right: auto; } .pxl-tabs__style-1 .pxl-tabs__list { border: 1px solid #d5d7da; padding: 8px; gap: 8px; -webkit-border-radius: 12px; -khtml-border-radius: 12px; -moz-border-radius: 12px; -ms-border-radius: 12px; -o-border-radius: 12px; border-radius: 12px; } .pxl-tabs__style-1 .pxl-tabs__list-item { padding: 9px 16px; -webkit-border-radius: 8px; -khtml-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; border-radius: 8px; color: #535862; overflow: hidden; } .pxl-tabs__style-1 .pxl-tabs__list-item.active { color: #fff; background-color: var(--secondary-color); } .pxl-tabs__style-2 .pxl-tabs__list { padding: 4px; background-color: var(--primary-color); -webkit-border-radius: 50px; -khtml-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; border-radius: 50px; margin-bottom: 88px; } @media screen and (max-width: 575px) { .pxl-tabs__style-2 .pxl-tabs__list { margin-bottom: 30px; } } .pxl-tabs__style-2 .pxl-tabs__list-item { padding: 7px 16px; -webkit-border-radius: 50px; -khtml-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; border-radius: 50px; background-color: transparent; transition: all 0.3s ease; color: #fff; } .pxl-tabs__style-2 .pxl-tabs__list-item.active { background-color: #fff; color: var(--primary-color); } .pxl-tabs__content>.pxl-tabs__item { display: none; } .pxl-tabs__content>.pxl-tabs__item.active { display: block; } .pxl-tabs--layout-2 .pxl-tabs__list { gap: 8px; margin-bottom: 80px; flex-flow: row wrap; justify-content: center; } @media screen and (max-width: 575px) { .pxl-tabs--layout-2 .pxl-tabs__list { margin-bottom: 30px; } } .pxl-tabs--layout-2 .pxl-tabs__list-item { font-size: 14px; display: flex; gap: 4px; font-size: 14px; font-weight: 500; line-height: 1.3; letter-spacing: -0.28px; padding: 7px 16px; border-radius: 50px; border: 1px solid #d5d7da; color: var(--primary-color); background-color: #fff; transition: all 0.3s ease; } .pxl-tabs--layout-2 .pxl-tabs__list-item.active, .pxl-tabs--layout-2 .pxl-tabs__list-item:hover { border-color: var(--primary-color); background-color: var(--primary-color); color: #fff; } .pxl-tabs--layout-2 .pxl-tabs__list-item img { width: 14px; } .pxl-tabs--layout-2 .pxl-tabs__faqs-loadmore { margin: 0 auto; width: fit-content; } .pxl-tabs--layout-3 .pxl-tabs__input-number-group { display: flex; gap: px; flex-flow: row wrap; align-items: center; justify-content: center; background-color: #eaecf5; padding: 4px; border-radius: 50px; width: fit-content; margin: 0 auto; margin-bottom: 24px; } .pxl-tabs--layout-3 .pxl-tabs__input-number-group .pxl-tabs__input-number { display: flex; gap: 4px; } .pxl-tabs--layout-3 .pxl-tabs__input-number-group .pxl-tabs__input-number input[type="radio"] { display: none; } .pxl-tabs--layout-3 .pxl-tabs__input-number-group .pxl-tabs__input-number input[type="radio"]+label { color: var(--primary-color); font-size: 14px; font-weight: 500; line-height: 1.3; letter-spacing: -0.28px; display: flex; align-items: center; justify-content: center; transition: all 0.3s ease; height: 32px; padding: 0; gap: 3px; padding: 0 12px; cursor: pointer; } .pxl-tabs--layout-3 .pxl-tabs__input-number-group .pxl-tabs__input-number input[type="radio"]+label span.pxl-tabs__input-number-txt-after { display: none; } .pxl-tabs--layout-3 .pxl-tabs__input-number-group .pxl-tabs__input-number input[type="radio"]:checked+label { background-color: #fff; box-shadow: 0 1px 1px -0.5px rgba(0, 0, 0, 0.04), 0 3px 3px -1.5px rgba(0, 0, 0, 0.04), 0 24px 24px -12px rgba(0, 0, 0, 0.04); border-radius: 50px; cursor: default; } .pxl-tabs--layout-3 .pxl-tabs__input-number-group .pxl-tabs__input-number input[type="radio"]:checked+label span.pxl-tabs__input-number-txt-after { display: block; } .pxl-tabs--layout-3 .pxl-tabs__input-number-group .pxl-tabs__input-number.active+.pxl-tabs__input-number-custom { display: block; } .pxl-tabs--layout-3 .pxl-tabs__input-number-group .pxl-tabs__input-number-custom { display: none; } .pxl-tabs--layout-3 .pxl-tabs__input-number-group .pxl-tabs__input-number-custom input { width: 80px; border: none; background-color: #fff; box-shadow: 0 1px 1px -0.5px rgba(0, 0, 0, 0.04), 0 3px 3px -1.5px rgba(0, 0, 0, 0.04), 0 24px 24px -12px rgba(0, 0, 0, 0.04); height: 32px; border-radius: 50px; padding: 0 16px; font-size: 14px; font-weight: 500; line-height: 1.3; letter-spacing: -0.28px; text-align: center; margin-left: 5px; } .pxl-tabs--layout-3 .pxl-tabs__switch-currency { width: fit-content; margin: 0 auto; display: flex; gap: 16px; align-items: center; justify-content: center; margin-bottom: 24px; } .pxl-tabs--layout-3 .pxl-tabs__switch-currency-item { display: flex; gap: 4px; align-items: center; justify-content: center; cursor: pointer; } .pxl-tabs--layout-3 .pxl-tabs__switch-currency-item input[type="radio"] { margin: -1px 0 0; } .pxl-tabs--layout-3 .pxl-tabs__switch-currency-item label { cursor: pointer; color: var(--primary-color); font-size: 14px; font-weight: 500; line-height: 1; letter-spacing: -0.28px; } .pxl-tabs--layout-3.pxl-tabs--toogle-style-1 .pxl-tabs__switch { display: flex; gap: 16px; flex-flow: row wrap; align-items: center; justify-content: center; margin-bottom: 24px; } .pxl-tabs--layout-3.pxl-tabs--toogle-style-1 .pxl-tabs__switch .toggleTab { display: flex; width: 60px; height: 32px; background-color: #0a0d12; position: relative; border-radius: 50px; cursor: pointer; } @media screen and (max-width: 575px) { .pxl-tabs--layout-3.pxl-tabs--toogle-style-1 .pxl-tabs__switch .toggleTab { width: 45px; height: 24px; } } .pxl-tabs--layout-3.pxl-tabs--toogle-style-1 .pxl-tabs__switch .toggleTab::before { content: ""; position: absolute; width: 28px; height: 28px; display: block; border-radius: 50%; background-color: #fff; left: 2px; top: 50%; transform: translate(0, -50%); transition: all 0.3s ease; } @media screen and (max-width: 575px) { .pxl-tabs--layout-3.pxl-tabs--toogle-style-1 .pxl-tabs__switch .toggleTab::before { left: 1.5px; width: 21px; height: 21px; } } .pxl-tabs--layout-3.pxl-tabs--toogle-style-1 .pxl-tabs__switch #toggleTab { display: none; } .pxl-tabs--layout-3.pxl-tabs--toogle-style-1 .pxl-tabs__switch #toggleTab:checked+.toggleTab::before { transform: translate(100%, -50%); } .pxl-tabs--layout-3.pxl-tabs--toogle-style-1 .pxl-tabs__switch-txt { font-weight: 500; color: var(--primary-color); } .pxl-tabs--layout-3.pxl-tabs--toogle-style-1 .pxl-tabs__switch-sale { padding: 7px 16px; border-radius: 8px; color: #3e1c96; background-color: #ebe9fe; font-size: 14px; font-weight: 500; line-height: 1.3; } .pxl-tabs--layout-3.pxl-tabs--toogle-style-2 .pxl-tabs__switch { display: flex; gap: 16px; flex-flow: row wrap; align-items: center; justify-content: center; margin-bottom: 24px; } .pxl-tabs--layout-3.pxl-tabs--toogle-style-2 .pxl-tabs__switch .pxl-tabs__switch-btn { order: 2; } .pxl-tabs--layout-3.pxl-tabs--toogle-style-2 .pxl-tabs__switch .toggleTab { display: flex; width: 36px; height: 20px; background-color: #e5e5e5; position: relative; border-radius: 50px; cursor: pointer; } @media screen and (max-width: 575px) { .pxl-tabs--layout-3.pxl-tabs--toogle-style-2 .pxl-tabs__switch .toggleTab { width: 30px; height: 18px; } } .pxl-tabs--layout-3.pxl-tabs--toogle-style-2 .pxl-tabs__switch .toggleTab::before { content: ""; position: absolute; width: 16px; height: 16px; display: block; border-radius: 50%; background-color: #000; left: 2px; top: 50%; transform: translate(0, -50%); transition: all 0.3s ease; } @media screen and (max-width: 575px) { .pxl-tabs--layout-3.pxl-tabs--toogle-style-2 .pxl-tabs__switch .toggleTab::before { left: 1.5px; width: 21px; height: 21px; } } .pxl-tabs--layout-3.pxl-tabs--toogle-style-2 .pxl-tabs__switch #toggleTab { display: none; } .pxl-tabs--layout-3.pxl-tabs--toogle-style-2 .pxl-tabs__switch #toggleTab:checked+.toggleTab::before { transform: translate(100%, -50%); } .pxl-tabs--layout-3.pxl-tabs--toogle-style-2 .pxl-tabs__switch-txt { font-weight: 500; color: #606060; order: 3; } .pxl-tabs--layout-3.pxl-tabs--toogle-style-2 .pxl-tabs__switch-sale { color: #000; font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -0.48px; order: 1; } .pxl-tabs--layout-4 .pxl-tabs__inner { display: flex; flex-direction: row; gap: 48px; align-items: center; justify-content: center; } @media screen and (max-width: 1200px) { .pxl-tabs--layout-4 .pxl-tabs__inner { flex-direction: column; gap: 24px; } } .pxl-tabs--layout-4 .pxl-tabs__list { display: flex; flex-direction: column; width: 100%; max-width: 300px; gap: 12px; } @media screen and (max-width: 1200px) { .pxl-tabs--layout-4 .pxl-tabs__list { max-width: 100%; flex-flow: row wrap; justify-content: center; gap: 8px; } } .pxl-tabs--layout-4 .pxl-tabs__list .pxl-tabs__list-item { display: flex; padding: 17px 20px; align-items: center; gap: 8px; align-self: stretch; border-radius: 20px; border: 0.5px solid transparent; background: transparent; color: #606060; font-family: Geist; font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -0.48px; transition: all 0.3s ease; } @media screen and (max-width: 767px) { .pxl-tabs--layout-4 .pxl-tabs__list .pxl-tabs__list-item { font-size: 14px; padding: 12px 16px; } .pxl-tabs--layout-4 .pxl-tabs__list .pxl-tabs__list-item svg { width: 16px; height: 16px; } } @media screen and (max-width: 575px) { .pxl-tabs--layout-4 .pxl-tabs__list .pxl-tabs__list-item { gap: 4px; font-size: 12px; padding: 8px 12px; } .pxl-tabs--layout-4 .pxl-tabs__list .pxl-tabs__list-item svg { width: 14px; height: 14px; } } .pxl-tabs--layout-4 .pxl-tabs__list .pxl-tabs__list-item.active { box-shadow: 0 1px 1px -0.5px rgba(0, 0, 0, 0.04), 0 3px 3px -1.5px rgba(0, 0, 0, 0.04), 0 24px 24px -12px rgba(0, 0, 0, 0.04); border-color: #efefef; background-color: #fff; color: var(--primary-color); font-weight: 500; } .pxl-tabs--layout-4 .pxl-tabs__content { width: 100%; } .pxl-pricing { position: relative; } .pxl-pricing__style-1 { padding: 32px; border-radius: 16px; border: 1px solid #d5d7da; } .pxl-pricing__style-1.pxl-pricing__active { border-color: #fff; background-color: #fff; } .pxl-pricing__style-1.pxl-pricing__active:before { content: ""; background: linear-gradient(299deg, rgba(173, 157, 255, 0.88) 0%, rgba(158, 229, 255, 0.88) 49.19%, rgba(220, 160, 255, 0.88) 98.39%); border-radius: 16px; filter: blur(28px); z-index: -1; position: absolute; width: calc(100% - 28px); height: calc(100% - 28px); top: 50%; left: 50%; transform: translate(-50%, -50%); } .pxl-pricing__style-1 .pxl-pricing__plan { background-color: #e9eaeb; padding: 5px 8px; border-radius: 8px; width: fit-content; } .pxl-pricing__style-1 .pxl-pricing__price { position: relative; margin: 16px 0; } .pxl-pricing__style-1 .pxl-pricing__price-detail { font-size: 40px; font-weight: 500; letter-spacing: -2px; color: var(--primary-color); } .pxl-pricing__style-1 .pxl-pricing__price-period { color: var(--primary-color); } .pxl-pricing__style-1 .pxl-pricing__desc { color: #535862; } .pxl-pricing__style-1 .pxl-pricing__featured { padding: 26px 0 0 0; margin: 24px 0 64px 0; list-style: none; position: relative; } .pxl-pricing__style-1 .pxl-pricing__featured::before { content: ""; background: linear-gradient(90deg, rgba(233, 234, 235, 0.00) 0%, #e9eaeb 50%, rgba(233, 234, 235, 0.00) 100%); width: 100%; height: 2px; top: 0; position: absolute; display: block; } .pxl-pricing__style-1 .pxl-pricing__featured li { display: flex; color: var(--primary-color); align-items: center; gap: 6px; } .pxl-pricing__style-1 .pxl-pricing__featured li+li { margin-top: 16px; } .pxl-pricing__style-1 .pxl-pricing__button { width: 100%; display: block; text-align: center; border-radius: 8px; font-weight: 500; border: 1px solid #d5d7da; } .pxl-pricing__style-2 .pxl-pricing__top { display: flex; flex-direction: column; justify-content: space-between; align-items: center; gap: 24px; min-height: 186px; position: relative; } .pxl-pricing__style-2 .pxl-pricing__top-price { display: flex; gap: 24px; flex-direction: column; } .pxl-pricing__style-2 .pxl-pricing__top .pxl-pricing__plan { font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.8px; color: var(--primary-color); } .pxl-pricing__style-2 .pxl-pricing__top .pxl-pricing__price { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 6px; } .pxl-pricing__style-2 .pxl-pricing__top .pxl-pricing__price-detail { font-size: 40px; font-weight: 500; line-height: 1.2; letter-spacing: -2px; color: var(--primary-color); } .pxl-pricing__style-2 .pxl-pricing__top .pxl-pricing__price-period { font-size: 14px; font-weight: 400; line-height: 1.3; letter-spacing: -0.28px; color: #535862; } .pxl-pricing__style-2 .pxl-pricing__top .pxl-pricing__button { padding: 9px 20px; border: 1px solid #d5d7da; color: var(--primary-color); border-radius: 12px; width: 100%; text-align: center; } .pxl-pricing__style-2 .pxl-pricing__featured { list-style: none; margin: 48px 0 0; padding: 0; } .pxl-pricing__style-2 .pxl-pricing__featured-item { min-height: 64px; display: flex; flex-direction: column; justify-content: center; align-items: center; } .pxl-pricing__style-2.pxl-pricing__active .pxl-pricing__top::before { content: ""; position: absolute; top: -64px; bottom: -24px; left: 0; right: 0; border-radius: 16px; background-color: #2e90fa; z-index: -1; } .pxl-pricing__style-2.pxl-pricing__active .pxl-pricing__top .pxl-pricing__plan { color: #fff; } .pxl-pricing__style-2.pxl-pricing__active .pxl-pricing__top .pxl-pricing__price-detail { color: #fff; } .pxl-pricing__style-2.pxl-pricing__active .pxl-pricing__top .pxl-pricing__price-period { color: #e9eaeb; } .pxl-pricing__style-2.pxl-pricing__active .pxl-pricing__top .pxl-pricing__button { width: calc(100% - 48px); border-color: #fff; background-color: #fff; } .pxl-pricing__style-3 { padding: 12px; background-color: #fff; -webkit-border-radius: 24px; -khtml-border-radius: 24px; -moz-border-radius: 24px; -ms-border-radius: 24px; -o-border-radius: 24px; border-radius: 24px; } .pxl-pricing__style-3 .pxl-pricing__top { padding: 12px 80px 12px 12px; } .pxl-pricing__style-3 .pxl-pricing__top .pxl-pricing__title { margin-bottom: 16px; } .pxl-pricing__style-3 .pxl-pricing__top .pxl-pricing__desc { font-weight: 400; color: #535862; margin-bottom: 24px; } .pxl-pricing__style-3 .pxl-pricing__top .pxl-pricing__icon { position: absolute; top: 24px; right: 24px; border-radius: 99px; background: #007aff; width: 60px; height: 40px; display: flex; justify-content: center; align-items: center; } .pxl-pricing__style-3 .pxl-pricing__top .pxl-pricing__icon svg, .pxl-pricing__style-3 .pxl-pricing__top .pxl-pricing__icon i { z-index: 1; } .pxl-pricing__style-3 .pxl-pricing__top .pxl-pricing__icon::before { content: ""; background-color: rgba(0, 122, 255, 0.20); top: -3px; left: -3px; right: -3px; bottom: -3px; border-radius: 99px; position: absolute; } .pxl-pricing__style-3 .pxl-pricing__top .pxl-pricing__price { font-size: 24px; font-weight: 500; line-height: 125%; letter-spacing: -0.96px; } .pxl-pricing__style-3 .pxl-pricing__button { display: inline-flex; width: 100%; border-radius: 44px; background: #e9eaeb; padding: 4px 4px 4px 16px; justify-content: space-between; align-items: center; margin-bottom: 16px; } .pxl-pricing__style-3 .pxl-pricing__button-text { color: var(--primary-color); } .pxl-pricing__style-3 .pxl-pricing__button-icon { width: 64px; height: 40px; border-radius: 64px; background-color: #fff; display: flex; justify-content: center; align-items: center; } .pxl-pricing__style-3 .pxl-pricing__button:hover { background-color: var(--secondary-color); } .pxl-pricing__style-3 .pxl-pricing__button:hover .pxl-pricing__button-text { color: #fff; } .pxl-pricing__style-3 .pxl-pricing__featured { min-height: 360px; border-radius: 16px; border: 1px solid #e9eaeb; padding: 24px; margin: 0; list-style: none; display: flex; flex-direction: column; gap: 16px; } .pxl-pricing__style-3 .pxl-pricing__featured-item { font-weight: 400; color: var(--primary-color); padding-left: 14px; position: relative; } .pxl-pricing__style-3 .pxl-pricing__featured-item::before { content: ""; position: absolute; top: 8px; left: 0; width: 6px; height: 6px; background-color: var(--primary-color); -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; } .pxl-pricing__style-3.pxl-pricing__active { box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); } .pxl-pricing__style-3.pxl-pricing__active .pxl-pricing__button { background-color: var(--primary-color); } .pxl-pricing__style-3.pxl-pricing__active .pxl-pricing__button-text { color: #fff; } .pxl-pricing__style-4 { border-radius: 16px; border: 1px solid #d5d7da; background: #f8f9fc; padding: 8px; transition: all 0.3s ease; } .pxl-pricing__style-4 .pxl-pricing__top { padding: 16px; position: relative; } .pxl-pricing__style-4 .pxl-pricing__top .pxl-pricing__popular { position: absolute; top: 16px; right: 16px; padding: 3px 12px; border-radius: 99px; background-color: var(--secondary-color); color: #fff; transition: all 0.3s ease; display: flex; align-items: center; gap: 6px; } .pxl-pricing__style-4 .pxl-pricing__top .pxl-pricing__title { font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.8px; margin-bottom: 24px; color: var(--primary-color); transition: all 0.3s ease; } .pxl-pricing__style-4 .pxl-pricing__top .pxl-pricing__title svg { margin-bottom: -2px; } .pxl-pricing__style-4 .pxl-pricing__top .pxl-pricing__price-detail { font-size: 48px; font-weight: 500; line-height: 1.2; letter-spacing: -2.4px; color: var(--primary-color); transition: all 0.3s ease; } .pxl-pricing__style-4 .pxl-pricing__top .pxl-pricing__price-period { color: var(--third-color); transition: all 0.3s ease; font-weight: 400; } .pxl-pricing__style-4 .pxl-pricing__top .pxl-pricing__option { margin-top: 7px; font-size: 14px; color: var(--third-color); transition: all 0.3s ease; font-weight: 400; line-height: 1.3; display: flex; align-items: center; letter-spacing: -0.28px; gap: 6px; width: fit-content; cursor: pointer; } .pxl-pricing__style-4 .pxl-pricing__top .pxl-pricing__option svg path { fill: var(--third-color); } .pxl-pricing__style-4 .pxl-pricing__top .pxl-pricing__option:hover { color: var(--secondary-color); } .pxl-pricing__style-4 .pxl-pricing__top .pxl-pricing__option:hover svg path { fill: var(--secondary-color); } .pxl-pricing__style-4 .pxl-pricing__top .pxl-pricing__desc { margin: 25px 0 7px; } .pxl-pricing__style-4 .pxl-pricing__bottom { border-radius: 12px; background: #fff; padding: 25px 24px 23px; } .pxl-pricing__style-4 .pxl-pricing__bottom-tit { font-size: 18px; font-style: normal; font-weight: 500; line-height: 1.35; letter-spacing: -0.36px; color: var(--primary-color); } .pxl-pricing__style-4 .pxl-pricing__bottom-desc { margin: 7px 0 33px; } .pxl-pricing__style-4 .pxl-pricing__bottom .pxl-pricing__fea { display: flex; flex-direction: column; gap: 16px; margin: 0 0 46px; } .pxl-pricing__style-4 .pxl-pricing__bottom .pxl-pricing__fea-item { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; color: var(--primary-color); font-weight: 500; } .pxl-pricing__style-4 .pxl-pricing__bottom .pxl-pricing__button { display: block; width: 100%; text-align: center; padding: 13px; border: 1px solid #d5d7da; border-radius: 8px; transition: all 0.3s ease; } .pxl-pricing__style-4 .pxl-pricing__bottom .pxl-pricing__button:hover { background-color: var(--primary-color); color: #fff; border-color: var(--primary-color); } .pxl-pricing__style-4 .pxl-pricing__bottom-use { margin-top: 14px; text-align: center; } .pxl-pricing__style-4.pxl-pricing__active, .pxl-pricing__style-4:hover { background-color: var(--secondary-color); border-color: var(--secondary-color); } .pxl-pricing__style-4.pxl-pricing__active .pxl-pricing__title, .pxl-pricing__style-4:hover .pxl-pricing__title { color: #fff; } .pxl-pricing__style-4.pxl-pricing__active .pxl-pricing__price-detail, .pxl-pricing__style-4:hover .pxl-pricing__price-detail { color: #fff; } .pxl-pricing__style-4.pxl-pricing__active .pxl-pricing__price-period, .pxl-pricing__style-4:hover .pxl-pricing__price-period { color: #e9eaeb; } .pxl-pricing__style-4.pxl-pricing__active .pxl-pricing__option, .pxl-pricing__style-4:hover .pxl-pricing__option { color: #e9eaeb; } .pxl-pricing__style-4.pxl-pricing__active .pxl-pricing__option svg path, .pxl-pricing__style-4:hover .pxl-pricing__option svg path { fill: #e9eaeb; } .pxl-pricing__style-4.pxl-pricing__active .pxl-pricing__option:hover, .pxl-pricing__style-4:hover .pxl-pricing__option:hover { color: #fff; } .pxl-pricing__style-4.pxl-pricing__active .pxl-pricing__option:hover svg path, .pxl-pricing__style-4:hover .pxl-pricing__option:hover svg path { fill: #fff; } .pxl-pricing__style-4.pxl-pricing__active .pxl-pricing__desc, .pxl-pricing__style-4:hover .pxl-pricing__desc { color: #e9eaeb; } .pxl-pricing__style-4.pxl-pricing__active .pxl-pricing__popular, .pxl-pricing__style-4:hover .pxl-pricing__popular { background-color: #fff; color: var(--primary-color); } .pxl-pricing__style-5 .pxl-pricing__title { color: #fff; margin-bottom: 16px; } .pxl-pricing__style-5 .pxl-pricing__desc { color: #a4a7ae; max-width: 280px; margin-bottom: 48px; } .pxl-pricing__style-5 .pxl-pricing__price { margin-bottom: 16px; } .pxl-pricing__style-5 .pxl-pricing__price-currency { color: #717680; text-decoration-line: line-through; } .pxl-pricing__style-5 .pxl-pricing__price-sale { color: #fff; } .pxl-pricing__style-5 .pxl-pricing__price-period { color: #717680; font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.8px; } .pxl-pricing__style-5 .pxl-pricing__price-desc { color: #fff; margin-bottom: 48px; } .pxl-pricing__style-5 .pxl-pricing__button { border-radius: 6px; border: 1px solid #717680; background: transparent; color: #fff; padding: 13px 20px; font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -0.32px; width: 100%; display: inline-flex; justify-content: center; align-items: center; } .pxl-pricing__style-5 .pxl-pricing__button:hover { background-color: #fff; color: var(--primary-color); border-color: #fff; } .pxl-pricing__style-5 .pxl-pricing__option { margin-top: 16px; color: #a4a7ae; display: flex; align-items: center; justify-content: center; gap: 6px; transition: all 0.3s ease; cursor: pointer; } .pxl-pricing__style-5 .pxl-pricing__option svg path { transition: all 0.3s ease; } .pxl-pricing__style-5 .pxl-pricing__option:hover { color: #fff; } .pxl-pricing__style-5 .pxl-pricing__option:hover svg path { fill: #fff; } .pxl-pricing__style-5 .pxl-pricing__fea { margin: 32px 0 0px; padding: 33px 0 0; border-top: 1px solid rgba(113, 118, 128, 0.24); display: flex; flex-direction: column; gap: 16px; } .pxl-pricing__style-5 .pxl-pricing__fea-item { display: flex; align-items: center; gap: 8px; color: #fff; } .pxl-pricing--style-6 { display: flex; width: 100%; padding: 12px 12px 44px 12px; align-items: flex-start; flex-direction: column; gap: 12px; border-radius: 20px; border: 1px solid #efefef; background: #fff; box-shadow: 0 1px 1px -0.5px rgba(0, 0, 0, 0.04), 0 3px 3px -1.5px rgba(0, 0, 0, 0.04), 0 24px 24px -12px rgba(0, 0, 0, 0.04); } .pxl-pricing--style-6 .pxl-pricing__top { display: flex; padding: 32px; flex-direction: column; align-items: flex-start; align-self: stretch; border-radius: 16px; background: linear-gradient(180deg, #f5f5f5 0%, #fff 100%); transition: all 0.3s ease; } @media screen and (max-width: 767px) { .pxl-pricing--style-6 .pxl-pricing__top { padding: 16px; } } .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__title { color: #181d27; font-size: 24px; font-weight: 600; line-height: 125%; letter-spacing: -0.96px; margin-bottom: 24px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; width: 100%; } @media screen and (max-width: 767px) { .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__title { font-size: 20px; margin-bottom: 16px; } } .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__title .pxl-pricing__plan { color: #181d27; font-size: 24px; font-weight: 600; } @media screen and (max-width: 767px) { .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__title .pxl-pricing__plan { font-size: 20px; } } .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__title .pxl-pricing__popular { display: flex; padding: 5px 12px; align-items: center; gap: 8px; border-radius: 99px; border: 0.5px solid #efefef; background: #fff; box-shadow: 0 1px 1px -0.5px rgba(0, 0, 0, 0.04), 0 3px 3px -1.5px rgba(0, 0, 0, 0.04), 0 24px 24px -12px rgba(0, 0, 0, 0.04); color: #000; font-size: 14px; font-weight: 500; line-height: 130%; letter-spacing: -0.28px; } @media screen and (max-width: 767px) { .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__title .pxl-pricing__popular { font-size: 12px; } } .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__price { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; } .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__price-detail { color: #181d27; font-size: 48px; font-weight: 500; line-height: 120%; letter-spacing: -2.4px; } @media screen and (max-width: 767px) { .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__price-detail { font-size: 32px; letter-spacing: -1.6px; } } .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__price-right { display: flex; flex-direction: column; gap: 4px; } .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__price-period { color: #606060; font-size: 12px; font-weight: 400; line-height: 120%; letter-spacing: -0.24px; } @media screen and (max-width: 767px) { .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__price-period { font-size: 10px; } } .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__price .pxl-pricing__option-text { color: #000; font-size: 14px; font-weight: 500; line-height: 130%; letter-spacing: -0.28px; } @media screen and (max-width: 767px) { .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__price .pxl-pricing__option-text { font-size: 12px; } } .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__desc { color: #000; font-size: 14px; font-weight: 400; line-height: 130%; letter-spacing: -0.28px; margin-bottom: 40px; } @media screen and (max-width: 767px) { .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__desc { font-size: 12px; } } .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__button { display: flex; padding: 17px 20px; justify-content: center; align-items: center; gap: 6px; width: 100%; border-radius: 12px; border: 0.5px solid #efefef; background: #fff; box-shadow: 0 1px 1px -0.5px rgba(0, 0, 0, 0.04), 0 3px 3px -1.5px rgba(0, 0, 0, 0.04), 0 24px 24px -12px rgba(0, 0, 0, 0.04); } @media screen and (max-width: 767px) { .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__button { padding: 12px 16px; margin-bottom: 24px; } } .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__button svg path { transition: all 0.3s ease; stroke: #000; } .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__button:hover { background-color: #000; color: #fff; border-color: #000; } .pxl-pricing--style-6 .pxl-pricing__top .pxl-pricing__button:hover svg path { stroke: #fff; } .pxl-pricing--style-6 .pxl-pricing__fea { list-style: none; padding: 0 32px; margin: 0; display: flex; flex-direction: column; gap: 20px; } @media screen and (max-width: 767px) { .pxl-pricing--style-6 .pxl-pricing__fea { padding: 0 16px; } } .pxl-pricing--style-6 .pxl-pricing__fea-item { display: flex; align-items: center; gap: 8px; color: #000; font-size: 16px; font-weight: 500; line-height: 135%; letter-spacing: -0.32px; } @media screen and (max-width: 767px) { .pxl-pricing--style-6 .pxl-pricing__fea-item { font-size: 14px; } } .pxl-pricing--style-7 { position: relative; width: 100%; } .pxl-pricing--style-7 .pxl-pricing__top { background-color: #fff; width: 100%; border-radius: 36px; padding: 32px; position: relative; } @media screen and (max-width: 767px) { .pxl-pricing--style-7 .pxl-pricing__top { padding: 16px; border-radius: 16px; } } .pxl-pricing--style-7 .pxl-pricing__top .pxl-pricing__popular { color: var(--primary-color); position: absolute; top: 32px; right: 24px; background-color: #000; padding: 12px 16px; border-radius: 12px; color: #fff; font-family: Geist; font-size: 16px; font-style: normal; font-weight: 500; line-height: 1.35; letter-spacing: -0.48px; } @media screen and (max-width: 767px) { .pxl-pricing--style-7 .pxl-pricing__top .pxl-pricing__popular { padding: 8px 12px; top: 16px; right: 16px; font-size: 14px; letter-spacing: -0.32px; } } .pxl-pricing--style-7 .pxl-pricing__top .pxl-pricing__title { color: #000; font-family: Geist; font-size: 20px; font-style: normal; font-weight: 500; line-height: 1.3; letter-spacing: -1.2px; margin-bottom: 20px; } @media screen and (max-width: 767px) { .pxl-pricing--style-7 .pxl-pricing__top .pxl-pricing__title { font-size: 18px; margin-bottom: 16px; letter-spacing: -0.8px; } } .pxl-pricing--style-7 .pxl-pricing__top .pxl-pricing__price { margin-bottom: 12px; } .pxl-pricing--style-7 .pxl-pricing__top .pxl-pricing__price-detail { color: #000; font-family: Geist; font-size: 48px; font-style: normal; font-weight: 400; line-height: 1.25; letter-spacing: -2.88px; } @media screen and (max-width: 767px) { .pxl-pricing--style-7 .pxl-pricing__top .pxl-pricing__price-detail { font-size: 32px; letter-spacing: -1.6px; } } .pxl-pricing--style-7 .pxl-pricing__top .pxl-pricing__price-period { color: #000; font-family: Geist; font-size: 16px; font-weight: 400; line-height: 1.35; letter-spacing: -0.48px; } @media screen and (max-width: 767px) { .pxl-pricing--style-7 .pxl-pricing__top .pxl-pricing__price-period { font-size: 14px; letter-spacing: -0.28px; } } .pxl-pricing--style-7 .pxl-pricing__top .pxl-pricing__desc { padding-bottom: 32px; margin-bottom: 32px; border-bottom: 1px solid #e5e5e5; } @media screen and (max-width: 767px) { .pxl-pricing--style-7 .pxl-pricing__top .pxl-pricing__desc { padding-bottom: 16px; margin-bottom: 16px; } } .pxl-pricing--style-7 .pxl-pricing__top .pxl-pricing__fea { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 16px; } .pxl-pricing--style-7 .pxl-pricing__top .pxl-pricing__fea-item { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding-left: 28px; position: relative; } .pxl-pricing--style-7 .pxl-pricing__top .pxl-pricing__fea-item svg { position: absolute; top: 5px; left: 0; } .pxl-pricing--style-7 .pxl-pricing__top .pxl-pricing__fea-item-title { color: #000; font-family: Geist; font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -0.48px; } .pxl-pricing--style-7 .pxl-pricing__top .pxl-pricing__fea-item-content { color: #606060; font-family: Geist; font-size: 14px; font-weight: 400; line-height: 130%; letter-spacing: -0.42px; } .pxl-pricing--style-7 .pxl-pricing__button { --gradient-color-1: #28c6ff; --gradient-color-2: #573cf1; } .pxl-pricing--style-7 .pxl-pricing__button a { color: #000; text-align: center; font-family: Geist; font-size: 20px; font-weight: 500; line-height: 1.3; letter-spacing: -0.6px; transition: all 0.3s ease; background-color: #e5e5e5; padding: 82px 32px 32px; margin-top: -50px; color: #000; border-color: #000; border-radius: 36px; transition: all 0.3s ease; text-align: center; display: block; } @media screen and (max-width: 767px) { .pxl-pricing--style-7 .pxl-pricing__button a { padding: 60px 16px 16px 16px; margin-top: -32px; font-size: 18px; letter-spacing: -0.36px; border-radius: 16px; } } .pxl-pricing--style-7 .pxl-pricing__button svg path { stroke: #000; transition: all 0.3s ease; } .pxl-pricing:hover .pxl-pricing__button a { color: #fff; background: linear-gradient(90deg, var(--gradient-color-1) 0%, var(--gradient-color-2) 100%); } .pxl-pricing:hover .pxl-pricing__button svg path { stroke: #fff; } .pxl-accordion { display: flex; flex-direction: column; } .pxl-accordion--style-1 { gap: 16px; } .pxl-accordion--style-1 .pxl-accordion__item { border: 1px solid #d5d7da; background-color: #fdfdfd; -webkit-border-radius: 16px; -khtml-border-radius: 16px; -moz-border-radius: 16px; -ms-border-radius: 16px; -o-border-radius: 16px; border-radius: 16px; position: relative; } .pxl-accordion--style-1 .pxl-accordion__item-title { font-size: 18px; font-weight: 500; letter-spacing: -0.36px; padding: 24px 48px 24px 24px; transition: padding 0.4s ease; cursor: pointer; } @media screen and (max-width: 575px) { .pxl-accordion--style-1 .pxl-accordion__item-title { font-size: 16px; padding: 16px 48px 16px 16px; } } .pxl-accordion--style-1 .pxl-accordion__item-title .pxl-accordion__item-action { position: absolute; right: 24px; width: 20px; height: 20px; } @media screen and (max-width: 575px) { .pxl-accordion--style-1 .pxl-accordion__item-title .pxl-accordion__item-action { top: 16px; right: 16px; } } .pxl-accordion--style-1 .pxl-accordion__item-title .pxl-accordion__item-action::before { background-color: var(--primary-color); } .pxl-accordion--style-1 .pxl-accordion__item-title .pxl-accordion__item-action::after { background-color: var(--primary-color); } .pxl-accordion--style-1 .pxl-accordion__item-content { font-size: 16px; color: #535862; padding: 0px 24px 24px; overflow: hidden; display: none; } @media screen and (max-width: 575px) { .pxl-accordion--style-1 .pxl-accordion__item-content { font-size: 14px; padding: 0px 16px 16px; } } .pxl-accordion--style-1 .pxl-accordion__item.active { position: relative; } .pxl-accordion--style-1 .pxl-accordion__item.active::before { content: ""; background: linear-gradient(299deg, rgba(173, 157, 255, 0.88) 0%, rgba(158, 229, 255, 0.88) 49.19%, rgba(220, 160, 255, 0.88) 98.39%); border-radius: 16px; filter: blur(28px); z-index: -1; position: absolute; width: calc(100% - 28px); height: calc(100% - 28px); top: 50%; left: 50%; transform: translate(-50%, -50%); } .pxl-accordion--style-1 .pxl-accordion__item.active .pxl-accordion__item-title { padding-bottom: 16px; } .pxl-accordion--style-1.pxl-accordion--hide-overlay .pxl-accordion__item.active::before { display: none; } .pxl-accordion--style-1 .pxl-accordion__item-content ul { margin: 0; } .pxl-accordion--style-2 .pxl-accordion__item { position: relative; } .pxl-accordion--style-2 .pxl-accordion__item-title { font-size: 18px; font-weight: 500; letter-spacing: -0.36px; color: #fff; position: relative; cursor: pointer; padding: 33px 32px 32px 0; transition: padding 0.4s ease; will-change: padding; } .pxl-accordion--style-2 .pxl-accordion__item-title .pxl-accordion__item-action { position: absolute; top: 33px; right: 0; width: 20px; height: 20px; } .pxl-accordion--style-2 .pxl-accordion__item-title .pxl-accordion__item-action::before { background-color: #fff; } .pxl-accordion--style-2 .pxl-accordion__item-title .pxl-accordion__item-action::after { background-color: #fff; } .pxl-accordion--style-2 .pxl-accordion__item:first-child .pxl-accordion__item-title { padding-top: 0px; } .pxl-accordion--style-2 .pxl-accordion__item:first-child .pxl-accordion__item-action { top: 0px; } .pxl-accordion--style-2 .pxl-accordion__item:last-child .pxl-accordion__item-title { padding-bottom: 0px; } .pxl-accordion--style-2 .pxl-accordion__item:last-child .pxl-accordion__item-content { padding-bottom: 0px; } .pxl-accordion--style-2 .pxl-accordion__item-content { font-size: 16px; color: #a4a7ae; padding-top: 0; overflow: hidden; padding-bottom: 0; display: none; padding-bottom: 32px; will-change: padding; } .pxl-accordion--style-2 .pxl-accordion__item.active { position: relative; } .pxl-accordion--style-2 .pxl-accordion__item.active .pxl-accordion__item-title { padding-bottom: 16px; } .pxl-accordion--style-2 .pxl-accordion__item+.pxl-accordion__item:before { content: ""; width: 100%; height: 1px; position: absolute; top: 0; left: 0; background: linear-gradient(90deg, rgba(83, 88, 98, 0.00) 0%, rgba(83, 88, 98, 0.80) 25%, #535862 50%, rgba(83, 88, 98, 0.80) 75%, rgba(83, 88, 98, 0.00) 100%); } .pxl-accordion--style-3 .pxl-accordion__item-title { padding: 48px 64px 48px 64px; position: relative; color: #a4a7ae; font-size: 24px; line-height: 1.25; letter-spacing: -0.96px; transition: all 0.3s ease; cursor: pointer; } @media screen and (max-width: 575px) { .pxl-accordion--style-3 .pxl-accordion__item-title { padding: 16px 48px 16px 24px; font-size: 20px; } } .pxl-accordion--style-3 .pxl-accordion__item-title .pxl-accordion__item-number { position: absolute; left: 0; } .pxl-accordion--style-3 .pxl-accordion__item-title .pxl-accordion__item-action { width: 48px; height: 32px; background-color: #e9eaeb; border-radius: 50px; top: 48px; } .pxl-accordion--style-3 .pxl-accordion__item-title .pxl-accordion__item-action::before { background-color: #132436; } .pxl-accordion--style-3 .pxl-accordion__item-title .pxl-accordion__item-action::after { background-color: #132436; } @media screen and (max-width: 575px) { .pxl-accordion--style-3 .pxl-accordion__item-title .pxl-accordion__item-action { top: 18px; right: 0px; width: 32px; height: 20px; } .pxl-accordion--style-3 .pxl-accordion__item-title .pxl-accordion__item-action::before { width: 8px; height: 2px; } .pxl-accordion--style-3 .pxl-accordion__item-title .pxl-accordion__item-action::after { width: 2px; height: 8px; } } .pxl-accordion--style-3 .pxl-accordion__item-content { padding: 0 64px; padding-bottom: 48px; color: #535862; overflow: hidden; } @media screen and (max-width: 575px) { .pxl-accordion--style-3 .pxl-accordion__item-content { padding: 0 24px 24px; } } .pxl-accordion--style-3 .pxl-accordion__item+.pxl-accordion__item { border-top: 1px solid #d5d7da; } .pxl-accordion--style-3 .pxl-accordion__item.active .pxl-accordion__item-title { padding-bottom: 17px; color: #132436; } .pxl-accordion--style-3 .pxl-accordion__item.active .pxl-accordion__item-title .pxl-accordion__item-action { background-color: #132436; } .pxl-accordion--style-3 .pxl-accordion__item.active .pxl-accordion__item-title .pxl-accordion__item-action::before { background-color: #fff; } .pxl-accordion--style-3 .pxl-accordion__item.active .pxl-accordion__item-title .pxl-accordion__item-action::after { background-color: #fff; } .pxl-accordion--style-4 { background-color: #fff; border-radius: 40px; border: 0.5px solid #efefef; box-shadow: 0 1px 1px -0.5px rgba(0, 0, 0, 0.04), 0 3px 3px -1.5px rgba(0, 0, 0, 0.04), 0 24px 24px -12px rgba(0, 0, 0, 0.04); } @media screen and (max-width: 767px) { .pxl-accordion--style-4 { border-radius: 16px; } } .pxl-accordion--style-4 .pxl-accordion__item { position: relative; } .pxl-accordion--style-4 .pxl-accordion__item+.pxl-accordion__item { border-top: 1px solid #e5e5e5; } .pxl-accordion--style-4 .pxl-accordion__item-title { font-size: 18px; font-weight: 500; letter-spacing: -0.36px; padding: 32px 32px 32px 76px; transition: padding 0.4s ease; cursor: pointer; } @media screen and (max-width: 767px) { .pxl-accordion--style-4 .pxl-accordion__item-title { font-size: 18px; padding: 16px 16px 16px 48px; } } @media screen and (max-width: 575px) { .pxl-accordion--style-4 .pxl-accordion__item-title { font-size: 16px; padding: 16px 16px 16px 48px; } } .pxl-accordion--style-4 .pxl-accordion__item-title .pxl-accordion__item-action { position: absolute; top: 32px; left: 32px; width: 20px; height: 20px; } @media screen and (max-width: 575px) { .pxl-accordion--style-4 .pxl-accordion__item-title .pxl-accordion__item-action { top: 16px; left: 16px; } } .pxl-accordion--style-4 .pxl-accordion__item-title .pxl-accordion__item-action::before { background-color: var(--primary-color); } .pxl-accordion--style-4 .pxl-accordion__item-title .pxl-accordion__item-action::after { background-color: var(--primary-color); } .pxl-accordion--style-4 .pxl-accordion__item-content { font-size: 16px; color: #535862; padding: 0px 32px 32px 76px; overflow: hidden; display: none; } @media screen and (max-width: 575px) { .pxl-accordion--style-4 .pxl-accordion__item-content { font-size: 14px; padding: 0px 16px 16px 48px; } } .pxl-accordion--style-4 .pxl-accordion__item.active { position: relative; } .pxl-accordion--style-4 .pxl-accordion__item.active .pxl-accordion__item-title { padding-bottom: 12px; } .pxl-accordion--style-4.pxl-accordion--hide-overlay .pxl-accordion__item.active::before { display: none; } .pxl-accordion--style-4 .pxl-accordion__item-content ul { margin: 0; } .pxl-accordion .pxl-accordion__item-action { position: absolute; top: 24px; right: 24px; width: 20px; height: 20px; pointer-events: none; } .pxl-accordion .pxl-accordion__item-action::before { content: ""; position: absolute; display: block; width: 12px; height: 2px; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; border-radius: 10px; transition: all 0.4s ease; } .pxl-accordion .pxl-accordion__item-action::after { content: ""; position: absolute; display: block; width: 2px; height: 12px; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; border-radius: 10px; transition: all 0.4s ease; opacity: 1; } .pxl-accordion .pxl-accordion__item.active .pxl-accordion__item-action::after { opacity: 0; visibility: hidden; transform: translate(-50%, -50%) rotate(90deg); } .pxl-accordion--layout-2 .pxl-accordion__item { padding: 40px 24px; background-color: transparent; border-radius: 16px; position: relative; transition: all 0.4s ease; } @media screen and (max-width: 575px) { .pxl-accordion--layout-2 .pxl-accordion__item { padding: 16px 16px; } } .pxl-accordion--layout-2 .pxl-accordion__item:first-child { padding-top: 0; } .pxl-accordion--layout-2 .pxl-accordion__item:first-child.active { margin-bottom: 40px; } @media screen and (max-width: 575px) { .pxl-accordion--layout-2 .pxl-accordion__item:first-child.active { margin-bottom: 16px; } } .pxl-accordion--layout-2 .pxl-accordion__item:last-child { padding-bottom: 0; } .pxl-accordion--layout-2 .pxl-accordion__item+.pxl-accordion__item { padding-top: 41px; transition: all 0.4s ease; } @media screen and (max-width: 575px) { .pxl-accordion--layout-2 .pxl-accordion__item+.pxl-accordion__item { padding-top: 17px; } } .pxl-accordion--layout-2 .pxl-accordion__item+.pxl-accordion__item::before { content: ""; background: linear-gradient(90deg, rgba(102, 102, 102, 0.00) 0%, rgba(102, 102, 102, 0.13) 25%, rgba(102, 102, 102, 0.16) 50%, rgba(102, 102, 102, 0.13) 75%, rgba(102, 102, 102, 0.00) 100%); width: 100%; height: 1px; display: block; position: absolute; top: 0; } .pxl-accordion--layout-2 .pxl-accordion__item.active-prev { margin-bottom: 40px; } @media screen and (max-width: 575px) { .pxl-accordion--layout-2 .pxl-accordion__item.active-prev { margin-bottom: 16px; } } .pxl-accordion--layout-2 .pxl-accordion__item.active-prev::after { content: ""; background: linear-gradient(90deg, rgba(102, 102, 102, 0.00) 0%, rgba(102, 102, 102, 0.13) 25%, rgba(102, 102, 102, 0.16) 50%, rgba(102, 102, 102, 0.13) 75%, rgba(102, 102, 102, 0.00) 100%); width: 100%; height: 1px; display: block; position: absolute; bottom: 0; } .pxl-accordion--layout-2 .pxl-accordion__item.active-next { margin-top: 40px; } @media screen and (max-width: 575px) { .pxl-accordion--layout-2 .pxl-accordion__item.active-next { margin-top: 16px; } } .pxl-accordion--layout-2 .pxl-accordion__item.active { padding: 24px; background-color: #fff; box-shadow: 0px 16px 32px -10px rgba(24, 29, 39, 0.12); } @media screen and (max-width: 575px) { .pxl-accordion--layout-2 .pxl-accordion__item.active { padding: 16px 16px; } } .pxl-accordion--layout-2 .pxl-accordion__item.active::before { display: none; } .pxl-accordion--layout-2 .pxl-accordion__item-title { font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.8px; cursor: pointer; } @media screen and (max-width: 575px) { .pxl-accordion--layout-2 .pxl-accordion__item-title { font-size: 16px; } } .pxl-accordion--layout-2 .pxl-accordion__item-content { padding-top: 17px; overflow: hidden; } .pxl-accordion--layout-2 .pxl-accordion__item-content .item-title { color: var(--primary-color); font-size: 18px; font-weight: 500; margin: 16px 0 8px; } @media screen and (max-width: 575px) { .pxl-accordion--layout-2 .pxl-accordion__item-content .item-title { font-size: 14px; } } .pxl-accordion--layout-2 .pxl-accordion__item-content ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; margin-top: 12px; } .pxl-accordion--layout-2 .pxl-accordion__item-content ul li { font-size: 16px; font-weight: 400; padding-left: 25px; position: relative; } @media screen and (max-width: 575px) { .pxl-accordion--layout-2 .pxl-accordion__item-content ul li { font-size: 14px; } } .pxl-accordion--layout-2 .pxl-accordion__item-content ul li::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background-color: var(--third-color); position: absolute; display: block; top: 8px; left: 9px; } .pxl-accordion--layout-2 .pxl-accordion__item-content ul li b, .pxl-accordion--layout-2 .pxl-accordion__item-content ul li strong { font-weight: 500; } .pxl-accordion--layout-2 .pxl-accordion__item-content .pxl-accordion__item-question { margin-top: 17px; } .pxl-accordion--layout-2 .pxl-accordion__item-content .pxl-accordion__item-question p { margin-bottom: 11px; } .pxl-accordion--layout-2 .pxl-accordion__item-content .pxl-accordion__item-question p img { width: 16px; margin: -3px 5px 0 0; } .pxl-accordion--layout-2 .pxl-accordion__item-content .pxl-accordion__item-question a { color: #2e90fa; display: flex; align-items: center; gap: 5px; } .pxl-accordion--layout-2 .pxl-accordion__item-content .pxl-accordion__item-question a svg { transform: translateX(0); transition: all 0.3s ease; } .pxl-accordion--layout-2 .pxl-accordion__item-content .pxl-accordion__item-question a svg path { stroke: #2e90fa; } .pxl-accordion--layout-2 .pxl-accordion__item-content .pxl-accordion__item-question a:hover svg { transform: translateX(50%); } .pxl-accordion--layout-2 .pxl-accordion__item .pxl-tabs__faqs-loadmore { position: relative; padding-top: 65px; } @media screen and (max-width: 575px) { .pxl-accordion--layout-2 .pxl-accordion__item .pxl-tabs__faqs-loadmore { padding-top: 24px; } } .pxl-accordion--layout-2 .pxl-accordion__item .pxl-tabs__faqs-loadmore::before { content: ""; background: linear-gradient(90deg, rgba(102, 102, 102, 0.00) 0%, rgba(102, 102, 102, 0.13) 25%, rgba(102, 102, 102, 0.16) 50%, rgba(102, 102, 102, 0.13) 75%, rgba(102, 102, 102, 0.00) 100%); width: 100%; height: 1px; display: block; position: absolute; top: 0; } .pxl-accordion--layout-2 .pxl-accordion__item .pxl-tabs__faqs-loadmore .pxl-tabs__loadmore { width: fit-content; margin: 0 auto; display: flex; align-items: center; gap: 4px; cursor: pointer; } .pxl-accordion--layout-2 .pxl-accordion__item .pxl-tabs__faqs-loadmore .pxl-tabs__loadmore.loading svg { animation: pxl_spin 1s linear infinite; } .pxl-accordion--layout-2 .pxl-accordion__item+.pxl-tabs__faqs-loadmore { width: 100%; padding-top: 64px; position: relative; } .pxl-accordion--layout-2 .pxl-accordion__item+.pxl-tabs__faqs-loadmore:before { content: ""; background: linear-gradient(90deg, rgba(102, 102, 102, 0.00) 0%, rgba(102, 102, 102, 0.13) 25%, rgba(102, 102, 102, 0.16) 50%, rgba(102, 102, 102, 0.13) 75%, rgba(102, 102, 102, 0.00) 100%); width: 100%; height: 1px; display: block; position: absolute; top: 0; } .pxl-accordion--layout-2 .pxl-accordion__item+.pxl-tabs__faqs-loadmore .pxl-tabs__loadmore { width: fit-content; margin: 0 auto; } .pxl-accordion--layout-3 .pxl-accordion__item { padding: 25px 0 24px; } .pxl-accordion--layout-3 .pxl-accordion__item+.pxl-accordion__item { position: relative; } .pxl-accordion--layout-3 .pxl-accordion__item+.pxl-accordion__item:before { position: absolute; content: ""; width: 100%; height: 1px; background: linear-gradient(90deg, rgba(102, 102, 102, 0.00) 0%, rgba(102, 102, 102, 0.13) 25%, rgba(102, 102, 102, 0.16) 50%, rgba(102, 102, 102, 0.13) 75%, rgba(102, 102, 102, 0.00) 100%); top: 0; left: 0; } .pxl-accordion--layout-3 .pxl-accordion__item:first-child { padding-top: 0; } .pxl-accordion--layout-3 .pxl-accordion__item:last-child { padding-bottom: 0; } .pxl-accordion--layout-3 .pxl-accordion__item-title { font-size: 16px; font-style: normal; font-weight: 500; line-height: 1.35; letter-spacing: -0.32px; color: var(--primary-color); padding-right: 24px; position: relative; padding-bottom: 0; transition: all 0.3s ease; } .pxl-accordion--layout-3 .pxl-accordion__item-title svg { position: absolute; right: 0; top: 50%; transform: translateY(-50%) rotate(-90deg); transition: all 0.3s ease; } .pxl-accordion--layout-3 .pxl-accordion__item.active .pxl-accordion__item-title { padding-bottom: 16px; } .pxl-accordion--layout-3 .pxl-accordion__item.active .pxl-accordion__item-title svg { transform: rotate(0deg) translateY(-50%); } .pxl-accordion--layout-3 .pxl-accordion__item-content { overflow: hidden; color: var(--third-color); display: none; } .pxl-accordion--layout-3 .pxl-accordion__item-content ul { list-style: none; margin: 0; padding: 0; } .pxl-accordion--layout-3 .pxl-accordion__item-content ul li { font-size: 16px; font-weight: 400; color: var(--third-color); position: relative; padding-left: 25px; } .pxl-accordion--layout-3 .pxl-accordion__item-content ul li:before { content: ""; width: 5px; height: 5px; border-radius: 50%; background-color: var(--third-color); position: absolute; display: block; top: 8px; left: 9px; } .pxl-marquee { box-sizing: border-box; display: flex; align-items: center; overflow: hidden; width: 100%; } .pxl-marquee ul { display: flex; margin: 0; } .pxl-marquee__left { will-change: transform; animation: marquee-rtl 30s linear infinite; } .pxl-marquee__right { will-change: transform; animation: marquee-ltr 30s linear infinite; } .pxl-marquee__bottom { will-change: transform; animation: marquee-ttb 30s linear infinite; flex-direction: column; } .pxl-marquee__top { will-change: transform; animation: marquee-btt 30s linear infinite; flex-direction: column; } @media screen and (max-width: 767px) { .pxl-marquee__mb-left { will-change: transform; animation: marquee-rtl 30s linear infinite; flex-direction: row; } } @media screen and (max-width: 767px) { .pxl-marquee__mb-right { will-change: transform; animation: marquee-ltr 30s linear infinite; flex-direction: row; } } @media screen and (max-width: 767px) { .pxl-marquee__mb-top { will-change: transform; animation: marquee-ttb 30s linear infinite; flex-direction: column; } } @media screen and (max-width: 767px) { .pxl-marquee__mb-bottom { will-change: transform; animation: marquee-btt 30s linear infinite; flex-direction: column; } } .pxl-marquee__true:hover ul { animation-play-state: paused; } .pxl-marquee__style-1 ul { gap: 64px; margin: 0; padding: 0; } .pxl-marquee__style-1 ul .pxl-marquee__item { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; } .pxl-marquee__style-2 { padding: 30px 0; margin: -30px 0; } .pxl-marquee__style-2 ul { gap: 12px; margin: 0; padding: 0; } .pxl-marquee__style-2 ul .pxl-marquee__item { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; border-radius: 12px; background: #f5f5f5; padding: 12px; transition: all 0.3s ease; } .pxl-marquee__style-2 ul .pxl-marquee__item a { opacity: 0; display: flex; gap: 12px; justify-content: center; align-items: center; transition: all 0.3s ease; } .pxl-marquee__style-2 ul .pxl-marquee__item a img { -webkit-border-radius: 4px; -khtml-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; } @media screen and (max-width: 575px) { .pxl-marquee__style-2 ul .pxl-marquee__item { padding: 6px 12px; } .pxl-marquee__style-2 ul .pxl-marquee__item a { gap: 6px; } .pxl-marquee__style-2 ul .pxl-marquee__item a img { width: 20px; object-fit: contain; } } .pxl-marquee__style-2 ul .pxl-marquee__item.active { background: #fff; border: 0.5px solid #efefef; box-shadow: 0 1px 1px -0.5px rgba(0, 0, 0, 0.04), 0 3px 3px -1.5px rgba(0, 0, 0, 0.04), 0 24px 24px -12px rgba(0, 0, 0, 0.04); } .pxl-marquee__style-2 ul .pxl-marquee__item.active a { opacity: 1; } .pxl-marquee--coin { flex-direction: column; gap: 16px; } .pxl-marquee--coin .pxl-marquee__list { display: flex; gap: 16px; list-style: none; margin: 0; padding: 0; animation-duration: 50s; animation-play-state: running; } .pxl-marquee--coin .pxl-marquee__list .pxl-marquee__item { display: flex; flex-shrink: 0; gap: 8px; align-items: center; justify-content: center; padding: 8px 12px 8px 8px; border-radius: 99px; border: 0.6px solid rgba(255, 255, 255, 0.08); background: rgba(255, 255, 255, 0.04); box-shadow: 0px 0px 6px 0px rgba(255, 255, 255, 0.16) inset; } .pxl-marquee--coin .pxl-marquee__list .pxl-marquee__item img { width: 40px; height: 40px; border-radius: 50%; } .pxl-marquee--coin .pxl-marquee__list .pxl-marquee__item .pxl-marquee__item-name { font-size: 14px; font-weight: 500; color: #fff; line-height: 1.3; letter-spacing: -0.28px; } .pxl-marquee--coin .pxl-marquee__list .pxl-marquee__item .pxl-marquee__item-wrapper { display: flex; flex-direction: column; gap: 4px; } .pxl-marquee--coin .pxl-marquee__list .pxl-marquee__item .pxl-marquee__item-price-wrapper { display: flex; gap: 4px; align-items: center; font-size: 12px; line-height: 1.2; letter-spacing: -0.24px; } .pxl-marquee--coin .pxl-marquee__list .pxl-marquee__item .pxl-marquee__item-price-wrapper .pxl-marquee__item-price { color: #a4a7ae; } .pxl-marquee--coin .pxl-marquee__list .pxl-marquee__item .pxl-marquee__item-price-wrapper .pxl-marquee__item-percent.increase { color: #32d583; } .pxl-marquee--coin .pxl-marquee__list .pxl-marquee__item .pxl-marquee__item-price-wrapper .pxl-marquee__item-percent.decrease { color: #f97066; } .pxl-marquee__list--testimonial.style-1 .pxl-marquee__item { display: flex; flex-direction: column; gap: 24px; padding: 24px; border-radius: 16px; border: 0.6px solid rgba(255, 255, 255, 0.08); background: rgba(255, 255, 255, 0.04); box-shadow: 0px 0px 6px 0px rgba(255, 255, 255, 0.16) inset; backdrop-filter: blur(6px); width: 100%; } @media screen and (max-width: 767px) { .pxl-marquee__list--testimonial.style-1 .pxl-marquee__item { min-width: 300px; } } .pxl-marquee__list--testimonial.style-1 .pxl-marquee__item .pxl-marquee__star { display: flex; gap: 6px; align-items: center; } .pxl-marquee__list--testimonial.style-1 .pxl-marquee__item .pxl-marquee__star .pxl-marquee__star-wrap { display: flex; gap: 4px; align-items: center; } .pxl-marquee__list--testimonial.style-1 .pxl-marquee__item .pxl-marquee__star .pxl-marquee__star-value { font-size: 12px; font-weight: 400; line-height: 1.2; letter-spacing: -0.24px; color: #fff; } .pxl-marquee__list--testimonial.style-1 .pxl-marquee__item .pxl-marquee__item-avatar { width: 40px; height: 40px; border-radius: 50%; overflow: hidden; } .pxl-marquee__list--testimonial.style-1 .pxl-marquee__item .pxl-marquee__item-content { color: #a4a7ae; } .pxl-marquee__list--testimonial.style-1 .pxl-marquee__item .pxl-marquee__item-author { display: flex; gap: 4px; align-items: start; flex-direction: column; padding-left: 48px; position: relative; } .pxl-marquee__list--testimonial.style-1 .pxl-marquee__item .pxl-marquee__item-author .pxl-marquee__item-avatar { position: absolute; top: 50%; left: 0; transform: translateY(-50%); } .pxl-marquee__list--testimonial.style-1 .pxl-marquee__item .pxl-marquee__item-author .pxl-marquee__item-name { font-size: 14px; font-weight: 500; line-height: 1.3; letter-spacing: -0.28px; color: #fff; } .pxl-marquee__list--testimonial.style-1 .pxl-marquee__item .pxl-marquee__item-author .pxl-marquee__item-pos { font-size: 12px; font-weight: 400; line-height: 1.2; letter-spacing: -0.24px; color: #a4a7ae; } .pxl-marquee__list--testimonial.style-2 .pxl-marquee__item { display: flex; flex-direction: column; gap: 24px; padding: 24px; border-radius: 16px; background: #0a0a0a; border-radius: 12px; border: 0.6px solid rgba(255, 255, 255, 0.16); box-shadow: 0 1px 1px -0.5px rgba(0, 0, 0, 0.04), 0 3px 3px -1.5px rgba(0, 0, 0, 0.04), 0 24px 24px -12px rgba(0, 0, 0, 0.04); } @media screen and (max-width: 575px) { .pxl-marquee__list--testimonial.style-2 .pxl-marquee__item { min-width: 300px; } } .pxl-marquee__list--testimonial.style-2 .pxl-marquee__item .pxl-marquee__star { display: flex; gap: 6px; align-items: center; } .pxl-marquee__list--testimonial.style-2 .pxl-marquee__item .pxl-marquee__star .pxl-marquee__star-wrap { display: flex; gap: 4px; align-items: center; } .pxl-marquee__list--testimonial.style-2 .pxl-marquee__item .pxl-marquee__star .pxl-marquee__star-value { font-size: 12px; font-weight: 400; line-height: 1.2; letter-spacing: -0.24px; color: #fff; } .pxl-marquee__list--testimonial.style-2 .pxl-marquee__item .pxl-marquee__item-avatar { width: 40px; height: 40px; border-radius: 50%; overflow: hidden; } .pxl-marquee__list--testimonial.style-2 .pxl-marquee__item .pxl-marquee__item-content { color: #fff; font-size: 18px; font-weight: 500; line-height: 1.35; letter-spacing: -0.36px; } @media screen and (max-width: 1200px) { .pxl-marquee__list--testimonial.style-2 .pxl-marquee__item .pxl-marquee__item-content { font-size: 16px; } } @media screen and (max-width: 575px) { .pxl-marquee__list--testimonial.style-2 .pxl-marquee__item .pxl-marquee__item-content { font-size: 14px; } } .pxl-marquee__list--testimonial.style-2 .pxl-marquee__item .pxl-marquee__item-author { display: flex; gap: 4px; align-items: start; flex-direction: column; padding-left: 48px; position: relative; } .pxl-marquee__list--testimonial.style-2 .pxl-marquee__item .pxl-marquee__item-author .pxl-marquee__item-avatar { position: absolute; top: 50%; left: 0; transform: translateY(-50%); } .pxl-marquee__list--testimonial.style-2 .pxl-marquee__item .pxl-marquee__item-author .pxl-marquee__item-name { font-size: 14px; font-weight: 500; line-height: 1.3; letter-spacing: -0.28px; color: #fff; } .pxl-marquee__list--testimonial.style-2 .pxl-marquee__item .pxl-marquee__item-author .pxl-marquee__item-pos { font-size: 12px; font-weight: 400; line-height: 1.2; letter-spacing: -0.24px; color: #a4a7ae; } .pxl-marquee__list--textbox { display: flex; flex-direction: column; gap: 16px; } .pxl-marquee__list--textbox .pxl-marquee__item { display: flex; flex-direction: column; padding: 24px; gap: 12px; border-radius: 16px; border: 1px solid #ccc; background: #fff; transition: all 0.3s ease; } .pxl-marquee__list--textbox .pxl-marquee__item:hover { background: #eaffae; border: 1px solid #eaffae; } .pxl-marquee__list--textbox .pxl-marquee__item .pxl-marquee__item-title { color: #000; font-size: 18px; font-style: normal; font-weight: 600; line-height: 1.35; letter-spacing: -0.9px; } .pxl-marquee__list--textbox .pxl-marquee__item .pxl-marquee__item-description { color: #000; } .pxl-marquee__list--testimonial-layout-2 .pxl-marquee__item { --grid-color: #ccc; display: flex; flex-direction: column; padding: 32px; border-radius: 20px; background: #f5f5f5; position: relative; overflow: hidden; } @media screen and (max-width: 767px) { .pxl-marquee__list--testimonial-layout-2 .pxl-marquee__item { padding: 20px; } } .pxl-marquee__list--testimonial-layout-2 .pxl-marquee__item-grid { width: 150%; height: 40%; display: flex; position: absolute; top: 0; left: 50%; transform: translateX(-50%); z-index: 1; background-image: linear-gradient(var(--grid-color) 2px, transparent 2px), linear-gradient(90deg, var(--grid-color) 2px, transparent 2px); background-size: 40px 40px; background-position: -1px -1px; background-repeat: repeat; opacity: 0.05; } @media screen and (max-width: 767px) { .pxl-marquee__list--testimonial-layout-2 .pxl-marquee__item-grid { background-size: 20px 20px; } } .pxl-marquee__list--testimonial-layout-2 .pxl-marquee__item-avatar { height: 24px; margin-bottom: 80px; } @media screen and (max-width: 1200px) { .pxl-marquee__list--testimonial-layout-2 .pxl-marquee__item-avatar { margin-bottom: 40px; } } @media screen and (max-width: 767px) { .pxl-marquee__list--testimonial-layout-2 .pxl-marquee__item-avatar { margin-bottom: 30px; } } .pxl-marquee__list--testimonial-layout-2 .pxl-marquee__item-content { color: #000; font-size: 18px; font-weight: 500; line-height: 1.35; letter-spacing: -0.36px; margin-bottom: 32px; } @media screen and (max-width: 767px) { .pxl-marquee__list--testimonial-layout-2 .pxl-marquee__item-content { font-size: 16px; letter-spacing: -0.32px; margin-bottom: 20px; } } @media screen and (max-width: 575px) { .pxl-marquee__list--testimonial-layout-2 .pxl-marquee__item-content { font-size: 14px; letter-spacing: -0.28px; margin-bottom: 20px; } } .pxl-marquee__list--testimonial-layout-2 .pxl-marquee__item-author { display: flex; justify-content: space-between; gap: 20px; align-items: center; } .pxl-marquee__list--testimonial-layout-2 .pxl-marquee__item-author-info { display: flex; flex-direction: column; gap: 6px; } .pxl-marquee__list--testimonial-layout-2 .pxl-marquee__item-author-name { color: #000; font-size: 16px; font-style: normal; font-weight: 500; line-height: 1.35; letter-spacing: -0.32px; } @media screen and (max-width: 767px) { .pxl-marquee__list--testimonial-layout-2 .pxl-marquee__item-author-name { font-size: 14px; letter-spacing: -0.28px; } } .pxl-marquee__list--testimonial-layout-2 .pxl-marquee__item-author-pos { color: #606060; font-size: 12px; font-weight: 400; line-height: 1.2; letter-spacing: -0.24px; } @media screen and (max-width: 767px) { .pxl-marquee__list--testimonial-layout-2 .pxl-marquee__item-author-pos { font-size: 10px; letter-spacing: -0.2px; } } .pxl-marquee__list--testimonial-layout-2 .pxl-marquee__item-author-star { display: flex; padding: 7px 12px; align-items: center; gap: 8px; border-radius: 99px; border: 0.5px solid #efefef; background: #fff; box-shadow: 0 1px 1px -0.5px rgba(0, 0, 0, 0.04), 0 3px 3px -1.5px rgba(0, 0, 0, 0.04), 0 24px 24px -12px rgba(0, 0, 0, 0.04); } .pxl-marquee__list--testimonial-layout-2 .pxl-marquee__item-author-star-value { font-size: 14px; font-weight: 500; line-height: 1.3; letter-spacing: -0.28px; } .pxl-image { -webkit-border-radius: inherit; -khtml-border-radius: inherit; -moz-border-radius: inherit; -ms-border-radius: inherit; -o-border-radius: inherit; border-radius: inherit; position: relative; } .pxl-image__zoom-on-scroll { transform: scale(1); } .pxl-image__zoom-on-scroll.zoomed img { transform: scale(15); } .pxl-image *, .pxl-image img { -webkit-border-radius: inherit; -khtml-border-radius: inherit; -moz-border-radius: inherit; -ms-border-radius: inherit; -o-border-radius: inherit; border-radius: inherit; } .pxl-image img { width: auto; } .pxl-image__overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 2; } .pxl-image__bgr { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 0; } .pxl-image img { z-index: 1; position: relative; } .pxl-image__parallax-scroll { visibility: visible !important; } .pxl-image .pxl-image__tilt { -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } .pxl-image .pxl-image__tilt__tilt-active { overflow: hidden; } .pxl-image__3d-ui .pxl-image__item { perspective: 1140px; } .pxl-image__3d-ui .pxl-image__item img { transform: rotateX(15deg) rotateY(0deg); transition: transform 0.4s ease; will-change: transform; } .pxl-image .pxl-variant { position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); opacity: 0; transition: all 3s ease 1.5s; } .pxl-image .pxl-variant.active { opacity: 1; } .pxl-image .pxl-variant__container { opacity: 1; will-change: transform; transform: none; width: 100%; height: 100%; position: relative; } .pxl-image .pxl-variant__container .pxl-variant__group { border-radius: 12px; height: 100%; width: 100%; opacity: 1; position: relative; } .pxl-image .pxl-variant__container .pxl-variant__group .pxl-variant__item { position: absolute; } .pxl-image .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(1) { width: 10%; height: 50%; flex-shrink: 0; border-radius: 463.866px; background: #3521a8; filter: blur(76.64584px); top: 50%; left: 0%; transform: translateY(-50%); } @media screen and (max-width: 575px) { .pxl-image .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(1) { filter: blur(20px); } } .pxl-image .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(2) { position: absolute; width: 10%; height: 50%; flex-shrink: 0; border-radius: 463.866px; background: #3521a8; filter: blur(76.64584px); top: 50%; right: 0%; transform: translateY(-50%); } @media screen and (max-width: 575px) { .pxl-image .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(2) { filter: blur(20px); } } .pxl-image .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(3) { position: absolute; width: 30%; height: 10%; flex-shrink: 0; border-radius: 447px; background: #9821a8; filter: blur(68.78472px); top: 0%; left: 0%; } @media screen and (max-width: 575px) { .pxl-image .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(3) { filter: blur(20px); } } .pxl-image .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(4) { position: absolute; width: 30%; height: 10%; flex-shrink: 0; border-radius: 447px; background: #218da8; filter: blur(68.78472px); top: 0%; right: 0%; } @media screen and (max-width: 575px) { .pxl-image .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(4) { filter: blur(20px); } } .pxl-image .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(5) { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 16px; opacity: 0.64; background: linear-gradient(180deg, #53b1fd 0%, rgba(83, 177, 253, 0.00) 100%); filter: blur(40px); } @media screen and (max-width: 575px) { .pxl-image .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(5) { filter: blur(12px); } } .pxl-image .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(6) { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 16px; background: linear-gradient(180deg, #53b1fd 0%, rgba(83, 177, 253, 0.00) 100%); box-shadow: 0px 0px 4px 0px #fff; } .pxl-image .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(7) { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 16px; opacity: 0.64; background: linear-gradient(180deg, rgba(83, 177, 253, 0.72) 0%, rgba(83, 177, 253, 0.00) 100%); filter: blur(19.48829px); } @media screen and (max-width: 575px) { .pxl-image .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(7) { filter: blur(6px); } } .pxl-image .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(8) { position: absolute; top: 0; left: 0; width: 100%; height: 100%; fill: linear-gradient(180deg, #53b1fd -61.53%, rgba(83, 177, 253, 0.00) 38.47%); opacity: 0.64; filter: drop-shadow(0px -1.3px 4px #fff); } @media screen and (max-width: 575px) { .pxl-image .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(8) { filter: blur(6px); } } .pxl-image .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(9) { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 16px; border: 4px solid #ec8cf9; background: #d9d9d9; filter: blur(8px); } @media screen and (max-width: 575px) { .pxl-image .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(9) { filter: blur(6px); } } .pxl-image .pxl-angle { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; border: 1px solid rgba(255, 255, 255, 0.20); } .pxl-image .pxl-angle__item { width: 13px; height: 13px; border: 2px solid #a3a3a3; display: block; position: absolute; } .pxl-image .pxl-angle__item:nth-child(1) { top: -1px; left: -1px; border-bottom: none; border-right: none; } .pxl-image .pxl-angle__item:nth-child(2) { top: -1px; right: -1px; border-bottom: none; border-left: none; } .pxl-image .pxl-angle__item:nth-child(3) { bottom: -1px; left: -1px; border-top: none; border-right: none; } .pxl-image .pxl-angle__item:nth-child(4) { bottom: -1px; right: -1px; border-top: none; border-left: none; } .pxl-image__light-blur { --light-blur-color: #47da67; position: relative; } .pxl-image__light-blur::before, .pxl-image__light-blur::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; background: var(--light-blur-color); z-index: 1; border-radius: 50%; } .pxl-image__light-blur::before { filter: blur(20px); } .pxl-image__light-blur::after { filter: blur(100px); } .pxl-image__light-blur .pxl-image__inner { position: relative; z-index: 2; } .pxl-image-carousel .pxl-image__item img { image-rendering: -webkit-optimize-contrast; image-rendering: smooth; -ms-interpolation-mode: bicubic; width: 100%; height: auto; object-fit: cover; will-change: transform; transform: translateZ(0); backface-visibility: hidden; } .pxl-image-carousel.pxl-image-carousel-inbox .pxl-swiper-container { perspective: 1200px; overflow: visible; } .pxl-image-carousel.pxl-image-carousel-inbox .pxl-swiper-slider__inner { overflow: visible; } .pxl-image-carousel.pxl-image-carousel-inbox .pxl-swiper-slider__item { position: relative; opacity: 0; transition: all 0.3s ease; transform: scale(0.9) translateZ(0); will-change: transform, opacity; } .pxl-image-carousel.pxl-image-carousel-inbox .pxl-swiper-slider__item-dot { position: absolute; top: 13px; left: 13px; width: 100%; height: 100%; display: flex; gap: 5px; } .pxl-image-carousel.pxl-image-carousel-inbox .pxl-swiper-slider__item-dot span { display: block; width: 6px; height: 6px; border-radius: 50%; background: rgba(255, 255, 255, 0.32); } .pxl-image-carousel.pxl-image-carousel-inbox .pxl-swiper-slider__item.swiper-slide-visible { opacity: 1; } .pxl-image-carousel.pxl-image-carousel-inbox .pxl-swiper-slider__item.swiper-slide-active { opacity: 1; position: relative; z-index: 3; } .pxl-image-carousel.pxl-image-carousel-inbox .pxl-swiper-slider__item.swiper-slide-active:before, .pxl-image-carousel.pxl-image-carousel-inbox .pxl-swiper-slider__item.swiper-slide-active:after { content: ""; position: absolute; top: 0; width: 30%; height: 100%; background: #8859fe; filter: blur(46px); opacity: 0.2; z-index: 1; border-radius: 50%; } @media screen and (max-width: 575px) { .pxl-image-carousel.pxl-image-carousel-inbox .pxl-swiper-slider__item.swiper-slide-active:before, .pxl-image-carousel.pxl-image-carousel-inbox .pxl-swiper-slider__item.swiper-slide-active:after { display: none; } } .pxl-image-carousel.pxl-image-carousel-inbox .pxl-swiper-slider__item.swiper-slide-active:before { left: 0; transform: translateX(-50%); } .pxl-image-carousel.pxl-image-carousel-inbox .pxl-swiper-slider__item.swiper-slide-active:after { right: 0; transform: translateX(50%); } .pxl-image-carousel.pxl-image-carousel-inbox .pxl-swiper-slider__item.swiper-slide-active .pxl-swiper-slider__item-inner { z-index: 2; } .pxl-image-carousel.pxl-image-carousel-inbox .pxl-swiper-slider__item-inner { border-radius: 13.222px; border: 0.661px solid #393939; background: rgba(85, 85, 85, 0.12); backdrop-filter: blur(53.14582px); padding: 38px 18px 0; position: relative; } .pxl-image-carousel.pxl-image-carousel-inbox .pxl-swiper-slider__item-inner .pxl-image__item { overflow: hidden; border-radius: 7px 7px 0 0; } .pxl-image-carousel.pxl-image-carousel-inbox .pxl-swiper-slider__item-inner .pxl-image__item img { image-rendering: -webkit-optimize-contrast; image-rendering: smooth; -ms-interpolation-mode: bicubic; width: 100%; height: auto; object-fit: cover; will-change: transform; transform: translateZ(0); backface-visibility: hidden; } .pxl-rating { position: relative; display: flex; gap: 16px; } .pxl-rating__image { display: flex; margin: 0; padding: 0; list-style: none; } .pxl-rating__image li { border-radius: 48px; border: 3px solid #181c25; overflow: hidden; width: 48px; height: 48px; box-sizing: border-box; display: flex; justify-content: center; align-items: center; margin-left: -16px; } .pxl-rating__image li:first-child { margin-left: 0; } .pxl-rating__image li img { width: 100%; max-width: 48px; } .pxl-rating .pxl-rating__meta { display: flex; flex-direction: column; } .pxl-rating .pxl-rating__meta-star { display: flex; gap: 6px; align-items: center; } .pxl-rating .pxl-rating__meta-star span { font-size: 24px; font-style: normal; font-weight: 500; line-height: 1.25; letter-spacing: -0.96px; color: #fff; } .pxl-rating .pxl-rating__meta-desc { font-size: 12px; color: #d5d7da; letter-spacing: -0.24px; } .pxl-step { position: relative; display: flex; gap: 20px; align-items: stretch; } @media screen and (max-width: 575px) { .pxl-step { flex-direction: column; gap: 8px; } } .pxl-step__style-1 .pxl-step__number { color: #2e90fa; font-size: 40px; font-weight: 500; line-height: 1.2; letter-spacing: -2px; } .pxl-step__style-1 .pxl-step__line { width: 1px; min-width: 1px; background: linear-gradient(180deg, rgba(213, 215, 218, 0.00) 0%, #d5d7da 50%, rgba(213, 215, 218, 0.00) 100%); } @media screen and (max-width: 575px) { .pxl-step__style-1 .pxl-step__line { display: none; } } .pxl-step__style-1 .pxl-step__content { display: flex; flex-direction: column; gap: 16px; } .pxl-step__style-1 .pxl-step__content-title { font-size: 20px; font-weight: 500; line-height: 120%; letter-spacing: -0.8px; color: #181d27; } .pxl-step__style-1 .pxl-step__content-desc { color: #535862; font-size: 16px; font-style: normal; font-weight: 400; line-height: 135%; letter-spacing: -0.32px; } .pxl-step__style-2 .pxl-step__feature { position: relative; list-style: none; margin: 0; padding: 0; } .pxl-step__style-2 .pxl-step__feature-line { position: absolute; top: 0; left: 24px; width: 6px; background: linear-gradient(180deg, #2e90fa 0%, #252b37 100%); transform: translateX(-50%); z-index: 2; height: 25%; transition: height 0.3s ease; } .pxl-step__style-2 .pxl-step__feature::before { content: ""; position: absolute; width: 6px; height: 95%; background: linear-gradient(180deg, #252b37 0%, #252b37 100%); left: 24px; top: 0; transform: translate(-50%, 0); transition: all 0.3s ease; z-index: 1; } .pxl-step__style-2 .pxl-step__feature .pxl-step__feature-item { position: relative; display: flex; gap: 24px; cursor: pointer; z-index: 3; } .pxl-step__style-2 .pxl-step__feature .pxl-step__feature-item+.pxl-step__feature-item { margin-top: 40px; } .pxl-step__style-2 .pxl-step__feature .pxl-step__feature-item:first-child::before { display: none; } .pxl-step__style-2 .pxl-step__feature .pxl-step__feature-item .pxl-step__feature-number { display: flex; width: 48px; height: 48px; min-width: 48px; padding: 8px; justify-content: center; align-items: center; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.8px; background-color: #252b37; color: #717680; } .pxl-step__style-2 .pxl-step__feature .pxl-step__feature-item .pxl-step__feature-content { display: flex; flex-direction: column; gap: 16px; transition: all 0.3s ease; } .pxl-step__style-2 .pxl-step__feature .pxl-step__feature-item .pxl-step__feature-content .pxl-step__feature-title { font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.8px; color: #717680; margin-top: 12px; } .pxl-step__style-2 .pxl-step__feature .pxl-step__feature-item .pxl-step__feature-content .pxl-step__feature-desc { color: #a4a7ae; height: 0; overflow: hidden; transition: all 0.3s ease; } .pxl-step__style-2 .pxl-step__feature .pxl-step__feature-item.active .pxl-step__feature-number { background: #2e90fa; color: #fff; } .pxl-step__style-2 .pxl-step__feature .pxl-step__feature-item.active .pxl-step__feature-title { color: #fff; } .pxl-step__style-2 .pxl-step__feature .pxl-step__feature-item.active .pxl-step__feature-desc { height: 100%; } .pxl-step__style-3 .pxl-step__feature { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; width: 100%; } .pxl-step__style-3 .pxl-step__feature .pxl-step__feature-item { border-radius: 20px; border: 0.5px solid transparent; background: transparent; box-shadow: 0 1px 1px -0.5px transparent, 0 3px 3px -1.5px transparent, 0 24px 24px -12px transparent; padding: 32px; display: flex; flex-direction: column; width: 100%; cursor: pointer; } @media screen and (max-width: 1200px) { .pxl-step__style-3 .pxl-step__feature .pxl-step__feature-item { padding: 16px; } } .pxl-step__style-3 .pxl-step__feature .pxl-step__feature-item.active { pointer-events: none; cursor: default; border: 0.5px solid #efefef; background: #fff; box-shadow: 0 1px 1px -0.5px rgba(0, 0, 0, 0.04), 0 3px 3px -1.5px rgba(0, 0, 0, 0.04), 0 24px 24px -12px rgba(0, 0, 0, 0.04); } .pxl-step__style-3 .pxl-step__feature .pxl-step__feature-item .pxl-step__feature-content { display: flex; flex-direction: column; gap: 12px; } .pxl-step__style-3 .pxl-step__feature .pxl-step__feature-item .pxl-step__feature-content .pxl-step__feature-title { color: #000; font-family: Geist; font-size: 16px; font-weight: 500; line-height: 1.3; letter-spacing: -0.96px; } .pxl-step__style-3 .pxl-step__feature .pxl-step__feature-item .pxl-step__feature-content .pxl-step__feature-desc { color: #606060; font-family: Geist; font-size: 16px; font-weight: 400; line-height: 1.35; letter-spacing: -0.48px; display: none; } .pxl-step__style-3 .pxl-step__feature .pxl-step__feature-item .pxl-step__feature-content .pxl-step__feature-desc ul { list-style: none; padding: 0; margin: 0; } .pxl-step__style-3 .pxl-step__feature .pxl-step__feature-item .pxl-step__feature-content .pxl-step__feature-desc ul li { font-size: 16px; font-family: Geist; font-weight: 400; line-height: 1.35; letter-spacing: -0.48px; padding: 0 0 0 24px; position: relative; } .pxl-step__style-3 .pxl-step__feature .pxl-step__feature-item .pxl-step__feature-content .pxl-step__feature-desc ul li:before { content: ""; display: block; width: 4px; height: 4px; border-radius: 50%; background-color: #606060; position: absolute; top: 9px; left: 10px; } .pxl-step-image { position: relative; } .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list { width: 100%; height: 666px; margin: 0; padding: 0; list-style: none; z-index: 1; position: relative; } @media screen and (max-width: 575px) { .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list { height: 550px; } } @media screen and (max-width: 479px) { .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list { height: 400px; } } .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item { z-index: 1; position: absolute; top: 0; left: 0; width: fit-content; opacity: 0; transition: all 0.3s ease; visibility: hidden; transform: translateY(40px); } .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant { position: absolute; top: 50%; left: 50%; width: 100%; height: 100%; transform: translate(-50%, -50%); opacity: 0; transition: all 1s ease; } .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant.active { opacity: 1; } .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant__container { opacity: 1; will-change: transform; transform: none; width: 100%; height: 100%; position: relative; } .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant__container .pxl-variant__group { border-radius: 12px; height: 100%; width: 100%; opacity: 1; position: relative; } .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant__container .pxl-variant__group .pxl-variant__item { position: absolute; } .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(1) { width: 10%; height: 50%; flex-shrink: 0; border-radius: 463.866px; background: #3521a8; filter: blur(76.64584px); top: 50%; left: 0%; transform: translateY(-50%); } @media screen and (max-width: 575px) { .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(1) { filter: blur(20px); } } .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(2) { position: absolute; width: 10%; height: 50%; flex-shrink: 0; border-radius: 463.866px; background: #3521a8; filter: blur(76.64584px); top: 50%; right: 0%; transform: translateY(-50%); } @media screen and (max-width: 575px) { .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(2) { filter: blur(20px); } } .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(3) { position: absolute; width: 30%; height: 10%; flex-shrink: 0; border-radius: 447px; background: #9821a8; filter: blur(68.78472px); top: 0%; left: 0%; } @media screen and (max-width: 575px) { .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(3) { filter: blur(20px); } } .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(4) { position: absolute; width: 30%; height: 10%; flex-shrink: 0; border-radius: 447px; background: #218da8; filter: blur(68.78472px); top: 0%; right: 0%; } @media screen and (max-width: 575px) { .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(4) { filter: blur(20px); } } .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(5) { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 16px; opacity: 0.64; background: linear-gradient(180deg, #53b1fd 0%, rgba(83, 177, 253, 0.00) 100%); filter: blur(40px); } @media screen and (max-width: 575px) { .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(5) { filter: blur(12px); } } .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(6) { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 16px; background: linear-gradient(180deg, #53b1fd 0%, rgba(83, 177, 253, 0.00) 100%); box-shadow: 0px 0px 4px 0px #fff; } .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(7) { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 16px; opacity: 0.64; background: linear-gradient(180deg, rgba(83, 177, 253, 0.72) 0%, rgba(83, 177, 253, 0.00) 100%); filter: blur(19.48829px); } @media screen and (max-width: 575px) { .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(7) { filter: blur(6px); } } .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(8) { position: absolute; top: 0; left: 0; width: 100%; height: 100%; fill: linear-gradient(180deg, #53b1fd -61.53%, rgba(83, 177, 253, 0.00) 38.47%); opacity: 0.64; filter: drop-shadow(0px -1.3px 4px #fff); } @media screen and (max-width: 575px) { .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(8) { filter: blur(6px); } } .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(9) { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 16px; border: 4px solid #ec8cf9; background: #d9d9d9; filter: blur(8px); } @media screen and (max-width: 575px) { .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item .pxl-variant__container .pxl-variant__group .pxl-variant__item:nth-child(9) { filter: blur(6px); } } .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item img { position: relative; z-index: 2; border-radius: 16px; } .pxl-step-image.pxl-step-image__style-1 .pxl-step-image__list .pxl-step-image__item.active { opacity: 1; visibility: visible; transform: translateY(0); } .pxl-step-image.pxl-step-image__style-2 .pxl-step-image__list { width: 100%; height: 100%; margin: 0; padding: 0; list-style: none; z-index: 1; position: relative; } @media screen and (max-width: 575px) { .pxl-step-image.pxl-step-image__style-2 .pxl-step-image__list { height: 550px; } } @media screen and (max-width: 479px) { .pxl-step-image.pxl-step-image__style-2 .pxl-step-image__list { height: 300px; } } .pxl-step-image.pxl-step-image__style-2 .pxl-step-image__list .pxl-step-image__item { z-index: 1; position: absolute; top: 0; left: 0; width: fit-content; opacity: 0; transition: all 0.3s ease; visibility: hidden; transform: translateY(40px); } .pxl-step-image.pxl-step-image__style-2 .pxl-step-image__list .pxl-step-image__item img { position: relative; z-index: 2; border-radius: 16px; box-shadow: 0 1px 1px -0.5px rgba(0, 0, 0, 0.04), 0 3px 3px -1.5px rgba(0, 0, 0, 0.04), 0 24px 24px -12px rgba(0, 0, 0, 0.04); } .pxl-step-image.pxl-step-image__style-2 .pxl-step-image__list .pxl-step-image__item.active { opacity: 1; visibility: visible; transform: translateY(0); position: relative; } .pxl-step__style-s2 .pxl-step__number { width: 48px; height: 48px; min-width: 48px; border-radius: 50%; background-color: #000; color: #fff; font-size: 18px; font-weight: 600; line-height: 135%; letter-spacing: -0.9px; display: flex; justify-content: center; align-items: center; } .pxl-step__style-s2 .pxl-step__content-title { color: #181d27; font-size: 24px; font-weight: 600; line-height: 125%; letter-spacing: -0.96px; margin-bottom: 16px; } .pxl-step__style-s2 .pxl-step__content-desc { color: #606060; font-size: 16px; font-weight: 400; line-height: 135%; letter-spacing: -0.32px; } .pxl-nav__style-1 { display: flex; gap: 8px; } .pxl-nav__style-1 .pxl-nav__item { width: 40px; height: 40px; border-radius: 40px; display: flex; justify-content: center; align-items: center; border: 1px solid #d5d7da; cursor: pointer; position: relative; transition: all 0.3s ease; background-color: #fff; } .pxl-nav__style-1 .pxl-nav__item svg path { stroke: var(--primary-color); transition: all 0.3s ease; } .pxl-nav__style-1 .pxl-nav__item::before { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% - 5px); height: calc(100% - 5px); background: linear-gradient(299deg, rgba(173, 157, 255, 0) 0%, rgba(158, 229, 255, 0) 49.19%, rgba(220, 160, 255, 0) 98.39%); filter: blur(5px); -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; z-index: -1; transition: all 0.3s ease; } .pxl-nav__style-1 .pxl-nav__item:hover { border-color: var(--secondary-color); } .pxl-nav__style-1 .pxl-nav__item:hover::before { background: linear-gradient(299deg, rgba(173, 157, 255, 0.88) 0%, rgba(158, 229, 255, 0.88) 49.19%, rgba(220, 160, 255, 0.88) 98.39%); } .pxl-nav__style-1 .pxl-nav__item:hover svg path { stroke: var(--secondary-color); } .pxl-office { position: relative; } .pxl-office__image { position: relative; width: fit-content; margin: 0 auto 64px; } .pxl-office__pos { position: absolute; top: 0; left: 0; width: 100%; height: 100%; list-style: none; } .pxl-office__pos .pxl-office__pos-item { position: absolute; width: 52px; height: 81px; cursor: pointer; } .pxl-office__pos .pxl-office__pos-item img { position: absolute; top: 32%; left: 50%; transform: translate(-50%, -50%); min-width: 42px; border: 2.5px solid #fff; border-radius: 50%; } .pxl-office__content .pxl-office__content-item { display: none; } .pxl-office__content .pxl-office__content-item.active { display: block; } .pxl-pricing-table { width: 100%; position: relative; } .pxl-pricing-table__layout-1 table { display: table; border: none; border-collapse: collapse; } .pxl-pricing-table__layout-1 table tr td, .pxl-pricing-table__layout-1 table tr th { border: none; } .pxl-pricing-table__layout-1 table tr td:first-child, .pxl-pricing-table__layout-1 table tr th:first-child { border-radius: 16px 0 0 16px; } .pxl-pricing-table__layout-1 table tr td:last-child, .pxl-pricing-table__layout-1 table tr th:last-child { border-radius: 0 16px 16px 0; } .pxl-pricing-table__layout-1 table tr td img, .pxl-pricing-table__layout-1 table tr th img { width: 16px; } .pxl-pricing-table__layout-1 table thead tr { background-color: #f8f9fc; } .pxl-pricing-table__layout-1 table thead tr th { padding: 24px; font-weight: 500; color: var(--primary-color); text-align: left; line-height: 1.2; letter-spacing: -0.8px; font-size: 20px; } .pxl-pricing-table__layout-1 table thead tr th img { width: 20px; } .pxl-pricing-table__layout-1 table tbody tr th { font-size: 16px; padding: 24px; font-weight: 500; color: var(--primary-color); text-align: left; } .pxl-pricing-table__layout-1 table tbody tr td { font-size: 16px; padding: 24px; color: var(--primary-color); font-weight: 400; text-align: left; } .pxl-pricing-table__layout-1 table tbody tr:nth-child(odd) { background-color: transparent; } .pxl-pricing-table__layout-1 table tbody tr:nth-child(even) { background-color: #f8f9fc; } .pxl-pricing-table__layout-1 .pxl-table__mobile { gap: 32px; } .pxl-pricing-table__layout-1 .pxl-table__mobile-column { padding: 20px; border: 1px solid #eaecf5; border-radius: 16px; background-color: #fff; } .pxl-pricing-table__layout-1 .pxl-table__mobile-header { font-size: 24px; font-weight: 500; color: var(--primary-color); line-height: 1.2; letter-spacing: -0.8px; margin-bottom: 20px; } .pxl-pricing-table__layout-1 .pxl-table__mobile-header img { width: 24px; height: 24px; } .pxl-pricing-table__layout-1 .pxl-table__mobile-body { display: flex; flex-direction: column; gap: 16px; } .pxl-pricing-table__layout-1 .pxl-table__mobile-body .pxl-table__mobile-cell { display: flex; justify-content: space-between; } .pxl-pricing-table__layout-1 .pxl-table__mobile-body .pxl-table__mobile-cell .pxl-table__mobile-cell--label { font-size: 16px; color: var(--primary-color); font-weight: 500; } @media screen and (max-width: 480px) { .pxl-pricing-table__layout-1 .pxl-table__mobile-body .pxl-table__mobile-cell .pxl-table__mobile-cell--label { font-size: 14px; } } .pxl-pricing-table__layout-1 .pxl-table__mobile-body .pxl-table__mobile-cell .pxl-table__mobile-cell--value { font-size: 16px; } .pxl-pricing-table__layout-1 .pxl-table__mobile-body .pxl-table__mobile-cell .pxl-table__mobile-cell--value img { width: 16px; height: 16px; } @media screen and (max-width: 480px) { .pxl-pricing-table__layout-1 .pxl-table__mobile-body .pxl-table__mobile-cell .pxl-table__mobile-cell--value { font-size: 14px; } .pxl-pricing-table__layout-1 .pxl-table__mobile-body .pxl-table__mobile-cell .pxl-table__mobile-cell--value img { width: 14px; height: 14px; } } .pxl-pricing-table__layout-2 { border-radius: 24px; padding: 0px 24px 24px; background: #fdfdfd; box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); } @media screen and (max-width: 575px) { .pxl-pricing-table__layout-2 { padding: 0 15px 15px; } } .pxl-pricing-table__layout-2 .pxl-table__feature { display: flex; gap: 24px; align-items: center; justify-content: space-between; flex-direction: column; padding: 0; padding: 64px 0 24px; border-radius: 16px; height: 272px; width: 260px; margin: -24px auto 24px; } .pxl-pricing-table__layout-2 .pxl-table__feature-top { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 24px; } .pxl-pricing-table__layout-2 .pxl-table__feature-price-wrap { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 6px; } .pxl-pricing-table__layout-2 .pxl-table__feature-title { font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.8px; color: var(--primary-color); } .pxl-pricing-table__layout-2 .pxl-table__feature-price { font-size: 40px; font-weight: 500; line-height: 1.2; letter-spacing: -2px; color: var(--primary-color); } .pxl-pricing-table__layout-2 .pxl-table__feature-period { font-size: 14px; color: var(--third-color); font-weight: 400; line-height: 1.3; letter-spacing: -0.28px; } .pxl-pricing-table__layout-2 .pxl-table__feature-button { display: flex; justify-content: center; align-items: center; gap: 6px; align-self: stretch; } .pxl-pricing-table__layout-2 .pxl-table__feature-button a { border-radius: 12px; font-weight: 500; color: var(--primary-color); width: 100%; height: 100%; padding: 9px 20px; border: 1px solid #d5d7da; background: #fff; } .pxl-pricing-table__layout-2 .pxl-table__feature-button a:hover { background-color: var(--primary-color); border-color: var(--primary-color); color: #fff; } .pxl-pricing-table__layout-2 .pxl-table__feature.active { background: #2e90fa; padding: 64px 24px 48px; } .pxl-pricing-table__layout-2 .pxl-table__feature.active .pxl-table__feature-title { color: #fff; } .pxl-pricing-table__layout-2 .pxl-table__feature.active .pxl-table__feature-price { color: #fff; } .pxl-pricing-table__layout-2 .pxl-table__feature.active .pxl-table__feature-period { color: #fff; } .pxl-pricing-table__layout-2 .pxl-table__feature.active .pxl-table__feature-button { border-color: #fff; } .pxl-pricing-table__layout-2 .pxl-table__feature.active .pxl-table__feature-button a { background: #fff; color: var(--primary-color); } .pxl-pricing-table__layout-2 .pxl-table__feature.active .pxl-table__feature-button a:hover { background-color: var(--primary-color); color: #fff; border-color: var(--primary-color); } @media screen and (max-width: 575px) { .pxl-pricing-table__layout-2 .pxl-table__feature { padding: 16px 0 16px; height: 200px; margin-top: 0; } .pxl-pricing-table__layout-2 .pxl-table__feature.active { padding: 16px 16px 32px; } } .pxl-pricing-table__layout-2 .pxl-table__wrap { border-collapse: collapse; } .pxl-pricing-table__layout-2 .pxl-table__wrap thead tr th:not(:first-child) { width: 308px; } .pxl-pricing-table__layout-2 .pxl-table__wrap tbody tr { height: 64px; } .pxl-pricing-table__layout-2 .pxl-table__wrap tbody tr th { font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -0.32px; text-align: left; border-radius: 16px 0 0 16px; padding: 21px 24px; color: var(--primary-color); } .pxl-pricing-table__layout-2 .pxl-table__wrap tbody tr td { font-size: 16px; font-weight: 400; line-height: 1.35; letter-spacing: -0.32px; padding: 21px 24px; text-align: center; color: var(--primary-color); } .pxl-pricing-table__layout-2 .pxl-table__wrap tbody tr td:last-child { border-radius: 0 16px 16px 0; } .pxl-pricing-table__layout-2 .pxl-table__wrap tbody tr:nth-child(odd) { background-color: #f5f5f5; } .pxl-pricing-table__layout-2 .pxl-table__wrap tbody tr:nth-child(even) { background-color: transparent; } .pxl-pricing-table__layout-2 .pxl-table__mobile { padding: 24px 0; gap: 32px; } .pxl-pricing-table__layout-2 .pxl-table__mobile-column { padding: 32px; border: 1px solid #eaecf5; border-radius: 16px; background-color: #fff; } .pxl-pricing-table__layout-2 .pxl-table__mobile-body { display: flex; flex-direction: column; gap: 16px; } .pxl-pricing-table__layout-2 .pxl-table__mobile-body .pxl-table__mobile-cell { display: flex; justify-content: space-between; } .pxl-cinfo { position: relative; } .pxl-cinfo__title { font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.8px; display: flex; align-items: center; gap: 4px; margin-bottom: 26px; } .pxl-cinfo__title img { width: 20px; transform: translateY(-2px); } .pxl-cinfo ul { display: flex; flex-wrap: wrap; padding: 0; margin: 0; list-style: none; } .pxl-cinfo__layout-1 .pxl-cinfo__list { gap: 8px; display: flex; } .pxl-cinfo__layout-1 .pxl-cinfo__list .pxl-cinfo__item { gap: 8px; border-radius: 8px; padding: 7px 16px; display: flex; align-items: center; font-size: 14px; font-weight: 500; } .pxl-cinfo__layout-1 .pxl-cinfo__list .pxl-cinfo__item img { width: 14px; transform: translateY(-1px); } .pxl-cinfo__layout-1 .pxl-cinfo__list .pxl-cinfo__item-loc { color: #3e1c96; background-color: #ebe9fe; } .pxl-cinfo__layout-1 .pxl-cinfo__list .pxl-cinfo__item-type { color: #0b4a6f; background-color: #e0f2fe; } .pxl-cinfo__layout-1 .pxl-cinfo__list .pxl-cinfo__item-slot { color: var(--primary-color); background-color: #eaecf5; } .pxl-cinfo__layout-2 { background-color: #fff; padding: 24px 24px 28px; border: 1px solid #eaecf5; border-radius: 8px; } .pxl-cinfo__layout-2 ul { flex-direction: column; gap: 16px; } .pxl-cinfo__layout-2 ul li { display: flex; gap: 4px; align-items: center; } .pxl-cinfo__layout-2 ul li span { font-weight: 500; color: var(--primary-color); } .pxl-cinfo__layout-2 ul li span.pxl-cinfo__item-gray { color: var(--third-color); } .pxl-cinfo__layout-2 ul li img { width: 16px; } .pxl-cinfo__layout-2 ul li .pxl-cinfo__item-gray { border-radius: 8px; background: #eaecf5; padding: 3px 8px; margin-left: 4px; } .pxl-copy { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; position: relative; } .pxl-copy__text { padding: 3px 8px; background-color: #eaecf5; border-radius: 8px; color: #2e90fa; font-weight: 500; } .pxl-copy__button { display: flex; align-items: center; cursor: pointer; } .pxl-copy__notify { color: var(--secondary-color); } .pxl-image-box--layout-1 { position: relative; display: flex; flex-direction: column; justify-content: space-between; gap: 48px; padding: 12px; border-radius: 24px; background: #fff; height: 100%; } .pxl-image-box--layout-1 .pxl-image-box__image { position: relative; } .pxl-image-box--layout-1 .pxl-image-box__image .pxl-image-box__star { position: absolute; top: 8px; left: 8px; width: fit-content; display: flex; align-items: center; justify-content: center; gap: 6px; background-color: #fff; border-radius: 99px; background: #fff; box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); padding: 4px 12px 4px 4px; font-size: 12px; font-weight: 500; line-height: 1.3; letter-spacing: -0.24px; font-size: 16px; line-height: 1; letter-spacing: -0.32px; color: var(--primary-color); } .pxl-image-box--layout-1 .pxl-image-box__image img { border-radius: 16px; } .pxl-image-box--layout-1 .pxl-image-box__content { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; } .pxl-image-box--layout-1 .pxl-image-box__content .pxl-image-box__title { display: inline-flex; padding: 3px 8px; justify-content: center; align-items: center; gap: 8px; font-weight: 500; color: var(--primary-color); background-color: #e9e9e9; border-radius: 99px; } .pxl-image-box--layout-1 .pxl-image-box__content .pxl-image-box__position { font-weight: 400; color: var(--third-color); display: inline-flex; padding: 2px 8px; justify-content: center; align-items: center; gap: 8px; background-color: #e9e9e9; border-radius: 99px; } .pxl-image-box--layout-2 { position: relative; border-radius: 12px; border: 0.6px solid #d5d7da; background: #fff; padding: 32px 32px 0; overflow: hidden; } .pxl-image-box--layout-2:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.06); backdrop-filter: blur(14px); z-index: 1; opacity: 0; transition: all 0.3s ease; border-radius: 12px; } .pxl-image-box--layout-2 .pxl-image-box__image { text-align: center; } .pxl-image-box--layout-2 .pxl-image-box__image img { border-radius: 6px 6px 0 0; box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); } .pxl-image-box--layout-2 .pxl-image-box__button { display: flex; flex-direction: column; gap: 12px; justify-content: center; align-items: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2; } .pxl-image-box--layout-2 .pxl-image-box__button .btn-glossy { border-radius: 12px; text-align: center; min-width: 120px; transform: scale(0); opacity: 0; transition: all 0.3s ease; } .pxl-image-box--layout-2 .pxl-image-box__active-text { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 18px; font-weight: 400; line-height: 1.35; letter-spacing: -0.36px; color: var(--primary-color); z-index: 2; } .pxl-image-box--layout-2:hover:before, .pxl-image-box--layout-2.active:before { opacity: 1; } .pxl-image-box--layout-2:hover .pxl-image-box__button .btn-glossy, .pxl-image-box--layout-2.active .pxl-image-box__button .btn-glossy { transform: scale(1); opacity: 1; } .pxl-image-box--layout-3 { position: relative; margin-bottom: 24px; } .pxl-image-box--layout-3 .pxl-image-box__dot { position: absolute; top: 16px; left: 16px; display: block; z-index: 2; display: flex; gap: 8px; } .pxl-image-box--layout-3 .pxl-image-box__dot-1 { width: 12px; height: 12px; background-color: #ee6a5f; border-radius: 50%; box-shadow: 0 0 6.764px 0 #ec6d62 inset; } .pxl-image-box--layout-3 .pxl-image-box__dot-2 { width: 12px; height: 12px; background-color: #f5bd4f; border-radius: 50%; box-shadow: 0 0 6.764px 0 #f5c451 inset; } .pxl-image-box--layout-3 .pxl-image-box__dot-3 { width: 12px; height: 12px; background-color: #58a942; border-radius: 50%; box-shadow: 0 0 6.764px 0 #68cc58 inset; } .pxl-image-box--layout-3:after { content: ""; position: absolute; top: 24px; left: 24px; width: calc(100% - 48px); height: 100%; border: 0.6px solid rgba(255, 255, 255, 0.32); border-radius: 12px; z-index: 0; } .pxl-image-box--layout-3 .pxl-image-box__inner { position: relative; padding: 64px 32px 0; overflow: hidden; z-index: 2; border-radius: 12px; border: 0.6px solid rgba(255, 255, 255, 0.32); background: linear-gradient(180deg, rgba(255, 255, 255, 0.12) 0%, rgba(255, 255, 255, 0.00) 100%); backdrop-filter: blur(6px); padding: 64px 32px 0; z-index: 1; } .pxl-image-box--layout-3 .pxl-image-box__inner:after { content: ""; position: absolute; bottom: 0px; left: 1px; width: calc(100% - 2px); height: 23%; background: linear-gradient(180deg, rgba(13, 11, 16, 0.00) 0%, #0d0b10 100%); z-index: 2; } .pxl-image-box--layout-3 .pxl-image-box__inner .pxl-image-box__image { overflow: hidden; border-radius: 12px 12px 0 0; box-shadow: 0 43.077px 86.154px -26.923px rgba(24, 29, 39, 0.12); } .pxl-image-box--layout-3 .pxl-image-box__inner .pxl-image-box__feature { display: flex; gap: 8px; flex-wrap: wrap; position: absolute; top: 16px; right: 16px; z-index: 2; } .pxl-image-box--layout-3 .pxl-image-box__inner .pxl-image-box__feature-item { font-size: 14px; font-style: normal; font-weight: 500; line-height: 1.3; letter-spacing: -0.28px; padding: 0 10px; display: flex; align-items: center; justify-content: center; height: 24px; line-height: 1; border-radius: 99px; background: linear-gradient(107deg, #f2ff3d 7.96%, #abff43 90.72%); border: 0.6px solid rgba(255, 255, 255, 0.40); color: #0a0d12; } .pxl-image-box--layout-3 .pxl-image-box__inner .pxl-image-box__button { position: absolute; width: 100%; left: 50%; z-index: 3; display: flex; gap: 12px; opacity: 0; visibility: hidden; transition: all 0.3s ease; justify-content: center; flex-flow: row wrap; } .pxl-image-box--layout-3 .pxl-image-box__inner .pxl-image-box__button--top { top: 32px; bottom: auto; transform: translate(-50%, -100%); } .pxl-image-box--layout-3 .pxl-image-box__inner .pxl-image-box__button--middle { top: 50%; transform: translate(-50%, -100%); } .pxl-image-box--layout-3 .pxl-image-box__inner .pxl-image-box__button--bottom { bottom: 32px; transform: translate(-50%, 100%); } .pxl-image-box--layout-3 .pxl-image-box__inner .pxl-image-box__button .btn { padding: 9px 16px; height: 40px; font-size: 16px; font-style: normal; font-weight: 500; line-height: 1.35; letter-spacing: -0.32px; } .pxl-image-box--layout-3 .pxl-image-box__inner .pxl-image-box__button .btn__linear-blur-2 { --gradient-color-1: #6248ff; --gradient-color-2: #6b49f6; --gradient-color-3: #9049cd; --gradient-color-4: #c44a92; --gradient-color-5: #e5496a; color: #fff; background: linear-gradient(84deg, #6248ff -15.95%, #6b49f6 12.74%, #9049cd 41.52%, #c44a92 70.92%, #e5496a 103.3%); } .pxl-image-box--layout-3 .pxl-image-box__inner .pxl-image-box__button .btn-mix-blend-mode-light { color: #fff; background-color: transparent; } .pxl-image-box--layout-3 .pxl-image-box__inner .pxl-image-box__button .btn-mix-blend-mode-light:before { content: ""; position: absolute; background: linear-gradient(180deg, rgba(13, 11, 16, 0.00) 0%, #0d0b10 100%); top: 3px; left: 3px; width: calc(100% - 6px); height: calc(100% - 6px); border-radius: 99px; background: #000; z-index: 1; } .pxl-image-box--layout-3 .pxl-image-box__inner .pxl-image-box__button .btn-mix-blend-mode-light:after { content: ""; width: 100%; height: 100%; top: 0; left: 0; } .pxl-image-box--layout-3.pxl-image-box--coming-soon .pxl-image-box__button { opacity: 1; visibility: visible; } .pxl-image-box--layout-3.pxl-image-box--coming-soon .pxl-image-box__button a { cursor: default; } .pxl-image-box--layout-3.pxl-image-box--coming-soon .pxl-image-box__image img { filter: blur(18px); } .pxl-image-box--layout-3.pxl-image-box--coming-soon .pxl-image-box__image:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(13, 11, 16, 0.00) 0%, #0d0b10 100%); } .pxl-image-box--layout-3:hover:not(.pxl-image-box--coming-soon) .pxl-image-box__button { opacity: 1; visibility: visible; } .pxl-image-box--layout-3:hover:not(.pxl-image-box--coming-soon) .pxl-image-box__button--top { transform: translate(-50%, 0px); } .pxl-image-box--layout-3:hover:not(.pxl-image-box--coming-soon) .pxl-image-box__button--middle { transform: translate(-50%, 50%); } .pxl-image-box--layout-3:hover:not(.pxl-image-box--coming-soon) .pxl-image-box__button--bottom { transform: translate(-50%, 0); } .pxl-image-box--layout-4 { position: relative; border-radius: 12px; border: 1px solid #d5d7da; background: #fff; padding: 12px; transition: all 0.3s ease; box-shadow: 0 0px 0px 0px rgba(24, 29, 39, 0.20); } .pxl-image-box--layout-4 .pxl-image-box__image { position: relative; overflow: hidden; border-radius: 8px; } .pxl-image-box--layout-4 .pxl-image-box__image img { position: relative; z-index: 1; transition: all 0.3s ease; transform: scale(1); } .pxl-image-box--layout-4 .pxl-image-box__image .pxl-image-box__button { position: absolute; top: 16px; right: 16px; z-index: 2; border-radius: 99px; background: #fff; box-shadow: 0 1px 1px -0.5px rgba(0, 0, 0, 0.04), 0 3px 3px -1.5px rgba(0, 0, 0, 0.04), 0 24px 24px -12px rgba(0, 0, 0, 0.04); display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; } .pxl-image-box--layout-4 .pxl-image-box__image .pxl-image-box__button svg { width: 24px; height: 24px; } .pxl-image-box--layout-4 .pxl-image-box__image .pxl-image-box__button i { font-size: 24px; color: #000; } .pxl-image-box--layout-4 .pxl-image-box__content { padding: 32px 12px 12px; } .pxl-image-box--layout-4 .pxl-image-box__content-sub-title { --value-color-1: #957efc; --value-color-2: #deb1ff; font-size: 14px; font-weight: 600; line-height: 130%; letter-spacing: -0.28px; text-transform: uppercase; background: linear-gradient(91deg, var(--value-color-1) -1.38%, var(--value-color-2) 101.01%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; margin-bottom: 12px; } .pxl-image-box--layout-4 .pxl-image-box__content-title { font-family: "Arapey", sans-serif; font-size: 24px; font-style: normal; font-weight: 400; line-height: 100%; letter-spacing: -0.72px; margin-bottom: 12px; color: #0a0d12; } .pxl-image-box--layout-4 .pxl-image-box__content-excerpt { color: #535862; margin-bottom: 32px; } .pxl-image-box--layout-4 .pxl-image-box__content-feature-list { display: flex; flex-flow: row wrap; gap: 8px; } .pxl-image-box--layout-4 .pxl-image-box__content-feature-list .pxl-image-box__content-feature-item { display: flex; align-items: center; gap: 6px; padding: 6px 12px 6px 6px; border-radius: 99px; background: #f8f9fc; border: 1px solid #d5d7da; } .pxl-image-box--layout-4 .pxl-image-box__content-feature-list .pxl-image-box__content-feature-item span { font-size: 14px; font-weight: 500; line-height: 1.3; letter-spacing: -0.28px; color: #0a0d12; } .pxl-image-box--layout-4 .pxl-image-box__link-item { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 3; } .pxl-image-box--layout-4:hover { border-color: #fff; box-shadow: 0 12px 64px -12px rgba(24, 29, 39, 0.20); } .pxl-image-box--layout-4:hover .pxl-image-box__image img { transform: scale(1.05); } .pxl-image-box--carousel.pxl-image-box--carousel-layout-4 .pxl-swiper-slider__item-inner { position: relative; border-radius: 12px; border: 1px solid #d5d7da; background: #fff; padding: 12px; transition: all 0.3s ease; box-shadow: 0 0px 0px 0px rgba(24, 29, 39, 0.20); } .pxl-image-box--carousel.pxl-image-box--carousel-layout-4 .pxl-swiper-slider__item-inner .pxl-image-box__image { position: relative; overflow: hidden; border-radius: 8px; } .pxl-image-box--carousel.pxl-image-box--carousel-layout-4 .pxl-swiper-slider__item-inner .pxl-image-box__image img { position: relative; z-index: 1; transition: all 0.3s ease; transform: scale(1); } .pxl-image-box--carousel.pxl-image-box--carousel-layout-4 .pxl-swiper-slider__item-inner .pxl-image-box__image .pxl-image-box__button { position: absolute; top: 16px; right: 16px; z-index: 2; border-radius: 99px; background: #fff; box-shadow: 0 1px 1px -0.5px rgba(0, 0, 0, 0.04), 0 3px 3px -1.5px rgba(0, 0, 0, 0.04), 0 24px 24px -12px rgba(0, 0, 0, 0.04); display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; } .pxl-image-box--carousel.pxl-image-box--carousel-layout-4 .pxl-swiper-slider__item-inner .pxl-image-box__image .pxl-image-box__button svg { width: 24px; height: 24px; } .pxl-image-box--carousel.pxl-image-box--carousel-layout-4 .pxl-swiper-slider__item-inner .pxl-image-box__image .pxl-image-box__button i { font-size: 24px; color: #000; } .pxl-image-box--carousel.pxl-image-box--carousel-layout-4 .pxl-swiper-slider__item-inner .pxl-image-box__content { padding: 32px 12px 12px; } .pxl-image-box--carousel.pxl-image-box--carousel-layout-4 .pxl-swiper-slider__item-inner .pxl-image-box__content-sub-title { --value-color-1: #957efc; --value-color-2: #deb1ff; font-size: 14px; font-weight: 600; line-height: 130%; letter-spacing: -0.28px; text-transform: uppercase; background: linear-gradient(91deg, var(--value-color-1) -1.38%, var(--value-color-2) 101.01%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; margin-bottom: 12px; } .pxl-image-box--carousel.pxl-image-box--carousel-layout-4 .pxl-swiper-slider__item-inner .pxl-image-box__content-title { font-family: "Arapey", sans-serif; font-size: 24px; font-style: normal; font-weight: 400; line-height: 100%; letter-spacing: -0.72px; margin-bottom: 12px; color: #0a0d12; } .pxl-image-box--carousel.pxl-image-box--carousel-layout-4 .pxl-swiper-slider__item-inner .pxl-image-box__content-excerpt { color: #535862; margin-bottom: 32px; } .pxl-image-box--carousel.pxl-image-box--carousel-layout-4 .pxl-swiper-slider__item-inner .pxl-image-box__content-feature-list { display: flex; flex-flow: row wrap; gap: 8px; } .pxl-image-box--carousel.pxl-image-box--carousel-layout-4 .pxl-swiper-slider__item-inner .pxl-image-box__content-feature-list .pxl-image-box__content-feature-item { display: flex; align-items: center; gap: 6px; padding: 6px 12px 6px 6px; border-radius: 99px; background: #f8f9fc; border: 1px solid #d5d7da; } .pxl-image-box--carousel.pxl-image-box--carousel-layout-4 .pxl-swiper-slider__item-inner .pxl-image-box__content-feature-list .pxl-image-box__content-feature-item span { font-size: 14px; font-weight: 500; line-height: 1.3; letter-spacing: -0.28px; color: #0a0d12; } .pxl-image-box--carousel.pxl-image-box--carousel-layout-4 .pxl-swiper-slider__item-inner .pxl-image-box__link-item { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 3; } .pxl-image-box--carousel.pxl-image-box--carousel-layout-4 .pxl-swiper-slider__item-inner:hover { border-color: #fff; box-shadow: 0 12px 64px -12px rgba(24, 29, 39, 0.20); } .pxl-image-box--carousel.pxl-image-box--carousel-layout-4 .pxl-swiper-slider__item-inner:hover .pxl-image-box__image img { transform: scale(1.05); } .pxl-team__style-1 .pxl-team__item, .pxl-team__style-2 .pxl-team__item { padding: 0 20px; } @media screen and (max-width: 767px) { .pxl-team__style-1 .pxl-team__item, .pxl-team__style-2 .pxl-team__item { padding: 0 12px; } } @media screen and (max-width: 575px) { .pxl-team__style-1 .pxl-team__item, .pxl-team__style-2 .pxl-team__item { padding: 0 8px; } } .pxl-team__style-1 .pxl-team__item-inner, .pxl-team__style-2 .pxl-team__item-inner { padding: 8px 8px 16px; border-radius: 16px; background: #fff; display: flex; gap: 24px; flex-direction: column; } .pxl-team__style-1 .pxl-team__item-image, .pxl-team__style-2 .pxl-team__item-image { overflow: hidden; border-radius: 12px; text-align: center; } .pxl-team__style-1 .pxl-team__item-content, .pxl-team__style-2 .pxl-team__item-content { display: flex; flex-direction: column; gap: 6px; } .pxl-team__style-1 .pxl-team__item-title, .pxl-team__style-2 .pxl-team__item-title { font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -0.32px; margin: 0; } .pxl-team__style-1 .pxl-team__item-pos, .pxl-team__style-2 .pxl-team__item-pos { font-size: 14px; font-weight: 400; line-height: 1.3; letter-spacing: -0.28px; } .pxl-team__style-1 .pxl-team__item-inner { border: 1px solid #d5d7da; } .pxl-team__style-2 .pxl-team__item-inner { box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); } .pxl-team__style-2 .pxl-swiper-slider__inner, .pxl-team__style-2 .pxl-swiper-container { overflow: visible !important; } .pxl-team__style-2 .pxl-team__item { transform: translateY(208px); opacity: 0; } .pxl-team__style-2 .pxl-team__item.swiper-slide-visible { transform: translateY(104px); transition: all 0.3s ease; opacity: 1; } .pxl-team__style-2 .pxl-team__item.swiper-slide-prev, .pxl-team__style-2 .pxl-team__item.swiper-slide-next { transform: translateY(0); } .pxl-team__style-2 .pxl-team__item.swiper-slide-active { transform: translateY(-104px); } .pxl-team .pxl-grid__item .pxl-team__item-image { position: relative; } .pxl-team .pxl-grid__item .pxl-item--social { position: absolute; top: 20px; right: 0px; width: auto; height: 100%; display: flex; flex-direction: column; gap: 8px; opacity: 0; visibility: hidden; transition: all 0.3s ease; } .pxl-team .pxl-grid__item .pxl-item--social a { width: 40px; height: 40px; border-radius: 50%; background-color: #fff; box-shadow: 0 1px 1px -0.5px rgba(0, 0, 0, 0.04), 0 3px 3px -1.5px rgba(0, 0, 0, 0.04), 0 24px 24px -12px rgba(0, 0, 0, 0.04); display: flex; align-items: center; justify-content: center; border: 1px solid #d5d7da; transition: all 0.3s ease; transform: translateX(10px); } .pxl-team .pxl-grid__item .pxl-item--social a i { font-size: 24px; } .pxl-team .pxl-grid__item .pxl-item--social a:hover { background-color: var(--primary-color); color: #fff; } .pxl-team .pxl-grid__item:hover .pxl-item--social { opacity: 1; visibility: visible; } .pxl-team .pxl-grid__item:hover .pxl-item--social a { transform: translateX(-10px); } .pxl-orbit { position: relative; width: 946px; height: 946px; } .pxl-orbit svg { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .pxl-orbit__fav { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .pxl-orbit .pxl-orbit__user { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; list-style: none; margin: 0; padding: 0; } .pxl-orbit .pxl-orbit__user-item { position: absolute; } .pxl-orbit .pxl-orbit__user-item .pxl-orbit__user-item--avt { border-radius: 50%; } .pxl-orbit .pxl-orbit__user-item .pxl-orbit__user-item--flag { border: 1px solid #fff; position: absolute; bottom: 0; right: 0; border-radius: 50%; } .pxl-orbit .pxl-orbit__user-item:first-child { left: 59px; bottom: 114px; } .pxl-orbit .pxl-orbit__user-item:first-child .pxl-orbit__user-item--avt { border: 6px solid #fff; } .pxl-orbit .pxl-orbit__user-item:nth-child(2) { left: 90px; bottom: 452px; } .pxl-orbit .pxl-orbit__user-item:nth-child(2) .pxl-orbit__user-item--avt { border: 5px solid #fff; width: 88px; } .pxl-orbit .pxl-orbit__user-item:nth-child(2) .pxl-orbit__user-item--flag { width: 21px; } .pxl-orbit .pxl-orbit__user-item:nth-child(3) { bottom: 95px; left: 399px; } .pxl-orbit .pxl-orbit__user-item:nth-child(3) .pxl-orbit__user-item--avt { border: 5px solid #fff; width: 80px; } .pxl-orbit .pxl-orbit__user-item:nth-child(3) .pxl-orbit__user-item--flag { width: 21px; } .pxl-orbit .pxl-orbit__user-item:nth-child(4) { bottom: 293px; left: 288px; } .pxl-orbit .pxl-orbit__user-item:nth-child(4) .pxl-orbit__user-item--avt { border: 4px solid #fff; width: 64px; } .pxl-orbit .pxl-orbit__user-item:nth-child(4) .pxl-orbit__user-item--flag { width: 17px; } .pxl-orbit .pxl-orbit__user-item:nth-child(5) { top: 371px; left: 328px; } .pxl-orbit .pxl-orbit__user-item:nth-child(5) .pxl-orbit__user-item--avt { border: 3px solid #fff; width: 34px; } .pxl-orbit .pxl-orbit__user-item:nth-child(5) .pxl-orbit__user-item--flag { width: 11px; } .pxl-orbit .pxl-orbit__user-item:nth-child(6) { top: 525px; right: 309px; } .pxl-orbit .pxl-orbit__user-item:nth-child(6) .pxl-orbit__user-item--avt { border: 2px solid #fff; width: 34px; } .pxl-orbit .pxl-orbit__user-item:nth-child(6) .pxl-orbit__user-item--flag { width: 11px; } .pxl-progressbar__layout-1 { flex-direction: column; } .pxl-progressbar__layout-1 .pxl-progressbar__item { flex-direction: column; gap: 12px; } .pxl-progressbar__layout-1 .pxl-progressbar__item-meta { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; } .pxl-progressbar__layout-1 .pxl-progressbar__item-title { color: var(--primary-color); } .pxl-progressbar__layout-1 .pxl-progressbar__item-value { color: var(--third-color); } .pxl-progressbar__layout-1 .pxl-progressbar__item-wrap { height: 6px; border-radius: 15px; border-radius: 12px; } .pxl-progressbar__layout-1 .pxl-progressbar__item-fill { border-radius: 12px; } .pxl-physics { min-width: 250px; height: 250px; overflow: hidden; } .pxl-physics .pxl-throwable-element { z-index: 10; } .pxl-categories .pxl-category__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; } .pxl-categories .pxl-category__list .pxl-category__item a { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--primary-color); font-weight: 500; padding: 12px 12px 12px 36px; border-radius: 8px; background-color: transparent; transition: all 0.3s ease; } .pxl-categories .pxl-category__list .pxl-category__item a:hover { background-color: #f8f9fc; } .pxl-categories .pxl-category__list .pxl-category__item a:hover .pxl-category__item-count { background-color: var(--primary-color); color: #fff; } .pxl-categories .pxl-category__list .pxl-category__item--dot { position: relative; } .pxl-categories .pxl-category__list .pxl-category__item--dot::before { content: ""; position: absolute; top: 50%; left: 50%; width: 5px; height: 5px; border-radius: 50%; background-color: var(--primary-color); position: absolute; top: 50%; left: 21.5px; transform: translateY(-50%); } .pxl-categories .pxl-category__list .pxl-category__item-inner { display: flex; gap: 8px; } .pxl-categories .pxl-category__list .pxl-category__item-icon { width: 16px; height: 16px; display: block; } .pxl-categories .pxl-category__list .pxl-category__item-icon img { width: 100%; height: 100%; position: relative; top: -2px; } .pxl-categories .pxl-category__list .pxl-category__item-count { font-size: 12px; font-weight: 500; line-height: 1.2; letter-spacing: -0.24px; color: var(--primary-color); background-color: #eaecf5; width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; border-radius: 50%; transition: all 0.3s ease; } .pxl-tags { margin: 0; } .pxl-tags.pxl-tags--widget { margin-top: 0; } .pxl-tags .pxl-tag__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; } .pxl-tags .pxl-tag__list .pxl-tag__item { display: flex; align-items: center; gap: 6px; } .pxl-tags .pxl-tag__list .pxl-tag__item a { display: flex; padding: 3px 8px; align-items: center; border-radius: 8px; background: #eaecf5; color: var(--primary-color); font-weight: 500; font-size: 14px; line-height: 1.2; letter-spacing: -0.28px; transition: all 0.3s ease; } .pxl-tags .pxl-tag__list .pxl-tag__item a:hover { background-color: var(--primary-color); color: #fff; } .pxl-blob { position: relative; } .pxl-blob .svg-1, .pxl-blob .svg-2, .pxl-blob .pxl-blob__shape-2 { will-change: transform, opacity; backface-visibility: hidden; } .pxl-blob__wrap { position: relative; width: 100%; height: 850px; overflow: hidden; max-width: 1280px; margin: 0 auto; isolation: isolate; } @media screen and (max-width: 575px) { .pxl-blob__wrap { height: 610px; } } .pxl-blob__wrap svg.svg-1 { position: absolute; top: 60%; left: 50%; transform: translate(-50%, -50%); opacity: 0.24; filter: blur(100px); } .pxl-blob__wrap svg.svg-2 { position: absolute; top: 60%; left: 50%; transform: translate(-50%, -50%); opacity: 0.64; filter: blur(100px); } .pxl-blob__wrap:after { content: ""; width: 1400px; height: 350px; background: #000; position: absolute; bottom: 20px; left: 50%; display: block; transform: translate(-50%, 50%); border-radius: 50%; } .pxl-blob__shape-1 { position: absolute; bottom: 108px; left: 50%; transform: translate(-50%, 25%); width: 455.824px; height: 302.618px; flex-shrink: 0; border-radius: 535.824px; opacity: 0.56; background: #fff; mix-blend-mode: plus-lighter; filter: blur(85.35px); } @supports (-webkit-hyphens: none) { mix-blend-mode: screen; } .pxl-blob__shape-2 { position: absolute; bottom: 52px; left: 0%; width: 100%; height: auto; min-width: 1280px; } @media screen and (max-width: 1312px) { .pxl-blob__shape-2 { bottom: 54px; left: 50%; transform: translateX(-50%); } } .pxl-coins { display: flex; flex-direction: column; gap: 8px; list-style: none; margin: 0; padding: 0; } .pxl-coins .pxl-coins__item { display: flex; align-items: center; gap: 8px; padding: 7px 11px 7px 7px; justify-content: space-between; border-radius: 16px; border: 0.6px solid rgba(255, 255, 255, 0.04); opacity: 0.4; background: rgba(255, 255, 255, 0.02); box-shadow: 0px 0px 6px 0px rgba(255, 255, 255, 0.08) inset; } .pxl-coins .pxl-coins__item-left { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; line-height: 1.3; letter-spacing: -0.28px; color: #fff; } .pxl-coins .pxl-coins__item-icon { width: 40px; height: 40px; display: block; border-radius: 50%; display: flex; align-items: center; justify-content: center; background-color: #282828; } .pxl-coins .pxl-coins__item-icon img { width: 100%; height: 100%; } .pxl-coins .pxl-coins__item-price-change svg { transform: translateY(1px); } .pxl-coins .pxl-coins__item-right { font-size: 12px; font-weight: 400; line-height: 1.2; letter-spacing: -0.24px; display: flex; align-items: center; justify-content: center; gap: 8px; } .pxl-coins .pxl-coins__item.decrease .pxl-coins__item-change-price { color: #f97066; } .pxl-coins .pxl-coins__item.increase .pxl-coins__item-change-price { color: #32d583; } .pxl-coins .pxl-coins__item.true { opacity: 1; border-radius: 16px; border: 0.6px solid #01e5e5; background: rgba(255, 255, 255, 0.08); box-shadow: 0px 0px 6px 0px rgba(255, 255, 255, 0.12) inset, 0px 0px 16px 0px rgba(93, 247, 247, 0.24); } .pxl-chart-week { display: flex; align-items: center; gap: 12px; justify-content: space-between; } .pxl-chart-week .pxl-chart-week__item { display: flex; flex-direction: column; align-items: center; gap: 6px; position: relative; width: 100%; justify-content: center; align-items: center; flex: 1; } .pxl-chart-week .pxl-chart-week__item-value { font-size: 14px; font-weight: 500; line-height: 1.3; letter-spacing: -0.28px; color: var(--primary-color); height: 100px; display: block; width: 100%; position: relative; } .pxl-chart-week .pxl-chart-week__item-value .line { position: absolute; bottom: 0; left: 0; width: 100%; } .pxl-chart-week .pxl-chart-week__item-value .line:before { content: ""; position: absolute; bottom: 0; left: 0; height: 5%; width: 100%; background-color: #e5e5e5; border-radius: 6px; transition: height 2.5s ease; transition-delay: 1.8s; } .pxl-chart-week .pxl-chart-week__item-day { font-size: 14px; font-weight: 500; line-height: 1.3; letter-spacing: -0.28px; color: var(--third-color); } .pxl-chart-week--gradient .pxl-chart-week__item.active .pxl-chart-week__item-value { --gradient-color-1: #92e136; --gradient-color-2: #d2f49d; } .pxl-chart-week--gradient .pxl-chart-week__item.active .pxl-chart-week__item-value .line:before { background: linear-gradient(180deg, var(--gradient-color-1) 0%, var(--gradient-color-2) 100%); } .pxl-chart-week.active .pxl-chart-week__item-value .line:before { height: 100%; } .pxl-select-change-counter { position: relative; } .pxl-select-change-counter .nice-select, .pxl-select-change-counter select { border-radius: 8px; border: 0.5px solid #efefef; background: #fff; box-shadow: 0 1px 1px -0.5px rgba(0, 0, 0, 0.04), 0 3px 3px -1.5px rgba(0, 0, 0, 0.04), 0 16px 14px -12px rgba(0, 0, 0, 0.04); height: 32px; padding: 0 30px 0 12px; } .pxl-select-change-counter .nice-select:after, .pxl-select-change-counter select:after { content: ""; right: 12px; width: 12px; height: 12px; } .pxl-select-change-counter .nice-select:hover, .pxl-select-change-counter select:hover, .pxl-select-change-counter .nice-select:focus, .pxl-select-change-counter select:focus, .pxl-select-change-counter .nice-select.open, .pxl-select-change-counter select.open { border-color: #efefef; } .pxl-select-change-counter .nice-select .current, .pxl-select-change-counter select .current, .pxl-select-change-counter .nice-select option, .pxl-select-change-counter select option { color: #000; } .pxl-swiper-slider.textbox .swiper-slide-prev .textbox-item__inner { border-color: #eaffae; background-color: #eaffae; } .pxl-swiper-slider.textbox.vertical { display: flex; flex-direction: row-reverse; align-items: center; justify-content: space-between; gap: 32px; } @media screen and (max-width: 767px) { .pxl-swiper-slider.textbox.vertical { gap: 16px; } } .pxl-swiper-slider.textbox.vertical .textbox-item__inner { width: 100%; } .pxl-swiper-slider.textbox.vertical .pxl-swiper-container { height: 416px; width: 100%; margin: -6px 0; } .pxl-swiper-slider.textbox.vertical .swiper-pagination-vertical { margin: 0; height: 100%; width: 8px; background-color: #ccc; border-radius: 50px; overflow: hidden; } .pxl-swiper-slider.textbox.vertical .pxl-swiper-slider__item { padding: 6px 0; width: 100%; } .pxl-swiper-slider.textbox.vertical .pxl-swiper-slider__wrapper, .pxl-swiper-slider.textbox.vertical .pxl-swiper-slider__inner, .pxl-swiper-slider.textbox.vertical .pxl-swiper-slider { width: 100%; } .pxl-swiper-slider.textbox.vertical .swiper-pagination-progressbar-fill { height: 100%; border-radius: 50px; } .pxl-swiper-slider.textbox .textbox-item__inner { height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 12px; padding: 24px; border-radius: 16px; border: 1px solid #efefef; background: #fff; box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.04); transition: all 0.3s ease; } .pxl-swiper-slider.textbox .textbox-item__inner:hover { border-color: #eaffae; background-color: #eaffae; } .pxl-swiper-slider.textbox .textbox-item__inner .textbox-item__title { color: #000; font-size: 18px; font-weight: 600; line-height: 1.35; letter-spacing: -0.9px; } .pxl-swiper-slider.textbox .textbox-item__inner .textbox-item__desc { color: #000; max-width: 476px; } .single-product.woocommerce #pxl-main { padding-top: 176px; position: relative; } @media screen and (max-width: 767px) { .single-product.woocommerce #pxl-main { padding-top: 60px; } } .single-product.woocommerce #pxl-main:before { content: ""; position: absolute; top: 0px; left: 0px; height: 315px; width: 100%; background: url(../img/shape-top.svg) center center / cover no-repeat; } .single-product.woocommerce .pxl-content-area { padding: 0; } .single-product.woocommerce .pxl-content-area div.product { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: start; } .single-product.woocommerce .pxl-content-area div.product .woocommerce-product-gallery { all: unset; width: 100%; position: relative; aspect-ratio: 86/104; overflow: hidden; } @media screen and (min-width: 768px) { .single-product.woocommerce .pxl-content-area div.product .woocommerce-product-gallery { max-width: 48%; } } @media screen and (min-width: 1260px) { .single-product.woocommerce .pxl-content-area div.product .woocommerce-product-gallery { max-width: 632px; } } .single-product.woocommerce .pxl-content-area div.product .woocommerce-product-gallery__wrapper { border-radius: 16px; overflow: hidden; } .single-product.woocommerce .pxl-content-area div.product .woocommerce-product-gallery .flex-viewport { border-radius: 16px; } .single-product.woocommerce .pxl-content-area div.product .woocommerce-product-gallery .flex-control-nav { position: absolute; bottom: 16px; left: 16px; z-index: 1; } .single-product.woocommerce .pxl-content-area div.product .woocommerce-product-gallery .flex-control-nav li { width: 100%; max-width: 86px; } .single-product.woocommerce .pxl-content-area div.product .woocommerce-product-gallery .flex-control-nav li.active { position: relative; } .single-product.woocommerce .pxl-content-area div.product .woocommerce-product-gallery .flex-control-nav li.active:before { content: ""; position: absolute; top: 0; left: 0; width: calc(100% - 4px); height: calc(100% - 4px); border: 2px solid var(--secondary-color); border-radius: 8px; z-index: 1; } .single-product.woocommerce .pxl-content-area div.product .woocommerce-product-gallery .flex-control-nav li+li { margin-left: 12px; } @media screen and (min-width: 1260px) { .single-product.woocommerce .pxl-content-area div.product .woocommerce-product-gallery .flex-control-nav li { width: 86px; } } .single-product.woocommerce .pxl-content-area div.product .woocommerce-product-gallery .flex-control-nav li img { width: 100%; aspect-ratio: 86/104; object-fit: cover; border-radius: 8px; transition: all 0.2s ease; border: 0px solid transparent; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary { all: unset; width: 100%; max-width: 100%; margin-bottom: 0; margin-top: 32px; } @media screen and (min-width: 768px) { .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary { max-width: 48%; margin-top: 0; } } @media screen and (min-width: 1260px) { .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary { max-width: 584px; } } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary .product_title { margin-bottom: 24px; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary .woocommerce-product-rating .star-rating span:before { color: #fdb022; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary .woocommerce-product-details__short-description { margin-bottom: 20px; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary .price { color: var(--primary-color); margin-bottom: 24px; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart { display: flex; flex-direction: column; align-items: start; justify-content: start; margin-bottom: 24px; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart>div { width: 100%; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .variations tr+tr th { margin-top: 24px; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .variations tr th { line-height: 1; font-size: 14px; font-weight: 400; line-height: 1.3; letter-spacing: -0.28px; margin-bottom: 8px; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .variations tr th label, .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .variations tr th .woo-selected-variation-item-name { font-size: 14px; font-weight: 400; line-height: 1.3; letter-spacing: -0.28px; margin: 0; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .variations tr td .color-variable-items-wrapper { gap: 8px; margin-left: 1px; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .variations tr td .color-variable-items-wrapper li { margin: 0; padding: 0; width: 24px; height: 24px; transition: none; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .variations tr td .color-variable-items-wrapper li .variable-item-contents:before { display: none; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .variations tr td .color-variable-items-wrapper li.selected { padding: 1px; box-shadow: 0 0 0 1px var(--secondary-color); } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .variations tr td [data-attribute_name="attribute_pa_size"] { margin-left: 1px; gap: 5px; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .variations tr td [data-attribute_name="attribute_pa_size"] li { min-width: 56px; height: 40px; border: 1px solid #d5d7da; border-radius: 50px; box-shadow: none; background-color: transparent; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .variations tr td [data-attribute_name="attribute_pa_size"] li .variable-item-span-button { width: 100%; font-weight: 500; color: var(--primary-color); } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .variations tr td [data-attribute_name="attribute_pa_size"] li.selected, .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .variations tr td [data-attribute_name="attribute_pa_size"] li:hover { background-color: var(--primary-color); border-color: var(--primary-color); } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .variations tr td [data-attribute_name="attribute_pa_size"] li.selected .variable-item-span-button, .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .variations tr td [data-attribute_name="attribute_pa_size"] li:hover .variable-item-span-button { color: #fff; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .variations_button { display: flex; flex-direction: column; align-items: start; justify-content: start; gap: 24px; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .quantity-form { width: fit-content; display: flex; flex-direction: column; gap: 8px; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .quantity-form .quantity-label { font-size: 14px; font-weight: 400; line-height: 1.3; letter-spacing: -0.28px; color: var(--primary-color); } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .quantity-form .quantity-wrap { position: relative; padding: 13px 16px; border-radius: 50px; border: 1px solid #d5d7da; background: transparent; min-width: 92px; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .quantity-form .quantity-wrap .quantity { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .quantity-form .quantity-wrap .quantity input.qty { padding: 0; margin: 0; border: none; outline: none; background: transparent; text-align: center; font-size: 16px; font-weight: 500; color: var(--primary-color); height: 22px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 20px; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .quantity-form .quantity-wrap .quantity-action { display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 1; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .quantity-form .quantity-wrap .quantity-action--down { order: 1; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .quantity-form .quantity-wrap .quantity-action--up { order: 3; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .added_to_cart { font-weight: 500; padding: 13px 16px; line-height: 1.35; letter-spacing: -0.32px; border: 1px solid #d5d7da; border-radius: 50px; color: var(--primary-color); background-color: transparent; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .added_to_cart:hover { background-color: var(--primary-color); border-color: var(--primary-color); color: #fff; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .reset_variations { display: none; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .button { width: 100%; display: flex; padding: 13px 16px; justify-content: center; align-items: center; gap: 6px; background-color: var(--primary-color); color: #fff; font-size: 16px; font-weight: 500; line-height: 1.35; border-radius: 50px; color: #fff; overflow: hidden; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart.simple-cart { display: flex; flex-wrap: wrap; flex-direction: row; width: 100%; gap: 24px 8px; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart.simple-cart:before, .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart.simple-cart:after { display: none; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart.simple-cart .quantity-form { width: 100%; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart.simple-cart .quantity-form .quantity-wrap { max-width: 92px; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart.simple-cart .single_add_to_cart_button { width: 100%; flex: 1; min-width: 120px; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .variable-cart .variations_button { display: flex; flex-wrap: wrap; flex-direction: row; gap: 24px 8px; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .variable-cart .variations_button .quantity-form { width: 100%; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .variable-cart .variations_button .quantity-form .quantity-wrap { max-width: 92px; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .variable-cart .variations_button .single_add_to_cart_button { flex: 1; min-width: 120px; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .woosc-btn, .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .woosw-btn { text-indent: -9999px; width: 48px; height: 48px; border-radius: 50%; padding: 0; display: flex; align-items: center; justify-content: center; position: relative; background-color: #fff; border: 1px solid #d5d7da; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .woosc-btn::before, .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .woosw-btn::before { content: ""; width: 16px; height: 16px; background-size: contain; background-repeat: no-repeat; background-position: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: all 0.2s ease; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .woosc-btn:hover, .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .woosw-btn:hover, .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .woosc-btn.woosw-added, .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .woosw-btn.woosw-added { background-color: var(--primary-color); border-color: var(--primary-color); } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .woosc-btn::before { background-image: url('../../woocommerce/assets/icons/compare.svg'); } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .woosc-btn:hover:before { background-image: url('../../woocommerce/assets/icons/compare-white.svg'); } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .woosw-btn::before { background-image: url('../../woocommerce/assets/icons/wishlist.svg'); } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .woosw-btn:hover:before, .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary form.cart .woosw-btn.woosw-added:before { background-image: url('../../woocommerce/assets/icons/wishlist-white.svg'); } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary .breadcrumb { display: flex; align-items: center; justify-content: start; margin-bottom: 24px; gap: 6px; line-height: 1; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary .breadcrumb .woocommerce-breadcrumb { margin: 0; font-weight: 500; color: var(--primary-color); line-height: 1.35; font-size: 16px; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary .breadcrumb .woocommerce-breadcrumb a { color: var(--primary-color); line-height: 1.35; font-size: 16px; } .single-product.woocommerce .pxl-content-area div.product .summary.entry-summary .breadcrumb .woocommerce-breadcrumb a:hover { color: var(--secondary-color); } .single-product.woocommerce .pxl-content-area div.product #reviews { width: 100%; margin-top: 120px; } @media screen and (max-width: 991px) { .single-product.woocommerce .pxl-content-area div.product #reviews { margin-top: 60px; } } @media screen and (max-width: 575px) { .single-product.woocommerce .pxl-content-area div.product #reviews { margin-top: 30px; } } .single-product.woocommerce .pxl-content-area div.product #reviews .pxl-comments { max-width: 100%; } .single-product.woocommerce .pxl-content-area div.product #reviews .pxl-comments h3.pxl-comments__title, .single-product.woocommerce .pxl-content-area div.product #reviews .pxl-comments .pxl-counter--style-default .pxl-counter__number.pxl-comments__title, .pxl-counter--style-default .single-product.woocommerce .pxl-content-area div.product #reviews .pxl-comments .pxl-counter__number.pxl-comments__title { margin-bottom: 64px; } .single-product.woocommerce .pxl-content-area div.product #reviews .pxl-comments .pxl-comment__rating { font-size: 16px; color: #fdb022; margin-bottom: 12px; } .single-product.woocommerce .pxl-content-area div.product #reviews #respond { padding-top: 64px; } .single-product.woocommerce .pxl-content-area div.product #reviews #respond .comment-reply-title { margin-bottom: 24px; } .single-product.woocommerce .pxl-content-area div.product #reviews #respond .comment-form { display: flex; flex-direction: column; } .single-product.woocommerce .pxl-content-area div.product #reviews #respond .comment-form .comment-notes { order: 1; } .single-product.woocommerce .pxl-content-area div.product #reviews #respond .comment-form__rating { display: flex; align-items: center; gap: 16px; order: 2; margin-bottom: 16px; } .single-product.woocommerce .pxl-content-area div.product #reviews #respond .comment-form__rating p.stars { margin-bottom: 0; height: 20px; } .single-product.woocommerce .pxl-content-area div.product #reviews #respond .comment-form__rating p.stars a:before { color: #fdb022; } .single-product.woocommerce .pxl-content-area div.product #reviews #respond .comment-form__input-wrap { order: 3; } .single-product.woocommerce .pxl-content-area div.product #reviews #respond .comment-form__comment { order: 4; } .single-product.woocommerce .pxl-content-area div.product #reviews #respond .comment-form__comment #comment { min-height: 195px; } .single-product.woocommerce .pxl-content-area div.product #reviews #respond .comment-form__btn { order: 5; } .single-product.woocommerce .pxl-content-area div.product #reviews .pxl-comments__wrap+#respond { margin-top: 105px; } .single-product.woocommerce .pxl-content-area div.product .related.products { text-align: center; margin-top: 120px; } @media screen and (max-width: 991px) { .single-product.woocommerce .pxl-content-area div.product .related.products { margin-top: 60px; } } @media screen and (max-width: 575px) { .single-product.woocommerce .pxl-content-area div.product .related.products { margin-top: 30px; } } .single-product.woocommerce .pxl-content-area div.product .related.products .related__title { margin-bottom: 64px; } .woocommerce span.onsale, .woocommerce-page span.onsale { all: unset; position: absolute; top: 16px; left: 16px; background-color: var(--primary-color); color: #fff; padding: 4px 8px; border-radius: 4px; font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -0.24px; z-index: 2; } .woocommerce .pxl-ptit__breadcrumb, .woocommerce-page .pxl-ptit__breadcrumb { margin-bottom: 40px; } .woocommerce .pxl-ptit__breadcrumb a, .woocommerce-page .pxl-ptit__breadcrumb a { display: flex; align-items: center; gap: 6px; justify-content: center; } @media screen and (max-width: 767px) { .woocommerce .pxl-ptit__breadcrumb, .woocommerce-page .pxl-ptit__breadcrumb { margin-bottom: 24px; } } @media screen and (max-width: 767px) { .woocommerce .pxl-ptit__breadcrumb, .woocommerce-page .pxl-ptit__breadcrumb { margin-bottom: 16px; } } .woocommerce #pxl-ptit__default, .woocommerce-page #pxl-ptit__default { padding-top: 176px; } .woocommerce ul.products, .woocommerce-page ul.products { display: grid; gap: 40px 16px; } .woocommerce ul.products:before, .woocommerce-page ul.products:before, .woocommerce ul.products:after, .woocommerce-page ul.products:after { display: none; } .woocommerce ul.products.columns-2, .woocommerce-page ul.products.columns-2 { grid-template-columns: repeat(2, 1fr); } @media screen and (max-width: 575px) { .woocommerce ul.products.columns-2, .woocommerce-page ul.products.columns-2 { grid-template-columns: repeat(1, 1fr); } } .woocommerce ul.products.columns-2 li.product, .woocommerce-page ul.products.columns-2 li.product { all: unset; } .woocommerce ul.products.columns-3, .woocommerce-page ul.products.columns-3 { grid-template-columns: repeat(3, 1fr); } @media screen and (max-width: 767px) { .woocommerce ul.products.columns-3, .woocommerce-page ul.products.columns-3 { grid-template-columns: repeat(2, 1fr); } } @media screen and (max-width: 575px) { .woocommerce ul.products.columns-3, .woocommerce-page ul.products.columns-3 { grid-template-columns: repeat(1, 1fr); } } .woocommerce ul.products.columns-3 li.product, .woocommerce-page ul.products.columns-3 li.product { all: unset; } .woocommerce ul.products.columns-4, .woocommerce-page ul.products.columns-4 { grid-template-columns: repeat(4, 1fr); } @media screen and (max-width: 1200px) { .woocommerce ul.products.columns-4, .woocommerce-page ul.products.columns-4 { grid-template-columns: repeat(3, 1fr); } } @media screen and (max-width: 767px) { .woocommerce ul.products.columns-4, .woocommerce-page ul.products.columns-4 { grid-template-columns: repeat(2, 1fr); } } @media screen and (max-width: 575px) { .woocommerce ul.products.columns-4, .woocommerce-page ul.products.columns-4 { grid-template-columns: repeat(1, 1fr); } } .woocommerce ul.products.columns-4 li.product, .woocommerce-page ul.products.columns-4 li.product { all: unset; } .woocommerce ul.products.columns-5, .woocommerce-page ul.products.columns-5 { grid-template-columns: repeat(5, 1fr); } @media screen and (max-width: 1400px) { .woocommerce ul.products.columns-5, .woocommerce-page ul.products.columns-5 { grid-template-columns: repeat(4, 1fr); } } @media screen and (max-width: 1200px) { .woocommerce ul.products.columns-5, .woocommerce-page ul.products.columns-5 { grid-template-columns: repeat(3, 1fr); } } @media screen and (max-width: 767px) { .woocommerce ul.products.columns-5, .woocommerce-page ul.products.columns-5 { grid-template-columns: repeat(2, 1fr); } } @media screen and (max-width: 575px) { .woocommerce ul.products.columns-5, .woocommerce-page ul.products.columns-5 { grid-template-columns: repeat(1, 1fr); } } .woocommerce ul.products.columns-5 li.product, .woocommerce-page ul.products.columns-5 li.product { all: unset; } .woocommerce ul.products.columns-6, .woocommerce-page ul.products.columns-6 { grid-template-columns: repeat(6, 1fr); } @media screen and (max-width: 1600px) { .woocommerce ul.products.columns-6, .woocommerce-page ul.products.columns-6 { grid-template-columns: repeat(5, 1fr); } } @media screen and (max-width: 1400px) { .woocommerce ul.products.columns-6, .woocommerce-page ul.products.columns-6 { grid-template-columns: repeat(4, 1fr); } } @media screen and (max-width: 1200px) { .woocommerce ul.products.columns-6, .woocommerce-page ul.products.columns-6 { grid-template-columns: repeat(3, 1fr); } } @media screen and (max-width: 767px) { .woocommerce ul.products.columns-6, .woocommerce-page ul.products.columns-6 { grid-template-columns: repeat(2, 1fr); } } @media screen and (max-width: 575px) { .woocommerce ul.products.columns-6, .woocommerce-page ul.products.columns-6 { grid-template-columns: repeat(1, 1fr); } } .woocommerce ul.products.columns-6 li.product, .woocommerce-page ul.products.columns-6 li.product { all: unset; } .woocommerce ul.products li.product, .woocommerce-page ul.products li.product { width: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 24px; } .woocommerce ul.products li.product .product-top, .woocommerce-page ul.products li.product .product-top { overflow: hidden; border-radius: 12px; aspect-ratio: 308/370; position: relative; } .woocommerce ul.products li.product .product-top .product-image, .woocommerce-page ul.products li.product .product-top .product-image { width: 100%; height: 100%; } .woocommerce ul.products li.product .product-top .product-image img, .woocommerce-page ul.products li.product .product-top .product-image img { object-fit: cover; transform: scale(1); transition: all 0.2s ease; } .woocommerce ul.products li.product .product-top .product-actions, .woocommerce-page ul.products li.product .product-top .product-actions { position: absolute; top: 20px; right: 20px; z-index: 1; display: flex; flex-direction: column; gap: 12px; transition: all 0.2s ease; opacity: 0; visibility: hidden; transform: translate(20px, 0); } .woocommerce ul.products li.product .product-top .product-actions .add_to_cart_button, .woocommerce-page ul.products li.product .product-top .product-actions .add_to_cart_button { background-color: #fff; width: 40px; height: 40px; padding: 0; border-radius: 50%; border: 1px solid #d5d7da; display: flex; align-items: center; justify-content: center; text-indent: -9999px; margin-top: 0; position: relative; } .woocommerce ul.products li.product .product-top .product-actions .add_to_cart_button:before, .woocommerce-page ul.products li.product .product-top .product-actions .add_to_cart_button:before { content: ""; width: 16px; height: 16px; background: url('../../woocommerce/assets/icons/cart.svg') no-repeat center center; background-size: contain; background-repeat: no-repeat; background-position: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: all 0.2s ease; } .woocommerce ul.products li.product .product-top .product-actions .add_to_cart_button.loading:before, .woocommerce-page ul.products li.product .product-top .product-actions .add_to_cart_button.loading:before { display: none; } .woocommerce ul.products li.product .product-top .product-actions .add_to_cart_button.loading:after, .woocommerce-page ul.products li.product .product-top .product-actions .add_to_cart_button.loading:after { content: ''; width: 16px; height: 16px; -webkit-border-radius: 100%; -khtml-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; border-color: transparent #fff transparent #fff; border-width: 1px; border-style: solid; position: absolute; top: 12px; left: 12px; animation: pxl_spin 0.6s infinite linear; -webkit-animation: pxl_spin 0.6s infinite linear; box-sizing: border-box; z-index: 2; } .woocommerce ul.products li.product .product-top .product-actions .add_to_cart_button:hover, .woocommerce-page ul.products li.product .product-top .product-actions .add_to_cart_button:hover { background-color: var(--primary-color); border-color: var(--primary-color); } .woocommerce ul.products li.product .product-top .product-actions .add_to_cart_button:hover:before, .woocommerce-page ul.products li.product .product-top .product-actions .add_to_cart_button:hover:before { background-image: url('../../woocommerce/assets/icons/cart-white.svg'); } .woocommerce ul.products li.product .product-top .product-actions .add_to_cart_button.added, .woocommerce-page ul.products li.product .product-top .product-actions .add_to_cart_button.added { display: none; } .woocommerce ul.products li.product .product-top .product-actions .added_to_cart, .woocommerce-page ul.products li.product .product-top .product-actions .added_to_cart { text-indent: -9999px; width: 40px; height: 40px; border-radius: 50%; border: 1px solid #d5d7da; background-color: #fff; position: relative; padding: 0; margin: 0; } .woocommerce ul.products li.product .product-top .product-actions .added_to_cart:before, .woocommerce-page ul.products li.product .product-top .product-actions .added_to_cart:before { content: ""; width: 16px; height: 16px; background: url('../../woocommerce/assets/icons/added-to-cart.svg') no-repeat center center; background-size: contain; background-repeat: no-repeat; background-position: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: all 0.2s ease; } .woocommerce ul.products li.product .product-top .product-actions .added_to_cart:hover, .woocommerce-page ul.products li.product .product-top .product-actions .added_to_cart:hover { background-color: var(--primary-color); border-color: var(--primary-color); } .woocommerce ul.products li.product .product-top .product-actions .added_to_cart:hover:before, .woocommerce-page ul.products li.product .product-top .product-actions .added_to_cart:hover:before { background-image: url('../../woocommerce/assets/icons/added-to-cart-white.svg'); } .woocommerce ul.products li.product .product-top .product-actions .woosc-btn, .woocommerce-page ul.products li.product .product-top .product-actions .woosc-btn, .woocommerce ul.products li.product .product-top .product-actions .woosw-btn, .woocommerce-page ul.products li.product .product-top .product-actions .woosw-btn { z-index: 1; transition: all 0.2s ease; text-indent: -9999px; width: 40px; height: 40px; border-radius: 50%; border: 1px solid #d5d7da; background-color: #fff; padding: 0; position: relative; } .woocommerce ul.products li.product .product-top .product-actions .woosc-btn::before, .woocommerce-page ul.products li.product .product-top .product-actions .woosc-btn::before, .woocommerce ul.products li.product .product-top .product-actions .woosw-btn::before, .woocommerce-page ul.products li.product .product-top .product-actions .woosw-btn::before { content: ""; width: 16px; height: 16px; background-size: contain; background-repeat: no-repeat; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: all 0.2s ease; } .woocommerce ul.products li.product .product-top .product-actions .woosc-btn:hover, .woocommerce-page ul.products li.product .product-top .product-actions .woosc-btn:hover, .woocommerce ul.products li.product .product-top .product-actions .woosw-btn:hover, .woocommerce-page ul.products li.product .product-top .product-actions .woosw-btn:hover { background-color: var(--primary-color); border-color: var(--primary-color); } .woocommerce ul.products li.product .product-top .product-actions .woosc-btn::before, .woocommerce-page ul.products li.product .product-top .product-actions .woosc-btn::before { background-image: url('../../woocommerce/assets/icons/compare.svg'); } .woocommerce ul.products li.product .product-top .product-actions .woosc-btn:hover:before, .woocommerce-page ul.products li.product .product-top .product-actions .woosc-btn:hover:before { background-image: url('../../woocommerce/assets/icons/compare-white.svg'); } .woocommerce ul.products li.product .product-top .product-actions .woosw-btn::before, .woocommerce-page ul.products li.product .product-top .product-actions .woosw-btn::before { background-image: url('../../woocommerce/assets/icons/wishlist.svg'); } .woocommerce ul.products li.product .product-top .product-actions .woosw-btn:hover:before, .woocommerce-page ul.products li.product .product-top .product-actions .woosw-btn:hover:before { background-image: url('../../woocommerce/assets/icons/wishlist-white.svg'); } .woocommerce ul.products li.product .product-top .product-actions .woosw-btn.woosw-adding:before, .woocommerce-page ul.products li.product .product-top .product-actions .woosw-btn.woosw-adding:before { display: none; } .woocommerce ul.products li.product .product-top .product-actions .woosw-btn.woosw-adding:after, .woocommerce-page ul.products li.product .product-top .product-actions .woosw-btn.woosw-adding:after { content: ''; width: 16px; height: 16px; -webkit-border-radius: 100%; -khtml-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; border-color: transparent #fff transparent #fff; border-width: 1px; border-style: solid; position: absolute; top: 12px; left: 12px; animation: pxl_spin 0.6s infinite linear; -webkit-animation: pxl_spin 0.6s infinite linear; box-sizing: border-box; z-index: 2; } .woocommerce ul.products li.product .product-content, .woocommerce-page ul.products li.product .product-content { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; margin-top: 24px; } .woocommerce ul.products li.product .product-content .product-rating, .woocommerce-page ul.products li.product .product-content .product-rating { height: 14px; } .woocommerce ul.products li.product .product-content .product-rating .star-rating, .woocommerce-page ul.products li.product .product-content .product-rating .star-rating { height: 14px; font-size: 14px; letter-spacing: 3px; width: 86px; } .woocommerce ul.products li.product .product-content .product-rating .star-rating span, .woocommerce-page ul.products li.product .product-content .product-rating .star-rating span { color: #fdb022; padding-top: 14px; } .woocommerce ul.products li.product .product-content .product-title, .woocommerce-page ul.products li.product .product-content .product-title { font-size: 16px; font-weight: 500; line-height: 135%; letter-spacing: -0.32px; margin: 0; } .woocommerce ul.products li.product .product-content .product-price, .woocommerce-page ul.products li.product .product-content .product-price { font-size: 16px; font-family: 'Poppins', sans-serif; font-weight: 400; line-height: 150%; letter-spacing: -0.64px; color: var(--third-color); } .woocommerce ul.products li.product:hover .product-top .product-image img, .woocommerce-page ul.products li.product:hover .product-top .product-image img { transform: scale(1.1); } .woocommerce ul.products li.product:hover .product-top .product-actions, .woocommerce-page ul.products li.product:hover .product-top .product-actions { opacity: 1; visibility: visible; transform: translate(0px, 0); } .woocommerce .woocommerce-pagination, .woocommerce-page .woocommerce-pagination { margin-top: 64px; } .woocommerce .woocommerce-pagination .page-numbers, .woocommerce-page .woocommerce-pagination .page-numbers { all: unset; display: flex; align-items: center; justify-content: center; gap: 8px; } .woocommerce .woocommerce-pagination .page-numbers li, .woocommerce-page .woocommerce-pagination .page-numbers li { border: none; } .woocommerce .woocommerce-pagination .page-numbers li a, .woocommerce-page .woocommerce-pagination .page-numbers li a, .woocommerce .woocommerce-pagination .page-numbers li span, .woocommerce-page .woocommerce-pagination .page-numbers li span { font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -0.24px; width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; border: 1px solid #d5d7da; transition: all 0.2s ease; cursor: pointer; } .woocommerce .woocommerce-pagination .page-numbers li a:hover, .woocommerce-page .woocommerce-pagination .page-numbers li a:hover, .woocommerce .woocommerce-pagination .page-numbers li span.current, .woocommerce-page .woocommerce-pagination .page-numbers li span.current { background-color: var(--primary-color); color: #fff; border-color: var(--primary-color); } .woocommerce .woocommerce-pagination .page-numbers li span.current, .woocommerce-page .woocommerce-pagination .page-numbers li span.current { pointer-events: none; } .woocommerce .woocommerce-pagination .page-numbers li a.next, .woocommerce-page .woocommerce-pagination .page-numbers li a.next, .woocommerce .woocommerce-pagination .page-numbers li a.prev, .woocommerce-page .woocommerce-pagination .page-numbers li a.prev { position: relative; } .woocommerce .woocommerce-pagination .page-numbers li a.next:before, .woocommerce-page .woocommerce-pagination .page-numbers li a.next:before, .woocommerce .woocommerce-pagination .page-numbers li a.prev:before, .woocommerce-page .woocommerce-pagination .page-numbers li a.prev:before { content: ""; width: 16px; height: 16px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-size: contain; background-repeat: no-repeat; background-position: center; background: url('../../woocommerce/assets/icons/icon-arrow-right.svg') no-repeat center center; } .woocommerce .woocommerce-pagination .page-numbers li a.next:hover:before, .woocommerce-page .woocommerce-pagination .page-numbers li a.next:hover:before, .woocommerce .woocommerce-pagination .page-numbers li a.prev:hover:before, .woocommerce-page .woocommerce-pagination .page-numbers li a.prev:hover:before { background: url('../../woocommerce/assets/icons/icon-arrow-right-white.svg') no-repeat center center; } .woocommerce .woocommerce-pagination .page-numbers li a.prev:before, .woocommerce-page .woocommerce-pagination .page-numbers li a.prev:before { transform: translate(-50%, -50%) rotate(180deg); } body.woocommerce-cart .wc-backward { margin-right: 12px; opacity: 1; padding: 0 22px; height: 40px; line-height: 40px; margin: 0; text-transform: capitalize; position: relative; overflow: hidden; background-color: var(--primary-color); color: #fff; font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -0.24px; display: flex; justify-content: center; align-items: center; width: fit-content; margin: 0 auto; } body.woocommerce-cart .wc-backward:before { content: ''; position: absolute; top: 0; left: -200%; width: 200%; height: 100%; -webkit-transform: skewx(-20deg); -khtml-transform: skewx(-20deg); -moz-transform: skewx(-20deg); -ms-transform: skewx(-20deg); -o-transform: skewx(-20deg); transform: skewx(-20deg); background-image: linear-gradient(to right, transparent, rgba(255, 255, 255, .35), transparent); z-index: 1; } body.woocommerce-cart .wc-backward:hover { background-color: var(--primary-color); color: #fff; } body.woocommerce-cart .wc-backward:hover :before { -webkit-animation: pxl_btn_shine 1.4s ease; animation: pxl_btn_shine 1.4s ease; -webkit-animation-delay: 0.1s; animation-delay: 0.1s; } body.woocommerce-cart .quantity-wrap { position: relative; padding: 13px 16px; border-radius: 50px; border: 1px solid #d5d7da; background: transparent; min-width: 92px; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0; max-width: 120px; } body.woocommerce-cart .quantity-wrap .quantity { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } body.woocommerce-cart .quantity-wrap .quantity input.qty { padding: 0; margin: 0; border: none; outline: none; background: transparent; text-align: center; font-size: 16px; font-weight: 500; color: var(--primary-color); height: 22px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 20px; } body.woocommerce-cart .quantity-wrap .quantity-action { display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 1; } body.woocommerce-cart .quantity-wrap .quantity-action--down { order: 1; } body.woocommerce-cart .quantity-wrap .quantity-action--up { order: 3; } body.woocommerce-cart .pxl-entry-content .woocommerce .woocommerce-notices-wrapper { display: flex; flex-wrap: wrap; width: 100%; padding: 0 15px; } body.woocommerce-cart .pxl-entry-content .woocommerce .woocommerce-notices-wrapper .woocommerce-message, body.woocommerce-cart .pxl-entry-content .woocommerce .woocommerce-notices-wrapper .woocommerce-info, body.woocommerce-cart .pxl-entry-content .woocommerce .woocommerce-notices-wrapper .woocommerce-error { width: 100%; } body.woocommerce-cart .pxl-entry-content .woocommerce .woocommerce-notices-wrapper .woocommerce-message a.button, body.woocommerce-cart .pxl-entry-content .woocommerce .woocommerce-notices-wrapper .woocommerce-info a.button, body.woocommerce-cart .pxl-entry-content .woocommerce .woocommerce-notices-wrapper .woocommerce-error a.button { line-height: 46px; font-size: 16px; } body.woocommerce-cart .pxl-entry-content .woocommerce .woocommerce-notices-wrapper .woocommerce-info { border-top-color: var(--primary-color); } body.woocommerce-cart .pxl-entry-content .woocommerce .cart-empty.woocommerce-info { width: 100%; text-align: left; } body.woocommerce-cart .pxl-entry-content .woocommerce .cart-empty.woocommerce-info:before { display: none; } body.woocommerce-cart .pxl-entry-content .woocommerce .return-to-shop { width: 100%; text-align: center; } body.woocommerce-cart .cart-empty.woocommerce-info { padding: 112px 0 0; background-color: transparent; border: none; text-align: center !important; position: relative; } body.woocommerce-cart .cart-empty.woocommerce-info:after { content: "\f145"; font-family: "caseicon"; width: 100px; height: 100px; border-radius: 100px; line-height: 100px; font-size: 100px; left: 50%; top: 0; transform: translate(-50%, 0); color: rgba(0, 0, 0, 0.14); position: absolute; } body.woocommerce-cart .woocommerce-cart-form .shop_table { border: none; -webkit-border-radius: 0px; -khtml-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; margin-bottom: 0; } body.woocommerce-cart .woocommerce-cart-form .shop_table thead th { font-size: 20px; font-weight: 500; color: #0a1119; padding: 10px; border-top: none; border-left: none; border-right: none; border-bottom: 1px solid rgba(10, 17, 25, 0.15); } body.woocommerce-cart .woocommerce-cart-form .shop_table tbody td { text-align: left; border-left: none; border-right: none; border-top: none; border-bottom: 1px solid rgba(10, 17, 25, 0.15); } @media screen and (max-width: 768px) { body.woocommerce-cart .woocommerce-cart-form .shop_table tbody td { background-color: transparent !important; } } body.woocommerce-cart .woocommerce-cart-form .shop_table tbody td.actions { border-bottom: none; padding-left: 0; padding-right: 0; } body.woocommerce-cart .woocommerce-cart-form .shop_table .actions { padding-top: 50px; padding-bottom: 0; } body.woocommerce-cart .woocommerce-cart-form .shop_table .actions .coupon .input-text { border: 1px solid #2d2d2d; font-size: 18px; height: 40px; border-radius: 0; padding: 0 20px; min-width: 209px; color: #2d2d2d; margin-right: 12px; } body.woocommerce-cart .woocommerce-cart-form .shop_table .actions .coupon .input-text:focus { border-color: var(--primary-color); } @media screen and (max-width: 575px) { body.woocommerce-cart .woocommerce-cart-form .shop_table .actions .coupon .input-text { margin-right: 0; width: 100%; margin-bottom: 10px; } } body.woocommerce-cart .woocommerce-cart-form .shop_table .actions .button { margin-right: 12px; opacity: 1; padding: 0 22px; height: 40px; text-transform: capitalize; position: relative; overflow: hidden; background-color: var(--primary-color); color: #fff; font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -0.24px; } body.woocommerce-cart .woocommerce-cart-form .shop_table .actions .button:before { content: ''; position: absolute; top: 0; left: -200%; width: 200%; height: 100%; -webkit-transform: skewx(-20deg); -khtml-transform: skewx(-20deg); -moz-transform: skewx(-20deg); -ms-transform: skewx(-20deg); -o-transform: skewx(-20deg); transform: skewx(-20deg); background-image: linear-gradient(to right, transparent, rgba(255, 255, 255, .35), transparent); z-index: 1; } body.woocommerce-cart .woocommerce-cart-form .shop_table .actions .button:hover:before { -webkit-animation: pxl_btn_shine 1.4s ease; animation: pxl_btn_shine 1.4s ease; -webkit-animation-delay: 0.1s; animation-delay: 0.1s; } @media screen and (max-width: 1260px) { body.woocommerce-cart .woocommerce-cart-form .shop_table .actions .button { min-width: inherit; } } @media screen and (max-width: 768px) { body.woocommerce-cart .woocommerce-cart-form .shop_table .actions .button { margin-right: 0; } } @media screen and (max-width: 575px) { body.woocommerce-cart .woocommerce-cart-form .shop_table .actions .button { width: 100% !important; float: none !important; } } body.woocommerce-cart .woocommerce-cart-form .shop_table .qty { background-color: transparent !important; } body.woocommerce-cart .woocommerce-cart-form .shop_table tbody .product-name a { color: #2d2d2d; font-size: 18px; font-weight: 500; } body.woocommerce-cart .woocommerce-cart-form .shop_table tbody .product-name a:hover { color: var(--primary-color); } body.woocommerce-cart .woocommerce-cart-form .shop_table tbody .product-name dl.variation { display: none; } body.woocommerce-cart .woocommerce-cart-form .shop_table tbody .product-price, body.woocommerce-cart .woocommerce-cart-form .shop_table tbody .product-subtotal { color: #2d2d2d; font-size: 18px; font-weight: 400; } body.woocommerce-cart .woocommerce-cart-form .shop_table tbody .product-thumbnail { text-align: center !important; min-width: 120px; } body.woocommerce-cart .woocommerce-cart-form .shop_table tbody .product-thumbnail a { display: block; } body.woocommerce-cart .woocommerce-cart-form .shop_table tbody .product-thumbnail a img { width: 100%; max-width: 80px; } body.woocommerce-cart .cart-collaterals .cart_totals { margin-top: -56px; background-color: rgba(10, 17, 25, 0.04); padding: 38px 40px 40px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; border-radius: 10px; width: 100%; color: #2d2d2d; width: 100%; max-width: 490px; } @media screen and (max-width: 1200px) { body.woocommerce-cart .cart-collaterals .cart_totals { max-width: 420px; margin-top: 50px; float: none; } } @media screen and (max-width: 767px) { body.woocommerce-cart .cart-collaterals .cart_totals { max-width: 100%; padding-left: 30px; padding-right: 30px; } } body.woocommerce-cart .cart-collaterals .cart_totals>h2 { font-size: 24px; margin-bottom: 29px; font-weight: 500; text-transform: capitalize; letter-spacing: -0.24px; } body.woocommerce-cart .cart-collaterals .cart_totals td { text-align: right; } body.woocommerce-cart .cart-collaterals .cart_totals th, body.woocommerce-cart .cart-collaterals .cart_totals td { border-bottom: 1px solid rgba(0, 0, 0, 0.1); padding: 0 0 16px; font-weight: 400; } @media screen and (max-width: 768px) { body.woocommerce-cart .cart-collaterals .cart_totals th, body.woocommerce-cart .cart-collaterals .cart_totals td { background-color: transparent !important; } } body.woocommerce-cart .cart-collaterals .cart_totals .shop_table { margin-bottom: 0; } body.woocommerce-cart .cart-collaterals .cart_totals .order-total th, body.woocommerce-cart .cart-collaterals .cart_totals .order-total td { padding-top: 16px; border-bottom: none; font-weight: 500; } body.woocommerce-cart .cart-collaterals .cart_totals .shop_table { border: none; } body.woocommerce-cart .cart-collaterals .cart_totals .woocommerce-shipping-calculator p { margin-bottom: 0; } body.woocommerce-cart .cart-collaterals .cart_totals .woocommerce-shipping-calculator .shipping-calculator-button { color: var(--primary-color); } body.woocommerce-cart .cart-collaterals .cart_totals .woocommerce-shipping-calculator .shipping-calculator-button:after { content: "\f150"; margin-left: 9px; font-family: "caseicon"; position: relative; top: 1px; font-size: 10px; } body.woocommerce-cart .cart-collaterals .cart_totals .woocommerce-shipping-calculator .shipping-calculator-button:hover { color: var(--primary-color); } body.woocommerce-cart .cart-collaterals .cart_totals .woocommerce-shipping-calculator .shipping-calculator-form { padding-top: 10px; } body.woocommerce-cart .cart-collaterals .cart_totals .wc-proceed-to-checkout { padding-bottom: 0; } body.woocommerce-cart .cart-collaterals .cart_totals .wc-proceed-to-checkout .checkout-button { margin-bottom: 0; padding-top: 0; padding-bottom: 0; height: 40px; padding: 0; background-color: var(--primary-color); line-height: 40px; font-size: 16px; font-weight: 500; overflow: hidden; position: relative; } body.woocommerce-cart .cart-collaterals .cart_totals .wc-proceed-to-checkout .checkout-button:before { content: ''; position: absolute; top: 0; left: -200%; width: 200%; height: 100%; -webkit-transform: skewx(-20deg); -khtml-transform: skewx(-20deg); -moz-transform: skewx(-20deg); -ms-transform: skewx(-20deg); -o-transform: skewx(-20deg); transform: skewx(-20deg); background-image: linear-gradient(to right, transparent, rgba(255, 255, 255, .35), transparent); z-index: 1; } body.woocommerce-cart .cart-collaterals .cart_totals .wc-proceed-to-checkout .checkout-button:hover:before { -webkit-animation: pxl_btn_shine 1.4s ease; animation: pxl_btn_shine 1.4s ease; -webkit-animation-delay: 0.1s; animation-delay: 0.1s; } @media screen and (max-width: 767px) { body.woocommerce-cart .cart-collaterals .cart_totals .wc-proceed-to-checkout .checkout-button { padding-left: 28px; padding-right: 28px; } } body.woocommerce-cart .product-remove { position: relative; min-width: 50px; } body.woocommerce-cart .product-remove a.remove { font-size: 0px; width: 26px; height: 26px; background-color: var(--primary-color); border-radius: 100%; position: relative; } body.woocommerce-cart .product-remove a.remove:before, body.woocommerce-cart .product-remove a.remove:after { content: ''; position: absolute; height: 1px; width: 12px; top: 50%; left: 0; right: 0; margin: auto; background-color: #fff; transform-origin: 50% 50%; opacity: 1; -webkit-transition: transform ease 0.25s; -khtml-transition: transform ease 0.25s; -moz-transition: transform ease 0.25s; -ms-transition: transform ease 0.25s; -o-transition: transform ease 0.25s; transition: transform ease 0.25s; } body.woocommerce-cart .product-remove a.remove:before { -webkit-transform: rotate(45deg); -khtml-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } body.woocommerce-cart .product-remove a.remove:after { -webkit-transform: rotate(-45deg); -khtml-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } body.woocommerce-cart .product-remove a.remove:hover { background-color: var(--primary-color); } body.woocommerce-cart .product-remove a.remove:hover:before, body.woocommerce-cart .product-remove a.remove:hover:after { -webkit-transform: rotate(0deg); -khtml-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } @media screen and (max-width: 769px) { body.woocommerce-cart .product-remove { min-height: 57px; } } body.woocommerce-checkout { /* product wishlist page */ } body.woocommerce-checkout .woocommerce-info { border-top-color: var(--primary-color); } body.woocommerce-checkout .woocommerce-info::before { color: var(--primary-color); } body.woocommerce-checkout .woocommerce-input-wrapper input, body.woocommerce-checkout .woocommerce-input-wrapper textarea, body.woocommerce-checkout .woocommerce-input-wrapper .select2-selection { border-radius: 0 !important; } body.woocommerce-checkout a.showcoupon, body.woocommerce-checkout a.woocommerce-privacy-policy-link, body.woocommerce-checkout .woocommerce-terms-and-conditions-link { color: inherit; text-decoration: underline; } body.woocommerce-checkout a.showcoupon:hover, body.woocommerce-checkout a.woocommerce-privacy-policy-link:hover, body.woocommerce-checkout .woocommerce-terms-and-conditions-link:hover { color: #222; } body.woocommerce-checkout .woocommerce-noticegroup-checkout { width: 100%; font-size: 16px; padding: 0 15px; } body.woocommerce-checkout .woocommerce-noticegroup-checkout strong { font-weight: 500; color: #2d2d2d; } @media screen and (max-width: 767px) { body.woocommerce-checkout .woocommerce-message, body.woocommerce-checkout .woocommerce-info { padding-bottom: 24px; } } body.woocommerce-checkout form.checkout_coupon { border: 1px none; -webkit-border-radius: 0px; -khtml-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; padding: 24px 30px 30px 30px; border: 1px solid rgba(0, 0, 0, 0.06); } @media screen and (max-width: 767px) { body.woocommerce-checkout form.checkout_coupon { padding-left: 20px; padding-right: 20px; } } body.woocommerce-checkout form.checkout_coupon button { text-transform: capitalize; border-radius: 0; overflow: hidden; position: relative; background-color: var(--primary-color); height: 40px; color: #fff; } body.woocommerce-checkout form.checkout_coupon button:hover { background-color: var(--primary-color); color: #fff; } body.woocommerce-checkout form.checkout_coupon .form-row-first { width: 50%; padding-right: 20px; } @media screen and (max-width: 767px) { body.woocommerce-checkout form.checkout_coupon .form-row-first { width: 100%; padding-right: 0; margin-bottom: 10px !important; } } body.woocommerce-checkout form.checkout_coupon .form-row-last { width: 50%; } @media screen and (max-width: 767px) { body.woocommerce-checkout form.checkout_coupon .form-row-last { width: 100%; text-align: center; } } @media screen and (max-width: 575px) { body.woocommerce-checkout form.checkout_coupon .form-row-last button.button { width: 100%; } } body.woocommerce-checkout form.checkout_coupon #coupon_code { border: 1px solid #e7e7e7 !important; border-radius: 0; height: 40px; } body.woocommerce-checkout form.checkout_coupon #coupon_code:focus { border-color: var(--primary-color); } body.woocommerce-checkout form.checkout_coupon>.form-row { margin-bottom: 0; padding-bottom: 0; } body.woocommerce-checkout #add_payment_method #payment, body.woocommerce-checkout #payment { -webkit-border-radius: 0px; -khtml-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; } body.woocommerce-checkout #customer_details { width: 60%; padding: 0 35px 0 0; } @media screen and (max-width: 991px) { body.woocommerce-checkout #customer_details { padding: 0px; } } @media screen and (max-width: 767px) { body.woocommerce-checkout #customer_details { width: 100%; } } body.woocommerce-checkout #customer_details .col-1, body.woocommerce-checkout #customer_details .col-2 { width: 100%; flex: inherit; max-width: 100%; padding: 0; } @media screen and (max-width: 767px) { body.woocommerce-checkout #customer_details { margin: 0; } } body.woocommerce-checkout #customer_details span.woocommerce-input-wrapper { width: 100%; display: block; } body.woocommerce-checkout #customer_details .woocommerce-billing-fields { margin-bottom: 36px; } body.woocommerce-checkout #customer_details .woocommerce-billing-fields>h3, body.woocommerce-checkout #customer_details .woocommerce-billing-fields>.pxl-counter--style-default .pxl-counter__number, .pxl-counter--style-default body.woocommerce-checkout #customer_details .woocommerce-billing-fields>.pxl-counter__number { font-size: 32px; margin-bottom: 24px; font-weight: 500; text-transform: capitalize; letter-spacing: -1.28px; } @media screen and (max-width: 1200px) { body.woocommerce-checkout #customer_details .woocommerce-billing-fields>h3, body.woocommerce-checkout #customer_details .woocommerce-billing-fields>.pxl-counter--style-default .pxl-counter__number, .pxl-counter--style-default body.woocommerce-checkout #customer_details .woocommerce-billing-fields>.pxl-counter__number { font-size: 28px; letter-spacing: -1.12px; } } @media screen and (max-width: 575px) { body.woocommerce-checkout #customer_details .woocommerce-billing-fields>h3, body.woocommerce-checkout #customer_details .woocommerce-billing-fields>.pxl-counter--style-default .pxl-counter__number, .pxl-counter--style-default body.woocommerce-checkout #customer_details .woocommerce-billing-fields>.pxl-counter__number { font-size: 24px; letter-spacing: -0.96px; } } @media screen and (max-width: 767px) { body.woocommerce-checkout #customer_details .woocommerce-additional-fields { margin-bottom: 40px; } } body.woocommerce-checkout #customer_details .woocommerce-additional-fields>h3, body.woocommerce-checkout #customer_details .woocommerce-additional-fields>.pxl-counter--style-default .pxl-counter__number, .pxl-counter--style-default body.woocommerce-checkout #customer_details .woocommerce-additional-fields>.pxl-counter__number { font-size: 32px; margin-bottom: 24px; font-weight: 500; text-transform: capitalize; letter-spacing: -1.28px; } @media screen and (max-width: 1200px) { body.woocommerce-checkout #customer_details .woocommerce-additional-fields>h3, body.woocommerce-checkout #customer_details .woocommerce-additional-fields>.pxl-counter--style-default .pxl-counter__number, .pxl-counter--style-default body.woocommerce-checkout #customer_details .woocommerce-additional-fields>.pxl-counter__number { font-size: 28px; letter-spacing: -1.12px; } } @media screen and (max-width: 575px) { body.woocommerce-checkout #customer_details .woocommerce-additional-fields>h3, body.woocommerce-checkout #customer_details .woocommerce-additional-fields>.pxl-counter--style-default .pxl-counter__number, .pxl-counter--style-default body.woocommerce-checkout #customer_details .woocommerce-additional-fields>.pxl-counter__number { font-size: 24px; letter-spacing: -0.96px; } } body.woocommerce-checkout #customer_details .woocommerce-additional-fields #order_comments { height: 150px; } body.woocommerce-checkout #customer_details .woocommerce-additional-fields #order_comments_field { margin-bottom: 0; } body.woocommerce-checkout #customer_details .woocommerce-shipping-fields #ship-to-different-address { font-size: 24px; cursor: pointer; -webkit-transition: all 0.3s linear; -khtml-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -ms-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } body.woocommerce-checkout #customer_details .woocommerce-shipping-fields #ship-to-different-address:hover { color: var(--primary-color); } body.woocommerce-checkout #customer_details .woocommerce-shipping-fields #ship-to-different-address #ship-to-different-address-checkbox { position: absolute; opacity: 0; } body.woocommerce-checkout #customer_details .woocommerce-shipping-fields #ship-to-different-address .woocommerce-form__label span:after { content: "\f01a"; font-family: fontawesome; margin-left: 14px; font-weight: normal; } body.woocommerce-checkout #customer_details #billing_country_field label, body.woocommerce-checkout #customer_details #shipping_country_field label, body.woocommerce-checkout #customer_details #billing_address_1_field label, body.woocommerce-checkout #customer_details #shipping_address_1_field label, body.woocommerce-checkout #customer_details #order_comments_field label { display: none !important; } body.woocommerce-checkout #customer_details #billing_country_field textarea, body.woocommerce-checkout #customer_details #shipping_country_field textarea, body.woocommerce-checkout #customer_details #billing_address_1_field textarea, body.woocommerce-checkout #customer_details #shipping_address_1_field textarea, body.woocommerce-checkout #customer_details #order_comments_field textarea { padding: 12px 20px; } body.woocommerce-checkout form.woocommerce-checkout { display: flex; flex-wrap: wrap; } body.woocommerce-checkout form.woocommerce-checkout .woocommerce-NoticeGroup-checkout { width: 100%; } @media screen and (max-width: 991px) { body.woocommerce-checkout form.woocommerce-checkout { flex-direction: column; } } body.woocommerce-checkout form.woocommerce-checkout input, body.woocommerce-checkout form.woocommerce-checkout textarea { font-size: 16px; color: rgba(0, 0, 0, 0.5); border: 1px solid #d5d7da; } body.woocommerce-checkout form.woocommerce-checkout input:focus, body.woocommerce-checkout form.woocommerce-checkout textarea:focus, body.woocommerce-checkout form.woocommerce-checkout input:active, body.woocommerce-checkout form.woocommerce-checkout textarea:active { border-color: var(--primary-color); } body.woocommerce-checkout form.woocommerce-checkout .select2-selection__rendered { font-size: 16px; color: rgba(0, 0, 0, 0.5); padding: 13px 16px; color: #454545; } body.woocommerce-checkout form.woocommerce-checkout .select2-selection__rendered:focus, body.woocommerce-checkout form.woocommerce-checkout .select2-selection__rendered:active { border-color: var(--primary-color); } body.woocommerce-checkout form.woocommerce-checkout .select2-selection--single { border-radius: 12px !important; border-color: #d5d7da !important; } body.woocommerce-checkout form.woocommerce-checkout .form-row .input-text { padding: 13px 16px; background-color: #fff; border: 1px solid #d5d7da; color: #454545; border-radius: 12px !important; } body.woocommerce-checkout form.woocommerce-checkout label { font-size: 16px; color: #000; text-transform: capitalize; margin-bottom: 8px; } body.woocommerce-checkout form.woocommerce-checkout .form-row-first { padding-right: 10px; } @media screen and (max-width: 767px) { body.woocommerce-checkout form.woocommerce-checkout .form-row-first { padding-right: 0; } } body.woocommerce-checkout form.woocommerce-checkout .form-row-last { padding-left: 10px; } @media screen and (max-width: 767px) { body.woocommerce-checkout form.woocommerce-checkout .form-row-last { width: 100%; padding-left: 0; } } body.woocommerce-checkout form.woocommerce-checkout .form-row-last, body.woocommerce-checkout form.woocommerce-checkout .form-row-first { width: 50%; } @media screen and (max-width: 767px) { body.woocommerce-checkout form.woocommerce-checkout .form-row-last, body.woocommerce-checkout form.woocommerce-checkout .form-row-first { width: 100%; } } body.woocommerce-checkout form.woocommerce-checkout #order_review_heading { font-size: 32px; font-weight: 500; margin-bottom: 28px; text-transform: capitalize; letter-spacing: -1.28px; } @media screen and (max-width: 1200px) { body.woocommerce-checkout form.woocommerce-checkout #order_review_heading { font-size: 28px; letter-spacing: -1.12px; } } @media screen and (max-width: 575px) { body.woocommerce-checkout form.woocommerce-checkout #order_review_heading { font-size: 24px; letter-spacing: -0.96px; } } body.woocommerce-checkout form.woocommerce-checkout #order_review { background-color: rgba(0, 0, 0, 0.05); padding: 34px 40px 40px 40px; border-radius: 10px; width: 40%; } @media screen and (max-width: 991px) { body.woocommerce-checkout form.woocommerce-checkout #order_review { padding-left: 20px; padding-right: 20px; width: 100%; } } body.woocommerce-checkout form.woocommerce-checkout #order_review th { font-weight: 600; vertical-align: middle !important; } body.woocommerce-checkout form.woocommerce-checkout #order_review th+td { border-left: 1px solid #ebebeb; } body.woocommerce-checkout form.woocommerce-checkout #order_review .product-total { border-left: 1px solid #ebebeb; } body.woocommerce-checkout form.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table { border: none; margin: 0; font-size: 16px; color: #2d2d2d; background-color: transparent; } body.woocommerce-checkout form.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table thead { font-size: 18px; font-weight: 500; color: #0a1119; } body.woocommerce-checkout form.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table th, body.woocommerce-checkout form.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table td { border: none; padding: 16px 0; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } body.woocommerce-checkout form.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table .cart-subtotal td { text-align: right; } body.woocommerce-checkout form.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table .order-total td, body.woocommerce-checkout form.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table .order-total th { border-bottom: none; } body.woocommerce-checkout form.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table .order-total td { text-align: right; } body.woocommerce-checkout form.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table .product-total { text-align: right; text-transform: capitalize; } body.woocommerce-checkout form.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table .product-name { text-transform: capitalize; padding-right: 20px; } body.woocommerce-checkout form.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table .product-name strong { font-weight: 400; } body.woocommerce-checkout form.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table .product-name .variation { display: flex; align-items: center; margin-left: 0; } body.woocommerce-checkout form.woocommerce-checkout #order_review .woocommerce-checkout-review-order-table .product-name .variation dt { text-transform: unset; } body.woocommerce-checkout form.woocommerce-checkout #order_review #payment { margin-top: 5px; padding: 0; background-color: transparent; border: none; } body.woocommerce-checkout form.woocommerce-checkout #order_review #payment label { font-size: 16px; color: #2d2d2d; } body.woocommerce-checkout form.woocommerce-checkout #order_review #payment .wc_payment_methods { padding: 0; border-bottom: none; margin-bottom: 0; } body.woocommerce-checkout form.woocommerce-checkout #order_review #payment .wc_payment_methods div.payment_box { font-size: 14px; line-height: 24px; color: rgba(45, 45, 45, 0.7); background-color: #fff; margin-bottom: 23px; } body.woocommerce-checkout form.woocommerce-checkout #order_review #payment .wc_payment_methods div.payment_box:before { border-bottom-color: #fff; } body.woocommerce-checkout form.woocommerce-checkout #order_review #payment .wc_payment_methods .wc_payment_method { padding-top: 4px; } body.woocommerce-checkout form.woocommerce-checkout #order_review #payment .wc_payment_methods .wc_payment_method label { cursor: pointer; position: relative; } body.woocommerce-checkout form.woocommerce-checkout #order_review #payment .wc_payment_methods .wc_payment_method label:before { content: ''; width: 16px; height: 16px; border: 2px solid rgba(10, 17, 25, 0.3); border-radius: 16px; position: absolute; top: 2px; left: -35px; -webkit-transition: all 300ms linear 0ms; -khtml-transition: all 300ms linear 0ms; -moz-transition: all 300ms linear 0ms; -ms-transition: all 300ms linear 0ms; -o-transition: all 300ms linear 0ms; transition: all 300ms linear 0ms; } body.woocommerce-checkout form.woocommerce-checkout #order_review #payment .wc_payment_methods .wc_payment_method label:after { content: ''; width: 6px; height: 6px; border-radius: 6px; position: absolute; left: -30px; top: 7px; background-color: var(--primary-color); -webkit-transition: all 300ms linear 0ms; -khtml-transition: all 300ms linear 0ms; -moz-transition: all 300ms linear 0ms; -ms-transition: all 300ms linear 0ms; -o-transition: all 300ms linear 0ms; transition: all 300ms linear 0ms; opacity: 0; } body.woocommerce-checkout form.woocommerce-checkout #order_review #payment .wc_payment_methods .wc_payment_method input { opacity: 0; } body.woocommerce-checkout form.woocommerce-checkout #order_review #payment .wc_payment_methods .wc_payment_method input[type="radio"]:checked+label:before { border-color: var(--primary-color); } body.woocommerce-checkout form.woocommerce-checkout #order_review #payment .wc_payment_methods .wc_payment_method input[type="radio"]:checked+label:after { opacity: 1; } body.woocommerce-checkout form.woocommerce-checkout #order_review #payment .form-row.place-order { margin: 0; padding: 0; display: flex; flex-wrap: wrap; } body.woocommerce-checkout form.woocommerce-checkout #order_review #payment .form-row.place-order button { border-radius: 0; text-transform: capitalize; } body.woocommerce-checkout form.woocommerce-checkout #order_review #payment #place_order.button { float: none; background-color: var(--primary-color); color: #fff; border-radius: 4px; } body.woocommerce-checkout form.woocommerce-checkout #order_review #payment #place_order.button:hover { background-color: var(--primary-color); color: #fff; } body.woocommerce-checkout form.woocommerce-checkout #order_review #payment .woocommerce-terms-and-conditions-wrapper { margin-top: 22px; font-size: 16px; margin-bottom: 30px; } body.woocommerce-checkout form.woocommerce-checkout #order_review #payment .woocommerce-terms-and-conditions-wrapper .wp-block-heading { font-size: 24px; } body .woosw-popup-content-mid .woosw-item--add a { font-size: 14px !important; text-transform: capitalize !important; background-color: var(--primary-color) !important; color: #fff !important; line-height: 40px !important; padding: 0 15px !important; } body .woosw-popup-content-mid .woosw-item--add a:before { display: none !important; } body .woosw-popup-content-mid .woosw-item--add a.added { display: none !important; } body .woosw-popup-content-mid .woosw-item--add a:after { display: none !important; } body .woosw-popup-content-mid .woosw-item--add a:hover { background-color: var(--secondary-color) !important; color: #fff !important; } body .woosw-popup-content-mid .added_to_cart { margin-left: 10px; background-color: var(--primary-color); line-height: 40px !important; height: 40px !important; font-size: 14px !important; text-transform: capitalize !important; color: #fff !important; line-height: 40px !important; padding: 0 15px !important; font-weight: 400 !important; } .woosw-popup-content-bot-inner a:hover { border-color: #fff !important; color: #fff !important; } .woosw-list { max-width: 860px; margin: auto; /* product quick view popup */ } .woosw-list .woosw-actions { display: none; } .woosw-list .woosw-popup-content-mid-massage { padding: 112px 0 0; background-color: transparent; border: none; text-align: center !important; } .woosw-list .woosw-popup-content-mid-massage:before { content: "\f145"; font-family: "caseicon"; width: 100px; height: 100px; border-radius: 100px; line-height: 100px; font-size: 100px; left: 50%; top: 0; transform: translate(-50%, 0); color: rgba(0, 0, 0, 0.14); position: absolute; } .woosw-list table.woosw-items { border-left: none; } .woosw-list table.woosw-items td { border-right: none; background-color: transparent !important; } .woosw-list table.woosw-items .woosw-item .woosw-item--name a { font-weight: 600; color: #000; } .woosw-list table.woosw-items .woosw-item .woosw-item--price { font-size: 15px; color: var(--primary-color); } .woosw-list table.woosw-items .woosw-item .woosw-item--price ins { background-color: transparent; color: inherit; } .woosw-list table.woosw-items .woosw-item .woosw-item--price del { color: #888; } .woosw-list table.woosw-items .woosw-item .woosw-item--time { font-size: 15px; } .woosw-list table.woosw-items .woosw-item .woosw-item--actions { text-align: right; } .woosw-list table.woosw-items .woosw-item .woosw-item--actions .add_to_cart_inline { display: flex; align-items: center; justify-content: end; } .woosw-list table.woosw-items .woosw-item .woosw-item--actions a.button, .woosw-list table.woosw-items .woosw-item .woosw-item--actions .added_to_cart.wc-forward { min-width: 150px; background-color: var(--primary-color); font-weight: 400; text-align: center; line-height: 50px; height: 50px; padding: 0 22px; font-size: 16px; color: #fff; } .woosw-list table.woosw-items .woosw-item .woosw-item--actions a.button.added, .woosw-list table.woosw-items .woosw-item .woosw-item--actions .added_to_cart.wc-forward.added { margin: 0 10px; } .woosw-list table.woosw-items .woosw-item .woosw-item--actions a.button.added:after, .woosw-list table.woosw-items .woosw-item .woosw-item--actions .added_to_cart.wc-forward.added:after { display: none; } .woosw-list table.woosw-items .woosw-item .woosw-item--actions a.button:after, .woosw-list table.woosw-items .woosw-item .woosw-item--actions .added_to_cart.wc-forward:after { display: none !important; } .woosq-popup .woocommerce-product-details__short-description { margin-bottom: 22px; } .woosq-popup div.product .entry-summary .entry-title { font-size: 32px; } .woosq-popup div.product .entry-summary .product_type_external { width: 100%; line-height: 50px; text-align: center; } .woosq-popup div.product .entry-summary .add_to_cart_button { width: 100%; text-align: center; } .woosq-popup div.product .entry-summary .add_to_cart_button.ajax_add_to_cart { line-height: 50px; text-align: center; } .woosq-popup div.product .entry-summary .add_to_cart_button.ajax_add_to_cart.loading { opacity: 1; } .woosq-popup div.product .entry-summary .add_to_cart_button.ajax_add_to_cart.loading:before { content: ''; width: 20px; height: 20px; -webkit-border-radius: 100%; -khtml-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; border-color: transparent #fff transparent #fff; border-width: 1px; border-style: solid; position: absolute; top: 0; right: 20px; bottom: 0; margin: auto; animation: pxl_spin 0.6s infinite linear; -webkit-animation: pxl_spin 0.6s infinite linear; box-sizing: border-box; z-index: 2; } .woosq-popup div.product .entry-summary .add_to_cart_button.ajax_add_to_cart.loading:after { display: none; } .pxl-filter { position: relative; z-index: 100; } .pxl-filter__header { display: flex; justify-content: space-between; align-items: center; z-index: 2; position: relative; } .pxl-filter__header .pxl-filter__toggle { all: unset; display: flex; gap: 6px; align-items: start; font-weight: 500; color: var(--primary-color); cursor: pointer; } .pxl-filter__header .pxl-filter__toggle svg { margin-top: 1px; } .pxl-filter__header .woocommerce-ordering { z-index: 1; position: relative; margin-bottom: 24px; } .pxl-filter__header .woocommerce-ordering select.orderby { display: none; } .pxl-filter__header .woocommerce-ordering .nice-select { width: 100%; height: 34px; } .pxl-filter__header .woocommerce-ordering .nice-select .list { top: calc(100% - 36px); border-radius: 8px; } .pxl-filter .pxl-filter__form { background-color: #fff; padding: 24px; border-radius: 12px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1); position: absolute; top: 100%; left: 0; width: 100%; z-index: 1; opacity: 0; visibility: hidden; transition: all 0.2s ease; transform: translateY(20px); } .pxl-filter .pxl-filter__form.active { transform: translateY(0); opacity: 1; visibility: visible; } .pxl-filter .pxl-filter__form .pxl-filter__content { display: flex; justify-content: space-between; align-items: start; } .pxl-filter .pxl-filter__form .pxl-filter__content .pxl-checkbox-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 12px; } .pxl-filter .pxl-filter__form .pxl-filter__content .pxl-checkbox-list li label { display: flex; gap: 4px; align-items: center; color: var(--primary-color); cursor: pointer; } .pxl-filter .pxl-filter__form .pxl-filter__content .pxl-checkbox-list li label input[type="checkbox"] { display: none; } .pxl-filter .pxl-filter__form .pxl-filter__content .pxl-checkbox-list li label input[type="checkbox"]:checked+.checkbox-custom { position: relative; } .pxl-filter .pxl-filter__form .pxl-filter__content .pxl-checkbox-list li label input[type="checkbox"]:checked+.checkbox-custom::before { content: ""; position: absolute; top: 50%; left: 50%; width: 60%; height: 60%; background-color: var(--primary-color); transform: translate(-50%, -50%); } .pxl-filter .pxl-filter__form .pxl-filter__content .pxl-checkbox-list li label .checkbox-custom { width: 16px; height: 16px; min-width: 16px; display: block; border: 1px solid #d5d7da; margin-right: 4px; } .pxl-filter .pxl-filter__form .pxl-filter__block.pxl-filter__attributes { display: grid; grid-template-columns: repeat(2, 1fr); gap: 30px 50px; } .pxl-filter .pxl-filter__form .pxl-filter__block.pxl-filter__attributes h6, .pxl-filter .pxl-filter__form .pxl-filter__block.pxl-filter__attributes .pxl-swiper-pagination .pxl-swiper-current-slide, .pxl-swiper-pagination .pxl-filter .pxl-filter__form .pxl-filter__block.pxl-filter__attributes .pxl-swiper-current-slide, .pxl-filter .pxl-filter__form .pxl-filter__block.pxl-filter__attributes .pxl-swiper-pagination .pxl-swiper-total-slides, .pxl-swiper-pagination .pxl-filter .pxl-filter__form .pxl-filter__block.pxl-filter__attributes .pxl-swiper-total-slides, .pxl-filter .pxl-filter__form .pxl-filter__block.pxl-filter__attributes .pxl-swiper-fraction-first, .pxl-filter .pxl-filter__form .pxl-filter__block.pxl-filter__attributes .pxl-swiper-fraction-last { grid-column: span 2; margin-bottom: -18px; } .pxl-filter .pxl-filter__form .pxl-filter__block.pxl-filter__attributes .pxl-filter__item strong { font-size: 18px; font-weight: 500; line-height: 1.35; letter-spacing: -0.28px; color: var(--primary-color); } .pxl-filter .pxl-filter__form .pxl-filter__block.pxl-filter__attributes .pxl-filter__item .pxl-attribute-list { margin-top: 12px; } .pxl-filter .pxl-filter__form .pxl-filter__price .pxl-price-inputs { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; margin-bottom: 16px; } .pxl-filter .pxl-filter__form .pxl-filter__price .pxl-price-inputs .pxl-price-input { display: flex; flex-direction: column; } .pxl-filter .pxl-filter__form .pxl-filter__price .pxl-price-inputs .pxl-price-input label { font-size: 18px; color: var(--primary-color); margin-bottom: 4px; } .pxl-filter .pxl-filter__form .pxl-filter__price .pxl-price-inputs .pxl-price-input input[type="number"] { padding: 6px 10px; border: 1px solid #d5d7da; border-radius: 6px; font-size: 16px; transition: border-color 0.3s; color: var(--primary-color); text-align: center; } .pxl-filter .pxl-filter__form .pxl-filter__price .pxl-price-inputs .pxl-price-input input[type="number"]:focus { border-color: var(--primary-color); outline: none; } .pxl-filter .pxl-filter__form .pxl-filter__price .pxl-price-inputs .separator { font-size: 18px; color: var(--primary-color); padding: 0 4px; margin-top: 24px; } .pxl-filter .pxl-filter__form .pxl-filter__price .pxl-price-range { display: flex; justify-content: space-between; font-size: 14px; color: #555; } .pxl-filter .pxl-filter__form .pxl-filter__price .pxl-price-range .woocommerce-Price-amount bdi { font-weight: 500; } .pxl-filter .pxl-filter__form .pxl-filter__price .pxl-price-range .woocommerce-Price-amount bdi .woocommerce-Price-currencySymbol { color: #999; font-weight: normal; } .select2-container.select2-container--open .select2-dropdown--below { border-color: #d5d7da; } body.woocommerce-checkout form.woocommerce-checkout .select2-container--open .select2-selection--single { border-radius: 12px 12px 0 0 !important; } .woocommerce-account .woocommerce .woocommerce-MyAccount-navigation ul { list-style: none; padding: 0; margin: 0; } @media screen and (max-width: 767px) { .woocommerce-account .woocommerce .woocommerce-MyAccount-navigation ul { display: flex; flex-direction: row; flex-flow: row wrap; gap: 8px; } } .woocommerce-account .woocommerce .woocommerce-MyAccount-navigation ul li a { font-size: 16px; display: block; width: 100%; padding: 12px 20px; border: 1px solid #d5d7da; border-radius: 8px; margin-bottom: 12px; text-align: center; } .woocommerce-account .woocommerce .woocommerce-MyAccount-navigation ul li a:hover { background-color: var(--primary-color); color: #fff; } .woocommerce-account .woocommerce .col2-set .col-1, .woocommerce-account .woocommerce .woocommerce-page .col2-set .col-1 { max-width: 48%; } .woocommerce-account .woocommerce .col2-set .col-1 address, .woocommerce-account .woocommerce .woocommerce-page .col2-set .col-1 address { margin-top: 15px; } .woocommerce-account .woocommerce .col2-set .col-2, .woocommerce-account .woocommerce .woocommerce-page .col2-set .col-2 { max-width: 48%; } .woocommerce-account .woocommerce .col2-set .col-2 address, .woocommerce-account .woocommerce .woocommerce-page .col2-set .col-2 address { margin-top: 15px; } .woocommerce-account .woocommerce h2 { font-size: 24px; letter-spacing: -0.96px; } .woocommerce-account .woocommerce h3, .woocommerce-account .woocommerce .pxl-counter--style-default .pxl-counter__number, .pxl-counter--style-default .woocommerce-account .woocommerce .pxl-counter__number { font-size: 22px; letter-spacing: -0.88px; } .woocommerce-account .woocommerce h4 { font-size: 20px; letter-spacing: -0.8px; } .woocommerce-account .woocommerce h5 { font-size: 18px; letter-spacing: -0.72px; } .woocommerce-account .woocommerce h6, .woocommerce-account .woocommerce .pxl-swiper-pagination .pxl-swiper-current-slide, .pxl-swiper-pagination .woocommerce-account .woocommerce .pxl-swiper-current-slide, .woocommerce-account .woocommerce .pxl-swiper-pagination .pxl-swiper-total-slides, .pxl-swiper-pagination .woocommerce-account .woocommerce .pxl-swiper-total-slides, .woocommerce-account .woocommerce .pxl-swiper-fraction-first, .woocommerce-account .woocommerce .pxl-swiper-fraction-last { font-size: 16px; letter-spacing: -0.64px; } .woocommerce-account .woocommerce .woocommerce-Address { padding-top: 15px; padding-bottom: 15px; border-top: 1px solid #d5d7da; border-bottom: 1px solid #d5d7da; margin-top: 15px; margin-bottom: 15px; } .woocommerce-account .woocommerce .woocommerce-MyAccount-content .clear+p { margin-top: 15px; } @media screen and (max-width: 767px) { .woocommerce-account .woocommerce h2 { font-size: 22px; letter-spacing: -0.88px; } .woocommerce-account .woocommerce h3, .woocommerce-account .woocommerce .pxl-counter--style-default .pxl-counter__number, .pxl-counter--style-default .woocommerce-account .woocommerce .pxl-counter__number { font-size: 20px; letter-spacing: -0.8px; } .woocommerce-account .woocommerce h4 { font-size: 18px; letter-spacing: -0.72px; } .woocommerce-account .woocommerce h5 { font-size: 16px; letter-spacing: -0.64px; } .woocommerce-account .woocommerce h6, .woocommerce-account .woocommerce .pxl-swiper-pagination .pxl-swiper-current-slide, .pxl-swiper-pagination .woocommerce-account .woocommerce .pxl-swiper-current-slide, .woocommerce-account .woocommerce .pxl-swiper-pagination .pxl-swiper-total-slides, .pxl-swiper-pagination .woocommerce-account .woocommerce .pxl-swiper-total-slides, .woocommerce-account .woocommerce .pxl-swiper-fraction-first, .woocommerce-account .woocommerce .pxl-swiper-fraction-last { font-size: 14px; letter-spacing: -0.56px; } .woocommerce-account .woocommerce .col2-set .col-1, .woocommerce-account .woocommerce .woocommerce-page .col2-set .col-1 { max-width: 100%; padding-left: 0; padding-right: 0; } .woocommerce-account .woocommerce .col2-set .col-2, .woocommerce-account .woocommerce .woocommerce-page .col2-set .col-2 { max-width: 100%; padding-left: 0; padding-right: 0; } .woocommerce-account .woocommerce .woocommerce-Address:last-child { margin-top: 0; padding-top: 0; border-top: none; } } #pxl-ptit__default { position: relative; padding: 265px 15px 120px; text-align: center; } @media screen and (max-width: 767px) { #pxl-ptit__default { padding: 120px 15px 60px; } } #pxl-ptit__default .container { position: relative; z-index: 1; } @media screen and (max-width: 1400px) { #pxl-ptit__default .container { padding: 0; } } #pxl-ptit__default .pxl-ptit__slg { padding: 4px 16px 4px 4px; border: 1px solid #d5d7da; -webkit-border-radius: 50px; -khtml-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; border-radius: 50px; display: flex; gap: 8px; font-size: 14px; font-weight: 500; line-height: 1.3; letter-spacing: -0.28px; align-items: center; width: fit-content; margin: -88px auto 48px; } @media screen and (max-width: 767px) { #pxl-ptit__default .pxl-ptit__slg { margin: 0px auto 20px; } } #pxl-ptit__default .pxl-ptit__slg-bef { padding: 7px 16px; -webkit-border-radius: 50px; -khtml-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; border-radius: 50px; background-color: var(--primary-color); color: #fff; } @media screen and (max-width: 575px) { #pxl-ptit__default .pxl-ptit__slg-bef { font-size: 12px; } } #pxl-ptit__default .pxl-ptit__slg-aft { color: var(--primary-color); display: flex; align-items: center; gap: 6px; } @media screen and (max-width: 575px) { #pxl-ptit__default .pxl-ptit__slg-aft { font-size: 12px; } } #pxl-ptit__default+#pxl-main { padding-top: 0; } #pxl-ptit__default::before { content: ""; position: absolute; top: 0; left: 0; height: 315px; background: url('../img/shape-top.svg') no-repeat center / cover; width: 100%; } #pxl-ptit__default.single-post__has-sidebar { padding-bottom: 0; margin-bottom: -88px; } #pxl-ptit__default.no-sidebar::after { content: ""; position: absolute; bottom: 0; left: 0; height: 315px; background: url('../img/shape-bottom.svg') no-repeat center / cover; width: 100%; } #pxl-ptit__default .pxl-ptit__text { font-size: 48px; font-weight: 500; line-height: 1.2; letter-spacing: -2.4px; max-width: 732px; margin: 0 auto; } @media screen and (max-width: 767px) { #pxl-ptit__default .pxl-ptit__text { font-size: 36px; letter-spacing: -1.68px; } } @media screen and (max-width: 575px) { #pxl-ptit__default .pxl-ptit__text { font-size: 28px; letter-spacing: -1.28px; margin-bottom: 20px; } } #pxl-ptit__default .pxl-ptit__desc { font-size: 18px; font-weight: 400; line-height: 1.35; letter-spacing: -0.36px; color: var(--third-color); margin: 40px 0 64px; } @media screen and (max-width: 575px) { #pxl-ptit__default .pxl-ptit__desc { font-size: 14px; letter-spacing: -0.24px; margin: 16px 0 40px; } } #pxl-ptit__default .pxl-post__image { margin-top: 48px; } #pxl-ptit__default.no-sidebar { padding-bottom: 120px; } #pxl-ptit__default.no-sidebar::after { content: ""; position: absolute; bottom: 0; left: 0; height: 315px; background: url('../img/shape-bottom.svg') no-repeat center / cover; width: 100%; } .pxl-post__author { margin: -86px auto 38px; position: relative; padding-left: 64px; width: fit-content; min-height: 48px; display: flex; flex-direction: column; justify-content: center; align-items: start; gap: 4px; } .pxl-post__author-avatar { position: absolute; top: 0; left: 0; } .pxl-post__author-avatar img { border-radius: 50%; } .pxl-post__author-time { font-size: 14px; font-weight: 400; line-height: 1.3; color: var(--third-color); } .pxl-post__author-name { color: var(--primary-color); font-weight: 500; } .pxl-pmeta { display: flex; gap: 8px; justify-content: center; align-items: center; margin-top: 40px; flex-wrap: wrap; } .pxl-pmeta__item { padding: 7px 16px; -webkit-border-radius: 8px; -khtml-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; border-radius: 8px; font-size: 14px; font-style: normal; font-weight: 500; line-height: 1.3; letter-spacing: -0.28px; } .pxl-pmeta__cat { background-color: #ebe9fe; display: flex; gap: 8px; flex-wrap: wrap; } .pxl-pmeta__cat a { color: #3e1c96; display: flex; gap: 5px; align-items: center; } .pxl-pmeta__cat a:hover { color: var(--primary-color); } .pxl-pmeta__cat img { width: 14px; transform: translateY(-1px); } .pxl-pmeta__date { background-color: #e0f2fe; color: #0b4a6f; display: flex; gap: 4px; align-items: center; } .pxl-pmeta__date img { width: 14px; transform: translateY(-1px); } .pxl-pmeta__author { background-color: #eaecf5; color: var(--primary-color); display: flex; gap: 4px; align-items: center; } .pxl-pmeta__author img { width: 14px; transform: translateY(-1px); } @media screen and (max-width: 575px) { .pxl-pmeta { margin: 0 0 12px; } .pxl-pmeta .pxl-pmeta__item { padding: 5px 10px; } .pxl-pmeta img { width: 12px; } .pxl-pmeta .category-name, .pxl-pmeta .pxl-pmeta__date, .pxl-pmeta .pxl-pmeta__author { font-size: 12px; } } .single-post__has-sidebar+#pxl-main { padding: 0 15px; } .pxl-post { position: relative; } .pxl-post__image img { position: relative; border-radius: 12px; z-index: 1; background: lightgray; } .pxl-post__footer { position: relative; padding-top: 25px; margin: 64px 0 120px; } @media screen and (max-width: 575px) { .pxl-post__footer { margin-bottom: 60px; } } .pxl-post__footer .pxl-navigation { min-height: 40px; width: 100%; } .pxl-post__footer::before { content: ""; width: 100%; height: 1px; position: absolute; top: 0; left: 0; background: linear-gradient(90deg, rgba(102, 102, 102, 0.00) 0%, rgba(102, 102, 102, 0.13) 25%, rgba(102, 102, 102, 0.16) 50%, rgba(102, 102, 102, 0.13) 75%, rgba(102, 102, 102, 0.00) 100%); } .pxl-posts { display: grid; gap: 40px; padding-bottom: 104px; position: relative; } .pxl-posts.no-posts { display: none; } @media screen and (max-width: 575px) { .pxl-posts { gap: 24px; padding-bottom: 80px; } } .pxl-posts__title { font-size: 32px; font-weight: 500; line-height: 1.2; letter-spacing: -1.28px; color: var(--primary-color); display: flex; gap: 8px; grid-column: span 3; justify-content: center; } @media screen and (max-width: 767px) { .pxl-posts__title { font-size: 28px; } } @media screen and (max-width: 575px) { .pxl-posts__title { font-size: 20px; } } .pxl-posts__title img { height: 32px; } .pxl-posts__pagination { position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); display: flex; gap: 15px; } .pxl-posts__pagination .page-numbers { width: 40px; height: 40px; border-radius: 40px; display: flex; justify-content: center; align-items: center; border: 1px solid #d5d7da; cursor: pointer; position: relative; transition: all 0.3s ease; background-color: #fff; } .pxl-posts__pagination .page-numbers.current { pointer-events: none; background-color: var(--primary-color); border-color: var(--primary-color); color: #fff; } .pxl-posts__pagination .page-numbers a { color: var(--primary-color); } .pxl-posts__pagination .page-numbers svg path { stroke: var(--primary-color); } .pxl-posts__pagination .page-numbers::before { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% - 5px); height: calc(100% - 5px); background: linear-gradient(299deg, rgba(173, 157, 255, 0) 0%, rgba(158, 229, 255, 0) 49.19%, rgba(220, 160, 255, 0) 98.39%); filter: blur(5px); -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; z-index: -1; transition: all 0.3s ease; } .pxl-posts__pagination .page-numbers:hover { border-color: var(--secondary-color); } .pxl-posts__pagination .page-numbers:hover a { color: var(--primary-color); } .pxl-posts__pagination .page-numbers:hover svg path { stroke: var(--secondary-color); } .pxl-posts__pagination .page-numbers:hover::before { background: linear-gradient(299deg, rgba(173, 157, 255, 0.88) 0%, rgba(158, 229, 255, 0.88) 49.19%, rgba(220, 160, 255, 0.88) 98.39%); } .pxl-posts__loadmore { position: absolute; bottom: 0; left: 50%; transform: translate(-50%); display: flex; align-items: center; gap: 6px; padding: 9px 16px; font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -0.32px; } .pxl-posts__loadmore.btn-glossy { position: absolute; } .pxl-posts__loadmore.btn-glossy:hover { background-color: var(--primary-color); } .pxl-posts__loadmore.loading { opacity: 0.8; } .pxl-posts__loadmore.loading svg { animation: pxl_spin 1s linear infinite; } .pxl-posts--grid { grid-template-columns: repeat(3, 1fr); margin-top: 120px; } @media screen and (max-width: 1024px) { .pxl-posts--grid { grid-template-columns: repeat(2, 1fr); gap: 24px; margin-top: 80px; grid-column: span 2; } } @media screen and (max-width: 767px) { .pxl-posts--grid { gap: 24px; margin-top: 40px; grid-template-columns: repeat(1, 1fr); } .pxl-posts--grid .pxl-posts__title { grid-column: span 1; } } .pxl-posts--listing { display: flex; flex-direction: column; gap: 24px; } .pxl-posts--listing .pxl-posts__item { display: flex; gap: 24px; grid-column: span 3; } .pxl-posts--listing .pxl-posts__item .pxl-posts__title { justify-content: flex-start; margin-top: 10px; } @media screen and (max-width: 767px) { .pxl-posts--listing .pxl-posts__item { gap: 20px; } } @media screen and (max-width: 575px) { .pxl-posts--listing .pxl-posts__item { gap: 12px; } } .pxl-posts__recent { grid-template-columns: 1fr; gap: 24px; padding-bottom: 0; } .pxl-posts__recent .pxl-posts__item { display: flex; gap: 16px; align-items: center; position: relative; } .pxl-posts__recent .pxl-posts__item a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; } .pxl-posts__recent .pxl-posts__item-img { overflow: hidden; border-radius: 8px; } .pxl-posts__recent .pxl-posts__item-img img { width: 100%; height: 100%; transform: scale(1); transition: all 0.3s ease; } .pxl-posts__recent .pxl-posts__item-date { font-size: 14px; color: var(--third-color); margin-bottom: 8px; } @media screen and (max-width: 575px) { .pxl-posts__recent .pxl-posts__item-date { font-size: 12px; } } .pxl-posts__recent .pxl-posts__item-date img { width: 14px; position: relative; top: -2px; } .pxl-posts__recent .pxl-posts__item-title { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; font-size: 18px; font-weight: 500; line-height: 1.35; letter-spacing: -0.36px; color: var(--primary-color); transition: all 0.3s ease; } @media screen and (max-width: 575px) { .pxl-posts__recent .pxl-posts__item-title { font-size: 16px; } } .pxl-posts__recent .pxl-posts__item:hover .pxl-posts__item-img img { transform: scale(1.1); } .pxl-posts__recent .pxl-posts__item:hover .pxl-posts__item-title { color: var(--secondary-color); } .pxl-tags { margin-top: 64px; } @media screen and (max-width: 575px) { .pxl-tags { margin-top: 24px; } } .pxl-tags+.pxl-post__footer { margin-top: 24px; } @media screen and (max-width: 575px) { .pxl-tags+.pxl-post__footer { margin-top: 16px; padding-right: 17px; } .pxl-tags+.pxl-post__footer .pxl-social { position: relative; justify-content: center; } } .pxl-tags a { padding: 1px 14px 3px; border-radius: 20px; background-color: #e9eaeb; color: var(--primary-color); display: inline-block; line-height: 1; margin-bottom: 4px; } .pxl-tags a:hover { background-color: var(--primary-color); color: #fff; } .pxl-post__item-lastest.pxl-post__item-no-img.pxl-posts__style-2 .pxl-posts__item-cont { position: relative; padding: 0; top: unset; left: unset; right: unset; bottom: unset; } .pxl-post__item-lastest+.pxl-posts { margin-top: 64px; padding-top: 65px; position: relative; } .pxl-post__item-lastest+.pxl-posts .pxl-posts__title { justify-content: flex-start; } @media screen and (max-width: 575px) { .pxl-post__item-lastest+.pxl-posts { margin-top: 24px; padding-top: 25px; } } .pxl-post__item-lastest+.pxl-posts::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 1px; background: linear-gradient(90deg, rgba(102, 102, 102, 0.00) 0%, rgba(102, 102, 102, 0.13) 25%, rgba(102, 102, 102, 0.16) 50%, rgba(102, 102, 102, 0.13) 75%, rgba(102, 102, 102, 0.00) 100%); } .pxl-post__item-gts { color: var(--primary-color); display: flex; align-items: center; gap: 6px; font-weight: 500; } .pxl-post__item-gts svg { transition: all 0.3s ease; } .pxl-post__item-gts path { stroke: var(--primary-color); transition: all 0.3s ease; } .pxl-post__item-gts:hover { color: var(--secondary-color); } .pxl-post__item-gts:hover svg { transform: translateX(50%); } .pxl-post__item-gts:hover path { stroke: var(--secondary-color); } .wp-singular:not(.page) .pxl-content-wrap, .blog .pxl-content-wrap { padding: 0 16px; } .wp-singular:not(.page) .pxl-content-wrap.pxl-sidebar__active, .blog .pxl-content-wrap.pxl-sidebar__active { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 30px; } @media screen and (max-width: 575px) { .wp-singular:not(.page) .pxl-content-wrap.pxl-sidebar__active, .blog .pxl-content-wrap.pxl-sidebar__active { gap: 0; } } .wp-singular:not(.page) .pxl-content-wrap.pxl-sidebar__active .pxl-content-area, .blog .pxl-content-wrap.pxl-sidebar__active .pxl-content-area { width: 100%; max-width: 800px; } .wp-singular:not(.page) .pxl-content-wrap.pxl-sidebar__active .pxl-ptit__text, .blog .pxl-content-wrap.pxl-sidebar__active .pxl-ptit__text { font-size: 48px; font-weight: 500; line-height: 1.2; letter-spacing: -2.4px; max-width: 732px; margin: 0 0 40px; -ms-word-wrap: break-word; word-wrap: break-word; } @media screen and (max-width: 767px) { .wp-singular:not(.page) .pxl-content-wrap.pxl-sidebar__active .pxl-ptit__text, .blog .pxl-content-wrap.pxl-sidebar__active .pxl-ptit__text { font-size: 36px; letter-spacing: -1.68px; margin: 40px 0 20px; } } @media screen and (max-width: 575px) { .wp-singular:not(.page) .pxl-content-wrap.pxl-sidebar__active .pxl-ptit__text, .blog .pxl-content-wrap.pxl-sidebar__active .pxl-ptit__text { font-size: 24px; letter-spacing: -0.6px; } } .wp-singular:not(.page) .pxl-content-wrap.pxl-sidebar__active .pxl-pmeta, .blog .pxl-content-wrap.pxl-sidebar__active .pxl-pmeta { justify-content: left; margin-bottom: 64px; } @media screen and (max-width: 575px) { .wp-singular:not(.page) .pxl-content-wrap.pxl-sidebar__active .pxl-pmeta, .blog .pxl-content-wrap.pxl-sidebar__active .pxl-pmeta { margin-bottom: 20px; } } .wp-singular:not(.page) .pxl-content-wrap.pxl-sidebar__active .pxl-post__image, .blog .pxl-content-wrap.pxl-sidebar__active .pxl-post__image { margin-bottom: 64px; } @media screen and (max-width: 575px) { .wp-singular:not(.page) .pxl-content-wrap.pxl-sidebar__active .pxl-post__image, .blog .pxl-content-wrap.pxl-sidebar__active .pxl-post__image { margin-bottom: 20px; } } @media screen and (max-width: 1280px) { .wp-singular:not(.page) .pxl-content-wrap.pxl-sidebar__active, .blog .pxl-content-wrap.pxl-sidebar__active { flex-direction: column; justify-content: center; align-items: center; } } .wp-singular:not(.page) .pxl-content-wrap.pxl-sidebar__active.pxl-sidebar__left, .blog .pxl-content-wrap.pxl-sidebar__active.pxl-sidebar__left { flex-direction: row-reverse; } .wp-singular:not(.page) .pxl-content-wrap.pxl-sidebar__deactive, .blog .pxl-content-wrap.pxl-sidebar__deactive { justify-content: center; } .wp-singular:not(.page) .pxl-content-wrap .pxl-sidebar-area, .blog .pxl-content-wrap .pxl-sidebar-area { width: 416px; } @media screen and (max-width: 1280px) { .wp-singular:not(.page) .pxl-content-wrap .pxl-sidebar-area, .blog .pxl-content-wrap .pxl-sidebar-area { width: 100%; max-width: 800px; } } .standard__no-sidebar+#pxl-main .container .pxl-posts__item { align-items: center; } .standard__no-sidebar+#pxl-main .container .pxl-posts--listing>.pxl-posts__title { margin-top: 60px; } .pxl-navigation { display: flex; justify-content: space-between; align-items: center; } .pxl-navigation__col a { display: flex; align-items: center; gap: 6px; color: var(--primary-color); } .pxl-navigation__col a svg { transform: translate(0px, -1px); transition: all 0.3s ease; } .pxl-navigation__col a svg path { transition: all 0.3s ease; } .pxl-navigation__col a:hover { color: var(--secondary-color); } .pxl-navigation__col a:hover svg { transform: translate(-5px, -1px); } .pxl-navigation__col a:hover svg path { stroke: var(--secondary-color); } .pxl-navigation__next { margin-left: auto; } .pxl-navigation__next a:hover { color: var(--secondary-color); } .pxl-navigation__next a:hover svg { transform: translate(5px, -1px); } .pxl-navigation__next a:hover svg path { stroke: var(--secondary-color); } .pxl-navigation__prev { margin-right: auto; } .pxl-social { position: absolute; bottom: 0px; left: 50%; transform: translateX(-50%); display: flex; gap: 8px; } .pxl-social__item { width: 40px; height: 40px; border: 1px solid #d5d7da; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; display: flex; justify-content: center; align-items: center; background-color: transparent; transition: all 0.3s ease; } .pxl-social__item svg path { transition: all 0.3s ease; } .pxl-social__item:hover { background-color: var(--primary-color); } .pxl-social__item:hover i { color: #fff; } .pxl-social__item:hover svg path { fill: #fff; } .pxl-sidebar__active .pxl-navigation { margin-bottom: 40px; } @media screen and (max-width: 575px) { .pxl-sidebar__active .pxl-navigation { margin-bottom: 0px; } } .home.blog .pxl-content-wrap { padding: 0px; } .blog .pxl-content-wrap, .search .pxl-content-wrap, .category .pxl-content-wrap, .tag .pxl-content-wrap, .archive .pxl-content-wrap { padding: 0 16px; } .blog .pxl-sidebar__active, .search .pxl-sidebar__active, .category .pxl-sidebar__active, .tag .pxl-sidebar__active, .archive .pxl-sidebar__active { display: flex; justify-content: space-between; } .blog .pxl-sidebar__active .pxl-content-area, .search .pxl-sidebar__active .pxl-content-area, .category .pxl-sidebar__active .pxl-content-area, .tag .pxl-sidebar__active .pxl-content-area, .archive .pxl-sidebar__active .pxl-content-area { max-width: 800px; } .blog .pxl-sidebar__active .pxl-sidebar-sticky, .search .pxl-sidebar__active .pxl-sidebar-sticky, .category .pxl-sidebar__active .pxl-sidebar-sticky, .tag .pxl-sidebar__active .pxl-sidebar-sticky, .archive .pxl-sidebar__active .pxl-sidebar-sticky { padding: 0; } .blog .pxl-sidebar__active .pxl-sidebar-area, .search .pxl-sidebar__active .pxl-sidebar-area, .category .pxl-sidebar__active .pxl-sidebar-area, .tag .pxl-sidebar__active .pxl-sidebar-area, .archive .pxl-sidebar__active .pxl-sidebar-area { width: 100%; max-width: 416px; } @media screen and (max-width: 1280px) { .blog .pxl-sidebar__active .pxl-sidebar-area, .search .pxl-sidebar__active .pxl-sidebar-area, .category .pxl-sidebar__active .pxl-sidebar-area, .tag .pxl-sidebar__active .pxl-sidebar-area, .archive .pxl-sidebar__active .pxl-sidebar-area { max-width: 800px; } } .blog #pxl-ptit__default, .search #pxl-ptit__default, .category #pxl-ptit__default, .tag #pxl-ptit__default, .archive #pxl-ptit__default { padding-bottom: 100px; } .pxl-posts__item-editor { display: flex; gap: 5px; align-items: center; position: absolute; top: 16px; right: 16px; border-radius: 8px; background-color: var(--secondary-color); transition: all 0.3s ease; z-index: 1; padding: 7px 16px; color: #fff; } .pxl-posts__item-editor img { width: 14px; } .pxl-posts__item-editor:hover { background-color: var(--primary-color); color: #fff; } @media screen and (max-width: 575px) { .pxl-posts__item-editor { font-size: 12px; padding: 5px 10px; } } .pxl-posts__style-1 { border-radius: 16px; border: 1px solid #d5d7da; background: #f8f9fc; } .pxl-posts__style-1 .pxl-posts__item-img { overflow: hidden; padding: 4px 4px 0px 4px; } .pxl-posts__style-1 .pxl-posts__item-img a { overflow: hidden; width: 100%; display: block; -webkit-border-radius: 12px; -khtml-border-radius: 12px; -moz-border-radius: 12px; -ms-border-radius: 12px; -o-border-radius: 12px; border-radius: 12px; } .pxl-posts__style-1 .pxl-posts__item-img a img { transform: scale(1); transition: all 0.3s ease; border-radius: 12px; } .pxl-posts__style-1:hover .pxl-posts__item-img a img { transform: scale(1.1); } .pxl-posts__style-1 .pxl-posts__item-cnt { padding: 24px; width: 100%; } @media screen and (max-width: 575px) { .pxl-posts__style-1 .pxl-posts__item-cnt { padding: 12px; } } .pxl-posts__style-1 .pxl-posts__item-cnt .pxl-pmeta { display: flex; gap: 16px; flex-wrap: wrap; margin-bottom: 24px; justify-content: flex-start; margin: 0 0 24px; } @media screen and (max-width: 575px) { .pxl-posts__style-1 .pxl-posts__item-cnt .pxl-pmeta { margin: 0 0 8px; } } .pxl-posts__style-1 .pxl-posts__item-cnt .pxl-pmeta__date { display: flex; align-items: center; gap: 4px; font-size: 14px; line-height: 1.3; background-color: transparent; padding: 0; color: var(--third-color); } .pxl-posts__style-1 .pxl-posts__item-cnt .pxl-pmeta__date img { width: 14px; } .pxl-posts__style-1 .pxl-posts__item-cnt .pxl-pmeta__cat a { color: var(--primary-color); font-size: 14px; line-height: 1.3; } .pxl-posts__style-1 .pxl-posts__item-cnt .pxl-pmeta__cat a:hover { color: var(--secondary-color); } .pxl-posts__style-1 .pxl-posts__item-cnt .pxl-posts__item-tit { font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.8px; margin-bottom: 16px; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; } @media screen and (max-width: 767px) { .pxl-posts__style-1 .pxl-posts__item-cnt .pxl-posts__item-tit { font-size: 18px; margin: 0 0 8px; } } .pxl-posts__style-1 .pxl-posts__item-cnt .pxl-posts__item-tit a { color: var(--primary-color); } .pxl-posts__style-1 .pxl-posts__item-cnt .pxl-posts__item-tit a:hover { color: var(--secondary-color); } .pxl-posts__style-1 .pxl-posts__item-cnt .pxl-posts__item-exc { color: var(--third-color); font-weight: 400; margin-bottom: 24px; } .pxl-posts__style-1 .pxl-posts__item-cnt .pxl-posts__item-exc .two-lines { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } @media screen and (max-width: 575px) { .pxl-posts__style-1 .pxl-posts__item-cnt .pxl-posts__item-exc { margin: 0 0 8px; } } .pxl-posts__style-2 { position: relative; } .pxl-posts__style-2 .pxl-posts__item-img { border-radius: 16px; overflow: hidden; } .pxl-posts__style-2 .pxl-posts__item-img .pxl-post__link img, .pxl-posts__style-2 .pxl-posts__item-img>img { transform: scale(1); width: 100%; height: 100%; transition: all 0.3s ease; } .pxl-posts__style-2 .pxl-posts__item-cont { position: absolute; left: 8px; right: 8px; bottom: 8px; border-radius: 12px; background-color: #fff; padding: 16px; } .pxl-posts__style-2 .pxl-posts__item-cont .pxl-pmeta { margin: 0 0 24px !important; justify-content: start; } @media screen and (max-width: 575px) { .pxl-posts__style-2 .pxl-posts__item-cont .pxl-pmeta { margin: 0 0 12px; } } .pxl-posts__style-2 .pxl-posts__item-cont .pxl-posts__item-tit { font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.8px; } @media screen and (max-width: 767px) { .pxl-posts__style-2 .pxl-posts__item-cont .pxl-posts__item-tit { font-size: 18px; } } .pxl-posts__style-2:hover .pxl-posts__item-img img { transform: scale(1.1); } .pxl-posts__style-3 { text-align: left; display: flex; gap: 64px; align-items: center; } @media screen and (max-width: 991px) { .pxl-posts__style-3 { flex-direction: column; gap: 24px; } } .pxl-posts__style-3 .pxl-posts__item-img { overflow: hidden; -webkit-border-radius: 16px; -khtml-border-radius: 16px; -moz-border-radius: 16px; -ms-border-radius: 16px; -o-border-radius: 16px; border-radius: 16px; width: 100%; max-width: 640px; position: relative; } .pxl-posts__style-3 .pxl-posts__item-img img { width: 100%; height: 100%; transition: all 0.3s ease; transform: scale(1); } .pxl-posts__style-3 .pxl-posts__item-editor { position: absolute; top: 16px; right: 16px; } .pxl-posts__style-3 .pxl-posts__item-editor:hover { color: #fff; } .pxl-posts__style-3 .pxl-posts__item-editor img { width: 14px; } .pxl-posts__style-3 .pxl-posts__item-cont .pxl-pmeta { margin: 0 0 40px; justify-content: start; } @media screen and (max-width: 991px) { .pxl-posts__style-3 .pxl-posts__item-cont .pxl-pmeta { margin: 0 0 24px; } } @media screen and (max-width: 767px) { .pxl-posts__style-3 .pxl-posts__item-cont .pxl-pmeta { margin: 0 0 16px; } } @media screen and (max-width: 767px) { .pxl-posts__style-3 .pxl-posts__item-cont .pxl-pmeta { margin: 0 0 12px; } } .pxl-posts__style-3 .pxl-posts__item-cont .pxl-posts__item-tit { font-size: 20px; font-weight: 500; line-height: 1.2; letter-spacing: -0.8px; } @media screen and (max-width: 767px) { .pxl-posts__style-3 .pxl-posts__item-cont .pxl-posts__item-tit { font-size: 18px; } } .pxl-posts__style-3 .pxl-posts__item-cont .pxl-posts__item-exc { color: var(--third-color); font-weight: 400; } .pxl-posts__style-3 .pxl-posts__item-cont .pxl-post__author { margin: 40px 0 64px; } @media screen and (max-width: 767px) { .pxl-posts__style-3 .pxl-posts__item-cont .pxl-post__author { margin: 20px 0 20px; } } .pxl-posts__style-3:hover .pxl-posts__item-img img { transform: scale(1.1); } .pxl-posts__style-4 { align-items: center; } @media screen and (max-width: 991px) { .pxl-posts__style-4 { flex-direction: column; } } .pxl-posts__style-4 .pxl-posts__item-img { overflow: hidden; border-radius: 12px; width: 100%; min-width: 400px; max-width: 400px; } .pxl-posts__style-4 .pxl-posts__item-img img { width: 100%; transform: scale(1); transition: all 0.3s ease; } @media screen and (max-width: 1200px) { .pxl-posts__style-4 .pxl-posts__item-img { min-width: 300px; } } @media screen and (max-width: 991px) { .pxl-posts__style-4 .pxl-posts__item-img { min-width: 100%; } } .pxl-posts__style-4 .pxl-posts__item-cnt { width: 100%; } .pxl-posts__style-4 .pxl-posts__item-cnt .pxl-posts__item-tit { overflow: hidden; font-size: 20px; line-height: 1.2; letter-spacing: -0.8px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; } @media screen and (max-width: 767px) { .pxl-posts__style-4 .pxl-posts__item-cnt .pxl-posts__item-tit { font-size: 18px; margin-bottom: 8px; } } .pxl-posts__style-4 .pxl-posts__item-cnt .pxl-pmeta { justify-content: flex-start; margin: 0 0 24px !important; } @media screen and (max-width: 767px) { .pxl-posts__style-4 .pxl-posts__item-cnt .pxl-pmeta { margin: 0 0 16px; } } @media screen and (max-width: 575px) { .pxl-posts__style-4 .pxl-posts__item-cnt .pxl-pmeta { margin: 0 0 12px; } } .pxl-posts__style-4 .pxl-posts__item-cnt .pxl-pmeta__date { padding: 0; background-color: transparent; color: var(--third-color); } .pxl-posts__style-4 .pxl-posts__item-cnt .pxl-pmeta__date img { transform: translateY(-1px); } .pxl-posts__style-4 .pxl-posts__item-cnt .pxl-posts__item-exc { margin-bottom: 24px; } @media screen and (max-width: 575px) { .pxl-posts__style-4 .pxl-posts__item-cnt .pxl-posts__item-exc { margin-bottom: 12px; } } .pxl-posts__style-4:hover .pxl-posts__item-img img { transform: scale(1.1); } button:not(.btn), .button:not(.btn), input[type="submit"]:not(.btn), button.button { border: none; outline: none; transition: all 0.3s ease; background-color: var(--primary-color); padding: 13px 20px; border: none; outline: none; border-radius: 8px; display: flex; align-items: center; color: #fff; font-size: 16px; gap: 6px; cursor: pointer; position: relative; overflow: hidden; } button.iti__selected-country { background-color: transparent; padding: 0 12px; } button.iti__selected-country:hover, button.iti__selected-country:focus, button.iti__selected-country:active { background-color: #f5f5f5; } .pxl-button { --gradient-color-1: #ec8cf9; --gradient-color-2: #a789ed; --gradient-color-3: #66ddcb; --gradient-color-4: #4fe3fc; --gradient-color-5: #0478ce; --gradient-color-6: #577590; --gradient-color-7: #43aa8b; --gradient-color-8: #90be6d; --gradient-color-9: #f9c74f; --gradient-color-10: #f3722c; } .pxl-button__linear-blur { position: absolute; width: 100%; height: 100%; border-radius: 12px; box-sizing: border-box; padding: 4px; filter: blur(9px); background: linear-gradient(90deg, var(--gradient-color-1) 0%, var(--gradient-color-2) 27%, var(--gradient-color-3) 52%, var(--gradient-color-4) 76%, var(--gradient-color-5) 100%); transition: all 0.3s ease; } .pxl-button__linear-blur::before { content: ""; position: absolute; top: 4px; left: 4px; right: 4px; bottom: 4px; background-color: #d9d9d9; border-radius: 8px; filter: blur(9px); z-index: 1; } .pxl-button__arrow-target--arrow { position: absolute; top: 0; right: 0; transform: translate(85%, -80%); z-index: 3; } .pxl-button__arrow-target--cursor { position: absolute; bottom: 0; left: 0; transform: translate(-50%, 50%); z-index: 3; } .pxl-button:hover .pxl-button__linear-blur { background: linear-gradient(90deg, var(--gradient-color-6) 0%, var(--gradient-color-7) 27%, var(--gradient-color-8) 52%, var(--gradient-color-9) 76%, var(--gradient-color-10) 100%); } .btn { padding: 13px 20px; border: none; outline: none; border-radius: 12px; } .btn .btn-icon { display: flex; justify-content: center; align-items: center; margin-right: 6px; } .btn .btn-icon i, .btn .btn-icon svg { transition: all 0.3s ease; } .btn.btn-space-between { justify-content: space-between; } .btn-inline { display: inline-block; } .btn-text-outline.btn__icon-active { align-items: flex-start; } .btn-text-outline .btn-icon { display: flex; width: 64px; height: 64px; justify-content: center; align-items: center; gap: 6px; flex-shrink: 0; border-radius: 99px; margin-right: 0; border-radius: 99px; border: 1px solid #d5d7da; background: #fafafa; } .btn-text-outline .btn-text { position: relative; transform: translateY(-100%); z-index: 2; border-bottom: 1px solid #0a0d12; } .btn-block { display: flex; justify-content: center; align-items: center; width: 100%; } .btn__icon-active { display: flex; flex-direction: row; justify-content: center; align-items: center; } .btn-default { color: #fff; background-color: var(--secondary-color); -webkit-border-radius: 8px; -khtml-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; border-radius: 8px; border: 2px solid #e9d9d9; } .btn-default:hover { color: #fff; background-color: var(--primary-color); } .btn__icon-right { display: flex; align-items: center; flex-direction: row-reverse; } .btn__icon-right .btn-icon { margin: 0 0px 0 6px; } .btn__icon-right.icon-move:hover i, .btn__icon-right.icon-move:hover svg { transform: translateX(5px); } .btn__icon-left.icon-move:hover i, .btn__icon-left.icon-move:hover svg { transform: translateX(-5px); } .btn-primary { color: #fff; background-color: var(--primary-color); } .btn-primary:hover { color: #fff; } .btn-glossy { position: relative; overflow: hidden; } .btn-glossy:before { content: ''; position: absolute; top: 0; left: -200%; width: 200%; height: 100%; -webkit-transform: skewx(-20deg); -khtml-transform: skewx(-20deg); -moz-transform: skewx(-20deg); -ms-transform: skewx(-20deg); -o-transform: skewx(-20deg); transform: skewx(-20deg); background-image: linear-gradient(to right, transparent, rgba(255, 255, 255, .35), transparent); z-index: 1; } .btn-glossy:hover:before { -webkit-animation: pxl_btn_shine 1.8s ease; animation: pxl_btn_shine 1.8s ease; -webkit-animation-delay: 0.1s; animation-delay: 0.1s; } .btn-loadmore { padding: 9px 16px; font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -0.32px; cursor: pointer; width: fit-content; display: flex; align-items: center; gap: 6px; } .btn-loadmore svg { position: relative; top: -1px; } .btn-secondary { color: #fff; background-color: var(--secondary-color); } .btn-secondary:hover { color: #fff; background-color: var(--primary-color); } .btn-transparent { color: var(--primary-color); background-color: transparent; border-color: transparent; } .btn__has-border { border: 4px solid #d5d7da; } .btn__has-border:hover { border-color: #fff; } .btn__linear-blur { background-color: #181d27; border-radius: 12px; color: #fff; z-index: 1; position: relative; } .btn-mix-blend-mode-light { position: relative; display: flex; padding: 13px 20px; justify-content: center; align-items: center; gap: 6px; border-radius: 99px; overflow: hidden; background-color: #000; } .btn-mix-blend-mode-light:after { content: ''; position: absolute; top: -1px; left: -1px; border-radius: 99px; background-blend-mode: screen, screen, color-burn; box-shadow: 23px 32px 13px -34px #fff inset, -23px -30px 21px -34px #fff inset, 4px 4px 2px -4px rgba(255, 255, 255, 0.2) inset, 0px 0px 44px 0px rgba(255, 255, 255, 0.2) inset; backdrop-filter: blur(20px); z-index: 2; height: calc(100% + 2px); width: calc(100% + 2px); } .btn-mix-blend-mode-light .btn-icon { z-index: 3; } .btn-mix-blend-mode-light .btn-text { position: relative; z-index: 3; } .btn-mix-blend-mode-dark { position: relative; display: flex; padding: 13px 20px; justify-content: center; align-items: center; gap: 6px; border-radius: 99px; overflow: hidden; background-color: #fff; } .btn-mix-blend-mode-dark:after { content: ''; position: absolute; top: -1px; left: -1px; border-radius: 99px; background-blend-mode: screen, screen, color-burn; box-shadow: 23px 32px 13px -34px #000 inset, -23px -30px 21px -34px #000 inset, 4px 4px 2px -4px rgba(0, 0, 0, 0.2) inset, 0px 0px 44px 0px rgba(0, 0, 0, 0.2) inset; backdrop-filter: blur(20px); z-index: 2; height: calc(100% + 2px); width: calc(100% + 2px); } .btn-mix-blend-mode-dark .btn-icon { z-index: 3; } .btn-mix-blend-mode-dark .btn-text { position: relative; z-index: 3; } .btn__linear-blur-2 { border-radius: 99px; background: linear-gradient(84deg, var(--gradient-color-1) -15.95%, var(--gradient-color-2) 12.74%, var(--gradient-color-3) 41.52%, var(--gradient-color-4) 70.92%, var(--gradient-color-5) 103.3%); box-shadow: 32px 32px 18px -36px rgba(255, 255, 255, 0.32) inset, -24px -24px 12px -28px rgba(179, 179, 179, 0.56) inset, 4px 4px 2px -4px rgba(179, 179, 179, 0.72) inset, 0px 0px 44px 0px rgba(242, 242, 242, 0.40) inset; backdrop-filter: blur(20px); } .btn__linear-blur-2:hover { background: linear-gradient(84deg, var(--gradient-color-6) -15.95%, var(--gradient-color-7) 12.74%, var(--gradient-color-8) 41.52%, var(--gradient-color-9) 70.92%, var(--gradient-color-10) 103.3%); } .btn__linear-blur-2:after { content: ''; position: absolute; top: -1px; left: -1px; border-radius: 99px; background-blend-mode: screen, screen, color-burn; box-shadow: 23px 32px 13px -34px #fff inset, -23px -30px 21px -34px #fff inset, 4px 4px 2px -4px rgba(255, 255, 255, 0.2) inset, 0px 0px 44px 0px rgba(255, 255, 255, 0.2) inset; backdrop-filter: blur(20px); z-index: 2; height: calc(100% + 2px); width: calc(100% + 2px); } .btn__linear-blur-2 .btn-icon { z-index: 3; } .btn__linear-blur-2 .btn-text { position: relative; z-index: 3; } .btn.btn-hv-shake:hover { animation: shake-button 0.4s ease-in-out; } .btn.btn-hv-icon-to-right:hover .btn-icon { overflow: hidden; } .btn.btn-hv-icon-to-right:hover .btn-icon i, .btn.btn-hv-icon-to-right:hover .btn-icon svg { animation: icon_to_right 0.4s ease-in-out; } .btn.btn-hv-icon-to-left:hover .btn-icon { overflow: hidden; } .btn.btn-hv-icon-to-left:hover .btn-icon i, .btn.btn-hv-icon-to-left:hover .btn-icon svg { animation: icon_to_left 0.4s ease-in-out; } .btn.btn-hv-icon-to-bottom:hover .btn-icon { overflow: hidden; } .btn.btn-hv-icon-to-bottom:hover .btn-icon i, .btn.btn-hv-icon-to-bottom:hover .btn-icon svg { animation: icon_to_bottom 0.4s ease-in-out; } .btn.btn-hv-icon-to-top:hover .btn-icon { overflow: hidden; } .btn.btn-hv-icon-to-top:hover .btn-icon i, .btn.btn-hv-icon-to-top:hover .btn-icon svg { animation: icon_to_top 0.4s ease-in-out; } .btn.btn-hv-icon-to-top-right:hover .btn-icon { overflow: hidden; } .btn.btn-hv-icon-to-top-right:hover .btn-icon i, .btn.btn-hv-icon-to-top-right:hover .btn-icon svg { animation: icon_to_top_right 0.4s ease-in-out; } .btn.btn-hv-icon-to-bottom-right:hover .btn-icon { overflow: hidden; } .btn.btn-hv-icon-to-bottom-right:hover .btn-icon i, .btn.btn-hv-icon-to-bottom-right:hover .btn-icon svg { animation: icon_to_bottom_right 0.4s ease-in-out; } .btn.btn-hv-icon-to-bottom-left:hover .btn-icon { overflow: hidden; } .btn.btn-hv-icon-to-bottom-left:hover .btn-icon i, .btn.btn-hv-icon-to-bottom-left:hover .btn-icon svg { animation: icon_to_bottom_left 0.4s ease-in-out; } .btn.btn-hv-icon-to-top-left:hover .btn-icon { overflow: hidden; } .btn.btn-hv-icon-to-top-left:hover .btn-icon i, .btn.btn-hv-icon-to-top-left:hover .btn-icon svg { animation: icon_to_top_left 0.4s ease-in-out; } .btn.btn-hv-icon-on-press:hover .btn-icon { overflow: hidden; } .btn.btn-hv-icon-on-press:hover .btn-icon i, .btn.btn-hv-icon-on-press:hover .btn-icon svg { animation: icon_on_press 1s ease-in-out; } .btn-blur:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 29.521px; background: rgba(255, 255, 255, 0.1); mix-blend-mode: soft-light; filter: blur(40px); } .btn-blur .btn-icon { z-index: 3; } .btn-blur .btn-text { position: relative; z-index: 3; } .btn-gradient-3colors { background: linear-gradient(90deg, var(--gradient-color-1) 0%, var(--gradient-color-2) 50%, var(--gradient-color-3) 100%); } .pxl-button__arrow-target { position: absolute; z-index: 3; } .pxl-button--btn-border-bottom-gradient { position: relative; padding-bottom: 6px; --gradient-color-1: #28c6ff; --gradient-color-2: #573cf1; } .pxl-button--btn-border-bottom-gradient .btn-border-bottom-gradient { background-color: #000; border-radius: 12px; position: relative; z-index: 2; font-size: 16px; line-height: 1.3; letter-spacing: -0.32px; font-weight: 500; padding: 13px 20px; border-radius: 12px; border: none; color: #fff; } .pxl-button--btn-border-bottom-gradient:after { content: ''; position: absolute; bottom: 0px; left: 0; width: 100%; height: 100%; background: linear-gradient(90deg, var(--gradient-color-1) 0%, var(--gradient-color-2) 100%); border-radius: 12px; z-index: 1; } input::-moz-placeholder, textarea::-moz-placeholder { color: inherit; opacity: 1; text-overflow: ellipsis; } input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: inherit; opacity: 1; text-overflow: ellipsis; } input::-o-placeholder, textarea::-o-placeholder { color: inherit; opacity: 1; text-overflow: ellipsis; } input::-ms-placeholder, textarea::-ms-placeholder { color: inherit; opacity: 1; text-overflow: ellipsis; } input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; -moz-appearance: none; appearance: none; margin: 0; } input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="tel"], input[type="number"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea, select, .pxl-select-higthlight { background-color: #fff; border: 1px solid #d5d7da; color: #454545; padding: 6px 32px; font-size: 16px; font-weight: 400; height: 50px; transition: all 300ms linear 0ms; -webkit-box-shadow: none; -khtml-box-shadow: none; -moz-box-shadow: none; -ms-box-shadow: none; -o-box-shadow: none; box-shadow: none; -webkit-border-radius: 8px; -khtml-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; border-radius: 8px; width: 100%; outline: none; font-family: inherit; } input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="number"]:focus, input[type="range"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="time"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="color"]:focus, textarea:focus, select:focus, .pxl-select-higthlight:focus { outline: 0; border-color: var(--primary-color); color: #333; } @media screen and (max-width: 767px) { input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="tel"], input[type="number"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea, select, .pxl-select-higthlight { height: 40px; font-size: 14px; } } .page-content .search-form .searchform-wrap { position: relative; } .page-content .search-form .searchform-wrap>img { position: absolute; top: 50%; left: 12px; transform: translateY(-50%); width: 16px; height: 16px; } .page-content .search-form .searchform-wrap>button { position: absolute; top: 50%; right: 4px; transform: translateY(-50%); width: 16px; padding: 0; width: 40px; height: 40px; } .page-content .search-form .searchform-wrap>button svg { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } input[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; } input[type=number] { -moz-appearance: textfield; } .no-results h1, .not-found h1 { font-size: 32px; font-weight: 500; line-height: 1.35; letter-spacing: -0.48px; margin-bottom: 16px; } .nice-select { background: #fff; border: 1px solid #d5d7da; border-radius: 8px; padding: 5px 32px 5px 12px; color: var(--third-color); cursor: pointer; border-radius: 8px; height: 50px; position: relative; display: flex; align-items: center; } .nice-select:after { content: ""; width: 16px; height: 16px; background: url('../img/arrow-down.svg') no-repeat center / 100%; position: absolute; top: 50%; right: 12px; transform: translate(0, -50%); } .nice-select:hover { border-color: #a0a0a0; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08); } .nice-select .list { margin-top: 4px; background: #fff; border-radius: 0 0 8px 8px; overflow: hidden; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); opacity: 0; visibility: hidden; transition: all 0.3s ease; list-style: none; position: absolute; top: calc(100% - 47px); left: 0; width: 100%; z-index: 1000; } .nice-select.open { border-color: var(--primary-color); } .nice-select.open .list { opacity: 1; visibility: visible; transform: translateY(0); } .nice-select .option { padding: 8px 12px; transition: background 0.2s ease, color 0.2s ease; } .nice-select .option:hover, .nice-select .option.focus { background: #f5f5f5; color: var(--primary-color); } .nice-select .option.selected { font-weight: 500; color: var(--primary-color); } input[type="range"] { padding: 0; background-color: transparent; height: auto; border: none; } select { height: 50px; } textarea { padding-top: 17px; padding-bottom: 17px; height: 154px; margin: 0; border-radius: 12px; } button { cursor: pointer; /* Select Style */ } .pxl-select { width: 100%; position: relative; } .pxl-select .pxl-select-hidden { position: absolute; visibility: hidden; opacity: 0; } .pxl-select .pxl-select-options { max-height: 282px; overflow-y: auto; position: absolute; top: 100%; left: 0; right: 0; list-style: none; margin: 10px 0 0; padding: 12px 18px; background-color: #fff; z-index: 900; font-size: 16px; color: #666; font-family: inherit; box-shadow: 0 3px 65px rgba(1, 1, 1, 0.08); -webkit-border-radius: 0px; -khtml-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; -webkit-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -khtml-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -moz-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -ms-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); opacity: 0; margin-top: 30px; visibility: hidden; border-radius: 0 0 10px 10px; } .pxl-select .pxl-select-options li { padding: 9px 10px; cursor: pointer; -webkit-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -khtml-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -moz-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -ms-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); -o-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1); line-height: normal !important; border-radius: 5px; } .pxl-select .pxl-select-options li:first-child { display: none; } .pxl-select .pxl-select-options li:hover { color: #0a1320; background-color: rgba(10, 19, 32, 0.04); } .pxl-select .pxl-select-higthlight { display: flex; align-items: center; cursor: pointer; position: relative; } .pxl-select .pxl-select-higthlight::after { content: ""; width: 16px; height: 16px; background: url('../img/arrow-down.svg') no-repeat center / 100%; position: absolute; top: 50%; right: 16px; transform: translate(0, -50%); } .pxl-select .pxl-select-higthlight.active { border-bottom-left-radius: 0px !important; border-bottom-right-radius: 0px !important; } .pxl-select .pxl-select-higthlight.active+.pxl-select-options { opacity: 1; margin-top: 0px; visibility: visible; } .pxl-select .pxl-select-higthlight.active:before { transform: translate(0, -50%) scaleY(-1); } .wp-block-archives.wp-block-archives-dropdown, .wp-block-categories.wp-block-categories-dropdown { position: relative; display: inline-block; margin-bottom: 16px; } .wp-block-archives.wp-block-archives-dropdown .wp-block-archives__label, .wp-block-categories.wp-block-categories-dropdown .wp-block-archives__label, .wp-block-archives.wp-block-archives-dropdown .wp-block-categories__label, .wp-block-categories.wp-block-categories-dropdown .wp-block-categories__label { margin-bottom: 10px; } .wp-block-archives.wp-block-archives-dropdown select, .wp-block-categories.wp-block-categories-dropdown select { appearance: none; -webkit-appearance: none; -moz-appearance: none; padding-right: 36px; padding: 0 20px; } .wp-block-archives.wp-block-archives-dropdown::after, .wp-block-categories.wp-block-categories-dropdown::after { content: ""; position: absolute; bottom: 18px; right: 16px; width: 16px; height: 16px; background: url('../img/arrow-down.svg') no-repeat center / 100%; pointer-events: none; } .wp-block-calendar { margin: 0 0 16px; position: relative; } .wp-block-calendar table { border-collapse: collapse; border-spacing: 0; } .wp-block-calendar table caption { background-color: var(--primary-color); color: #fff; font-size: 18px; min-height: 40px; line-height: 40px; } .wp-block-calendar table tr th { padding: 10px; } .wp-block-calendar table tr td { padding: 10px; } .wp-block-calendar .wp-calendar-nav { display: flex; align-items: center; justify-content: space-between; padding: 0 10px; position: absolute; top: 0px; left: 0; right: 0; min-height: 40px; } .wp-block-calendar .wp-calendar-nav .wp-calendar-nav-prev a, .wp-block-calendar .wp-calendar-nav .wp-calendar-nav-next a { color: #fff; } .wp-block-calendar .wp-calendar-nav .wp-calendar-nav-prev a:hover, .wp-block-calendar .wp-calendar-nav .wp-calendar-nav-next a:hover { font-weight: 500; } .wp-block-latest-posts__list li+li { margin-top: 16px; } .post-password-form { position: relative; } .post-password-form input { height: 40px; border: 1px solid #d5d7da; padding: 0 16px; border-radius: 8px; } .post-password-form input[type="submit"] { position: absolute; bottom: 0; right: 0; } .page-links { display: flex; gap: 10px; align-items: center; justify-content: center; } .page-links .post-page-numbers { width: 40px; height: 40px; border-radius: 50%; border-radius: 40px; display: flex; justify-content: center; align-items: center; border: 1px solid #d5d7da; cursor: pointer; position: relative; transition: all 0.3s ease; background-color: #fff; } .page-links .post-page-numbers.current, .page-links .post-page-numbers:hover { background-color: var(--primary-color); color: #fff; } .pxl-comments { position: relative; max-width: 1040px; margin: 0 auto; } .pxl-comments .pxl-comments__title { margin-bottom: 64px; } .pxl-comments .pxl-comments__title img { width: 48px; transform: translateY(-5px); } @media screen and (max-width: 575px) { .pxl-comments .pxl-comments__title { margin-bottom: 24px; } .pxl-comments .pxl-comments__title img { width: 24px; transform: translateY(-2px); } } .pxl-comments .pxl-comments__list { list-style: none; margin-bottom: 40px; } .pxl-comments .pxl-comments__list .pxl-comments__item { position: relative; } .pxl-comments .pxl-comments__list .pxl-comments__item+.pxl-comments__item { margin-top: 40px; padding-top: 41px; } @media screen and (max-width: 575px) { .pxl-comments .pxl-comments__list .pxl-comments__item+.pxl-comments__item { margin-top: 20px; padding-top: 21px; } } .pxl-comments .pxl-comments__list .pxl-comments__item+.pxl-comments__item::before { height: calc(100% - 89px); } .pxl-comments .pxl-comments__list .pxl-comments__item+.pxl-comments__item::after { content: ""; background: linear-gradient(90deg, rgba(102, 102, 102, 0.00) 0%, rgba(102, 102, 102, 0.13) 25%, rgba(102, 102, 102, 0.16) 50%, rgba(102, 102, 102, 0.13) 75%, rgba(102, 102, 102, 0.00) 100%); width: 100%; height: 1px; display: block; position: absolute; top: 0; left: 0; } .pxl-comments .pxl-comments__list .pxl-comments__item.parent::before { content: ""; height: calc(100% - 48px); width: 1px; background: linear-gradient(180deg, rgba(102, 102, 102, 0.00) 0%, rgba(102, 102, 102, 0.13) 25%, rgba(102, 102, 102, 0.16) 50%, rgba(102, 102, 102, 0.13) 75%, rgba(102, 102, 102, 0.00) 100%); left: 20px; bottom: 0; position: absolute; display: block; } @media screen and (max-width: 575px) { .pxl-comments .pxl-comments__list .pxl-comments__item.parent::before { left: 14px; } } .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner { position: relative; } .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comment__action-hide { width: 16px; height: 16px; position: absolute; right: 0; top: 12px; cursor: pointer; z-index: 1; } .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comment__action-hide .pxl-comment__opt { position: absolute; bottom: 0; right: 0; transform: translateY(110%); transition: all 0.3s ease; opacity: 0; visibility: hidden; margin: 0; padding: 0; list-style: none; background-color: #fff; box-shadow: 0 1px 72px 0 rgba(0, 0, 0, 0.08); border-radius: 8px; overflow: hidden; } .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comment__action-hide .pxl-comment__opt li { font-weight: 500; color: var(--primary-color); padding: 8px 15px; position: relative; } .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comment__action-hide .pxl-comment__opt li:hover { background-color: var(--primary-color); color: #fff; } .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comment__action-hide .pxl-comment__opt li+li:before { content: ""; width: 100%; height: 1px; display: block; position: absolute; top: 0; left: 0; background: linear-gradient(90deg, rgba(102, 102, 102, 0.00) 0%, rgba(102, 102, 102, 0.13) 25%, rgba(102, 102, 102, 0.16) 50%, rgba(102, 102, 102, 0.13) 75%, rgba(102, 102, 102, 0.00) 100%); } .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comment__action-hide.active .pxl-comment__opt { opacity: 1; visibility: visible; } .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comments__avatar { position: relative; display: flex; gap: 8px; padding: 8px 16px 8px 56px; align-items: center; } @media screen and (max-width: 575px) { .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comments__avatar { padding: 5px 8px 5px 40px; } } .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comments__avatar img { position: absolute; top: 0; left: 0; border-radius: 50%; } @media screen and (max-width: 575px) { .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comments__avatar img { width: 30px; } } .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comments__avatar .pxl-comments__item-title { font-size: 18px; font-style: normal; line-height: 1.35; letter-spacing: -0.36px; margin: 0; } @media screen and (max-width: 575px) { .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comments__avatar .pxl-comments__item-title { font-size: 16px; } } .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comments__avatar .pxl-comments__item-time { padding-left: 22px; position: relative; color: var(--third-color); } .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comments__avatar .pxl-comments__item-time::before { content: ""; position: absolute; top: 8px; left: 8px; width: 4px; height: 4px; background-color: var(--third-color); border-radius: 50%; } .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comments__item-cnt { padding: 0 0 0 56px; margin-top: 8px; } @media screen and (max-width: 575px) { .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comments__item-cnt { padding: 0 0 0 40px; } } .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comments__item-cnt .pxl-comments__actions { display: flex; gap: 6px; align-items: center; } .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comments__item-cnt .pxl-comments__actions .pxl-comments__like { display: flex; gap: 4px; align-items: center; font-size: 14px; font-weight: 500; background-color: #eaecf5; border-radius: 8px; padding: 3px 8px; color: var(--primary-color); cursor: pointer; } .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comments__item-cnt .pxl-comments__actions .pxl-comments__like:hover { background-color: var(--primary-color); color: #fff; } .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comments__item-cnt .pxl-comments__actions .pxl-comments__like.liking { opacity: 0.8; pointer-events: none; } .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comments__item-cnt .pxl-comments__actions .pxl-comments__like img { width: 14px; } .pxl-comments .pxl-comments__list .pxl-comments__item .pxl-comments__item-body .pxl-comments__item-inner .pxl-comments__item-cnt .pxl-comments__actions .pxl-comments__item-reply { padding: 3px 8px; font-weight: 500; font-size: 14px; line-height: 1.3; cursor: pointer; color: var(--primary-color); } .pxl-comments .pxl-comments__list .pxl-comments__item .children { list-style: none; padding: 24px 0 0 56px; margin-bottom: 0; } @media screen and (max-width: 575px) { .pxl-comments .pxl-comments__list .pxl-comments__item .children { padding: 24px 0 0 40px; } } .pxl-comments .pxl-comments__list .pxl-comments__item .children .pxl-comments__item { position: relative; } .pxl-comments .pxl-comments__list .pxl-comments__item .children .pxl-comments__item+.pxl-comments__item { margin-top: 24px; padding-top: 25px; } .pxl-comments .pxl-comments__reply { position: relative; display: flex; gap: 16px; align-items: start; margin-top: 23px; } .pxl-comments .pxl-comments__reply-cancel { width: 28px; height: 28px; position: absolute; border-radius: 50%; cursor: pointer; transition: all 0.3s ease; background-color: #fff; top: 0; right: 0; transform: translateY(-110%); display: flex; justify-content: end; align-items: center; } .pxl-comments .pxl-comments__reply-cancel svg { transition: all 0.3s ease; width: 40%; height: 40%; transform: translate(0.5px, 0.5px); } .pxl-comments .pxl-comments__reply-cancel:hover { border-color: var(--secondary-color); } .pxl-comments .pxl-comments__reply-cancel:hover svg { fill: var(--secondary-color); } .pxl-comments .pxl-comments__reply-img { border-radius: 50%; overflow: hidden; margin-top: 1px; } .pxl-comments .pxl-comments__reply-img img { width: 40px; } .pxl-comments .pxl-comments__reply-form { position: relative; width: 100%; } .pxl-comments .pxl-comments__reply-form input { height: 42px; border: 1px solid #d5d7da; padding: 9px 4px 9px 16px; border-radius: 8px; } .pxl-comments .pxl-comments__reply-form button { position: absolute; bottom: 15px; right: 10px; width: 40px; height: 40px; background-color: var(--primary-color); padding: 10px; display: flex; justify-content: center; align-items: center; } .pxl-comments .pxl-comments__reply-form button svg { fill: #fff; height: 32px; } .pxl-comments .comment-respond { padding-top: 65px; position: relative; } .pxl-comments .comment-respond input, .pxl-comments .comment-respond textarea { padding: 13px 16px; } @media screen and (max-width: 575px) { .pxl-comments .comment-respond { padding-top: 33px; } } .pxl-comments .comment-respond::before { content: ""; background: linear-gradient(90deg, rgba(102, 102, 102, 0.00) 0%, rgba(102, 102, 102, 0.13) 25%, rgba(102, 102, 102, 0.16) 50%, rgba(102, 102, 102, 0.13) 75%, rgba(102, 102, 102, 0.00) 100%); width: 100%; height: 1px; display: block; position: absolute; top: 0; left: 0; } .pxl-comments .comment-respond .comment-reply-title { font-size: 32px; line-height: 1.2; letter-spacing: -1.28px; display: inline-flex; gap: 7px; margin-bottom: 24px; } .pxl-comments .comment-respond .comment-reply-title::before { content: ""; height: 32px; width: 32px; background: url('../img/memo.png') no-repeat center / 100%; display: block; } @media screen and (max-width: 575px) { .pxl-comments .comment-respond .comment-reply-title { font-size: 20px; margin-bottom: 12px; } .pxl-comments .comment-respond .comment-reply-title::before { width: 20px; height: 20px; } } .pxl-comments .comment-respond .comment-notes { color: var(--primary-color); margin-bottom: 40px; } @media screen and (max-width: 575px) { .pxl-comments .comment-respond .comment-notes { margin-bottom: 20px; } } .pxl-comments .comment-respond label { font-weight: 500; color: var(--primary-color); } .pxl-comments .comment-respond .comment-form__input-wrap { display: flex; justify-content: center; gap: 16px; } .pxl-comments .comment-respond .comment-form__input-wrap .comment-form__author, .pxl-comments .comment-respond .comment-form__input-wrap .comment-form__email { width: 100%; display: flex; gap: 7px; flex-direction: column; } @media screen and (max-width: 575px) { .pxl-comments .comment-respond .comment-form__input-wrap { flex-direction: column; } } .pxl-comments .comment-respond .comment-form__comment { margin-top: 23px; display: flex; gap: 7px; flex-direction: column; } .pxl-comments .comment-respond .comment-form__comment textarea { height: 195px; } .pxl-comments .comment-respond .form-submit { position: absolute; bottom: 17px; right: 17px; margin-bottom: 0; border-radius: 8px; } .pxl-comments .comment-respond .form-submit button { font-size: 16px; } @media screen and (max-width: 575px) { .pxl-comments .comment-respond .form-submit button { font-size: 14px; padding: 8px 12px; } } .comment-form-cookies-consent { display: none; } body.rtl input[type="text"], body.rtl input[type="email"], body.rtl input[type="url"], body.rtl input[type="password"], body.rtl input[type="search"], body.rtl input[type="tel"], body.rtl input[type="number"], body.rtl input[type="range"], body.rtl input[type="date"], body.rtl input[type="month"], body.rtl input[type="week"], body.rtl input[type="time"], body.rtl input[type="datetime"], body.rtl input[type="datetime-local"], body.rtl input[type="color"], body.rtl textarea, body.rtl select, body.rtl .pxl-select-higthlight, body.rtl .nice-select, body.rtl .wpcf7 input[type="url"], body.rtl .wpcf7 input[type="email"], body.rtl .wpcf7 input[type="tel"] { direction: rtl; } body.rtl .pxl-select .pxl-select-higthlight::before { right: auto; left: 8px; } .pxl-mailchimp { position: relative; } .pxl-mailchimp__style-default form { position: relative; } .pxl-mailchimp__style-default .mc4wp-form-fields { position: relative; } .pxl-mailchimp__style-default .mc4wp-form-fields input:not([type="submit"]) { border-radius: 50px; background: #2f3e4e; color: #fff; border: none; outline: none; height: 54px; } .pxl-mailchimp__style-default .mc4wp-form-fields input:not([type="submit"])::placeholder { color: #717680; } @media screen and (max-width: 575px) { .pxl-mailchimp__style-default .mc4wp-form-fields input:not([type="submit"]) { height: 40px; padding: 8px 16px; } } .pxl-mailchimp__style-default .mc4wp-form-fields input[type="submit"] { padding: 12px 24px; color: #fff; background-color: var(--primary-color); font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -0.32px; border: none; outline: none; border-radius: 50px; position: absolute; top: 4px; bottom: 4px; right: 4px; cursor: pointer; transition: all 0.3s ease; } @media screen and (max-width: 575px) { .pxl-mailchimp__style-default .mc4wp-form-fields input[type="submit"] { padding: 8px 16px; font-size: 14px; } } .pxl-mailchimp__style-default .mc4wp-form-fields input[type="submit"]:hover { color: var(--primary-color); background-color: #fff; } .pxl-mailchimp__style-default .mc4wp-response { position: absolute; bottom: 0; left: 50%; transform: translate(-50%, 120%); width: 100%; } .pxl-mailchimp__style-default .mc4wp-response .mc4wp-alert { position: absolute; background-color: #fff; border-radius: 50px; padding: 6px 20px; width: 100%; } .pxl-mailchimp__style-default .mc4wp-response .mc4wp-alert p { margin: 0; text-align: center; color: red; } .pxl-cf7 .wpcf7 form .wpcf7-response-output { margin-left: 0; margin-right: 0; } .pxl-cf7__btn-auto .wpcf7-submit { width: auto !important; } .pxl-cf7__btn-full .wpcf7-submit { width: 100% !important; } .pxl-cf7 .wpcf7-spinner { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .pxl-cf7 .row { margin-left: -8px; margin-right: -8px; } .pxl-cf7 .row [class*="col-"] { position: relative; padding: 0 8px; } .pxl-cf7 .row [class*="col-"]:not(:last-child) { margin-bottom: 24px; } .pxl-cf7 .row [class*="col-"] label { color: var(--primary-color); font-weight: 500; } .pxl-cf7 .row [class*="col-"] label+.wpcf7-form-control-wrap input, .pxl-cf7 .row [class*="col-"] label+.wpcf7-form-control-wrap select, .pxl-cf7 .row [class*="col-"] label+.wpcf7-form-control-wrap .pxl-select, .pxl-cf7 .row [class*="col-"] label+.wpcf7-form-control-wrap textarea, .pxl-cf7 .row [class*="col-"] label+.wpcf7-form-control-wrap>.iti--allow-dropdown { margin-top: 6px; } .pxl-cf7__btn-full button { width: 100%; justify-content: center; } .pxl-cf7__wrap { position: relative; } .pxl-cf7__icon { position: absolute; top: 0px; left: 16px; width: 16px; height: 16px; z-index: 1; } .pxl-cf7__button-right .wpcf7-form-wrap { position: relative; height: 100%; } .pxl-cf7__button-right .wpcf7-form-wrap .wpcf7-not-valid-tip { position: absolute; margin-top: 5px; } .pxl-cf7__button-right .wpcf7-form-wrap button { position: absolute; padding: 7px 16px; border-radius: 30px; background-color: #132436; position: absolute; right: 4px; top: 50%; line-height: 0; transform: translateY(-50%); display: flex; justify-content: center; align-items: center; gap: 6px; font-size: 16px; } @media screen and (max-width: 575px) { .pxl-cf7__button-right .wpcf7-form-wrap button { right: 0; font-size: 14px; font-size: 0; gap: 0; } } .pxl-cf7__button-left .wpcf7-form-wrap { position: relative; height: 100%; } .pxl-cf7__button-left .wpcf7-form-wrap .wpcf7-not-valid-tip { position: absolute; margin-top: 5px; } .pxl-cf7__button-left .wpcf7-form-wrap button { position: absolute; padding: 7px 16px; border-radius: 30px; background-color: #132436; position: absolute; left: 4px; top: 50%; line-height: 0; transform: translateY(-50%); display: flex; justify-content: center; align-items: center; gap: 6px; font-size: 16px; } @media screen and (max-width: 575px) { .pxl-cf7__button-left .wpcf7-form-wrap button { right: 0; font-size: 14px; font-size: 0; gap: 0; } } .pxl-cf7__button-gradient { --gradient-color-1: #957efc; --gradient-color-2: #deb1ff; --gradient-color-3: #f7f7fb; } .pxl-cf7__button-gradient .wpcf7-submit { background: linear-gradient(90deg, var(--gradient-color-1) 0%, var(--gradient-color-2) 50%, var(--gradient-color-3) 100%); transition: all 0.3s ease; } .pxl-cf7__phone>div { margin-top: 7px; } .pxl-cf7__upload { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; } .pxl-cf7__input-file { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; } .pxl-cf7__input-file .wpcf7-form-control-wrap { display: none; } .pxl-cf7__input-file label[for="upload-file"] { padding: 13px 16px; border-radius: 8px; background-color: #f5f5f5; display: flex; align-items: center; gap: 6px; border: 1px solid #d5d7da; cursor: pointer; transition: all 0.3s ease; } .pxl-cf7__input-file label[for="upload-file"] span { color: var(--third-color); font-weight: 400; transition: all 0.3s ease; } .pxl-cf7__input-file label[for="upload-file"] svg path { transition: all 0.3s ease; } .pxl-cf7__input-file label[for="upload-file"]:hover { background-color: var(--primary-color); } .pxl-cf7__input-file label[for="upload-file"]:hover svg path { stroke: #fff; } .pxl-cf7__input-file label[for="upload-file"]:hover span { color: #fff; } .pxl-cf7__input-file>span { font-size: 14px; font-weight: 400; line-height: 1.3; letter-spacing: -0.28px; font-style: italic; } .pxl-cf7__style-1 { padding: 40px; background-color: #f8f9fc; border: 1px solid #d5d7da; -webkit-border-radius: 16px; -khtml-border-radius: 16px; -moz-border-radius: 16px; -ms-border-radius: 16px; -o-border-radius: 16px; border-radius: 16px; } @media screen and (max-width: 767px) { .pxl-cf7__style-1 { padding: 20px; } } .pxl-cf7__style-1 .wpcf7-form-control-wrap { display: block; height: 100%; max-height: 150px; } .pxl-cf7__style-1 .pxl-cf7__wrap.container { padding: 0; } .pxl-cf7__style-1 .pxl-cf7__wrap.container .wpcf7-not-valid-tip { margin: 5px 0; } .pxl-cf7__style-1 input, .pxl-cf7__style-1 textarea { padding: 13px 16px; } .pxl-cf7__style-1 input::placeholder, .pxl-cf7__style-1 textarea::placeholder { color: #a4a7ae; } .pxl-cf7__style-1 textarea { max-height: 144px; min-width: 100%; transition: all 0.3s ease; } .pxl-cf7__style-1 textarea.wpcf7-not-valid { max-height: 125px; } .pxl-cf7__style-1 .pxl-select-higthlight { padding: 13px 16px; } .pxl-cf7__style-1 .wpcf7-submit { padding: 13px 16px; height: 48px; border-radius: 8px; font-size: 16px; font-weight: 500; } @media screen and (max-width: 767px) { .pxl-cf7__style-1 .wpcf7-submit { height: 40px; font-size: 14px; } } .pxl-cf7__career.pxl-cf7__wrap.container { padding: 0; } .pxl-cf7__career.pxl-cf7__wrap.container input, .pxl-cf7__career.pxl-cf7__wrap.container textarea { padding: 13px 16px; } .pxl-cf7__career.pxl-cf7__wrap.container input.wpcf7-submit, .pxl-cf7__career.pxl-cf7__wrap.container textarea.wpcf7-submit { padding: 13px 16px; border-radius: 8px; font-size: 16px; font-weight: 500; position: relative; cursor: pointer; } .pxl-cf7__career.pxl-cf7__wrap.container input::placeholder, .pxl-cf7__career.pxl-cf7__wrap.container textarea::placeholder { color: #a4a7ae; } .pxl-cf7__career.pxl-cf7__wrap.container textarea { height: 144px; } .pxl-cf7__career.pxl-cf7__wrap.container .row .input-filled { height: 100%; display: block; } .pxl-cf7__career.pxl-cf7__wrap.container .row .input-filled.pxl-cf7__upload { display: flex; } .pxl-cf7__career.pxl-cf7__wrap.container .row .input-filled .iti--allow-dropdown { width: 100%; } .pxl-cf7__career.pxl-cf7__wrap.container .row .input-filled label+input { margin-top: 7px; } .pxl-cf7__career.pxl-cf7__wrap.container .row .input-filled label+textarea { margin-top: 7px; } .pxl-cf7__career.pxl-cf7__wrap.container .row .input-filled button.wpcf7-submit { padding: 13px 16px; border-radius: 8px; font-size: 16px; font-weight: 500; transition: all 0.3s ease; } .pxl-cf7__career.pxl-cf7__wrap.container .row .input-filled.pxl-cf7__mess { margin-bottom: 19px; } .pxl-cf7__style-2 input, .pxl-cf7__style-2 textarea { border-radius: 0; padding: 0px 0px 17px; color: #fff; background-color: transparent; border: none; outline: none; border-bottom: 1px solid #717680; } .pxl-cf7__style-2 input::placeholder, .pxl-cf7__style-2 textarea::placeholder { color: #fff; } .pxl-cf7__style-2 input:hover, .pxl-cf7__style-2 textarea:hover, .pxl-cf7__style-2 input:focus, .pxl-cf7__style-2 textarea:focus { border-color: #f3ff4b; color: #fff; } .pxl-cf7__style-2 .wpcf7-submit[type="submit"]:not(.btn) { padding: 13px 20px; width: 100%; background-color: #f3ff4b; color: #0a0d12; font-weight: 500; line-height: 1.35; } .comment-loading { margin-top: 10px; font-style: italic; color: #777; } .comment-error { margin-top: 10px; color: #d32f2f; font-size: 14px; } .reload-comments { display: block; margin-top: 5px; padding: 5px 10px; background: #f0f0f0; border: 1px solid #ddd; border-radius: 3px; cursor: pointer; } .pxl-comments__reply-fields { display: flex; gap: 10px; margin-bottom: 10px; } @media screen and (max-width: 575px) { .pxl-comments__reply-fields { flex-direction: column; } } .pxl-comments__reply-fields input { flex: 1; min-width: 0; } .pxl-notification { position: fixed; top: 20px; right: 20px; padding: 10px 15px; border-radius: 4px; color: #fff; font-size: 14px; z-index: 9999; display: none; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); } .pxl-notification--success { background: #4caf50; } .pxl-notification--error { background: #f44336; } .pxl-comment__remove { cursor: pointer; } .pxl-comment__hide { cursor: pointer; } .pxl-banner-box__link { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; } .pxl-banner-box__style-1, .pxl-banner-box__style-2, .pxl-banner-box__style-3, .pxl-banner-box__style-4, .pxl-banner-box__style-5 { background-color: #fff; -webkit-border-radius: 16px; -khtml-border-radius: 16px; -moz-border-radius: 16px; -ms-border-radius: 16px; -o-border-radius: 16px; border-radius: 16px; position: relative; height: 100%; display: flex; flex-direction: column; justify-content: space-between; padding: 40px; min-height: 490px; } @media screen and (max-width: 575px) { .pxl-banner-box__style-1, .pxl-banner-box__style-2, .pxl-banner-box__style-3, .pxl-banner-box__style-4, .pxl-banner-box__style-5 { padding: 24px; min-height: 420px; } } .pxl-banner-box__style-1:before, .pxl-banner-box__style-2:before, .pxl-banner-box__style-3:before, .pxl-banner-box__style-4:before, .pxl-banner-box__style-5:before { content: ''; background: linear-gradient(299deg, rgba(173, 157, 255, 0.88) 0%, rgba(158, 229, 255, 0.88) 49.19%, rgba(220, 160, 255, 0.88) 98.39%); filter: blur(28px); width: calc(100% - 28px); height: calc(100% - 28px); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-border-radius: 16px; -khtml-border-radius: 16px; -moz-border-radius: 16px; -ms-border-radius: 16px; -o-border-radius: 16px; border-radius: 16px; z-index: -1; } .pxl-banner-box__style-1 .pxl-banner-box__title, .pxl-banner-box__style-2 .pxl-banner-box__title, .pxl-banner-box__style-3 .pxl-banner-box__title, .pxl-banner-box__style-4 .pxl-banner-box__title, .pxl-banner-box__style-5 .pxl-banner-box__title { margin-top: 30px; } .pxl-banner-box__style-1 .pxl-banner-box__desc, .pxl-banner-box__style-2 .pxl-banner-box__desc, .pxl-banner-box__style-3 .pxl-banner-box__desc, .pxl-banner-box__style-4 .pxl-banner-box__desc, .pxl-banner-box__style-5 .pxl-banner-box__desc { margin-bottom: 0; max-width: 382px; } .pxl-banner-box__style-1 { border-radius: 16px; } .pxl-banner-box__style-1 .pxl-banner-box__wrap-icon { display: flex; flex-direction: column; justify-content: center; align-items: center; position: relative; padding-top: 25px; } .pxl-banner-box__style-1 .pxl-banner-box__wrap-icon>svg #path-1 { animation: twinkle 1.2s ease-in-out 0.2s infinite; -webkit-animation: twinkle 1.2s ease-in-out 0.2s infinite; will-change: opacity; } .pxl-banner-box__style-1 .pxl-banner-box__wrap-icon>svg #path-2 { animation: twinkle 1.2s ease-in-out 0.4s infinite; -webkit-animation: twinkle 1.2s ease-in-out 0.4s infinite; will-change: opacity; } .pxl-banner-box__style-1 .pxl-banner-box__wrap-icon>svg #path-3 { animation: twinkle 1.2s ease-in-out 0.6s infinite; -webkit-animation: twinkle 1.2s ease-in-out 0.6s infinite; will-change: opacity; } .pxl-banner-box__style-1 .pxl-banner-box__wrap-feature { z-index: 1; position: relative; background-color: #fff; } .pxl-banner-box__style-1 .pxl-banner-box__wrap-feature::before { content: ""; position: absolute; left: 16px; right: 16px; bottom: -16px; border-radius: 12px; background: #fff; height: 82px; box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); z-index: 0; } .pxl-banner-box__style-1 .pxl-banner-box__wrap-feature::after { content: ""; position: absolute; left: 32px; right: 32px; bottom: -32px; border-radius: 12px; background: #fff; height: 82px; box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); z-index: -1; } .pxl-banner-box__style-1 .pxl-banner-box__wrap-feature .pxl-banner-box__icon { position: absolute; left: 50%; top: 0%; transform: translate(-50%, -50%); width: 72px; height: 72px; background: linear-gradient(234deg, #7c63fd -0.18%, #52369c 100%); -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; display: flex; justify-content: center; align-items: center; border: 8px solid #e9eaeb; z-index: 2; } .pxl-banner-box__style-1 .pxl-banner-box__wrap-feature .pxl-banner-box__feature { display: flex; padding: 48px 12px 20px; border-radius: 12px; gap: 8px; flex-flow: row wrap; justify-content: center; box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); margin-top: -70px; position: relative; background-color: #fff; z-index: 1; } .pxl-banner-box__style-1 .pxl-banner-box__wrap-feature .pxl-banner-box__feature-item { padding: 5px 8px; border-radius: 99px; display: flex; justify-content: center; align-items: center; gap: 4px; background-color: #f5f5f5; line-height: 1; } .pxl-banner-box__style-1 .pxl-banner-box__wrap-feature .pxl-banner-box__feature-icon { display: flex; justify-content: center; align-items: center; } .pxl-banner-box__style-1 .pxl-banner-box__wrap-feature .pxl-banner-box__feature-text { font-size: 12px; font-style: normal; font-weight: 400; line-height: 120%; letter-spacing: -0.24px; } .pxl-banner-box__style-2 .pxl-banner-box__wrap-top { position: relative; min-height: 280px; } .pxl-banner-box__style-2 .pxl-banner-box__wrap-top .pxl-banner-box__feature { padding: 16px 16px 24px; -webkit-border-radius: 12px; -khtml-border-radius: 12px; -moz-border-radius: 12px; -ms-border-radius: 12px; -o-border-radius: 12px; border-radius: 12px; background: #fff; box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); max-width: 288px; z-index: 1; position: relative; } .pxl-banner-box__style-2 .pxl-banner-box__wrap-top .pxl-banner-box__feature-type { display: inline-flex; padding: 3px 6px; align-items: center; gap: 4px; -webkit-border-radius: 99px; -khtml-border-radius: 99px; -moz-border-radius: 99px; -ms-border-radius: 99px; -o-border-radius: 99px; border-radius: 99px; background-color: var(--secondary-color); margin: 0 5px 16px; position: relative; } .pxl-banner-box__style-2 .pxl-banner-box__wrap-top .pxl-banner-box__feature-type span { color: #fff; font-size: 10px; font-style: normal; font-weight: 500; line-height: 140%; letter-spacing: -0.2px; } .pxl-banner-box__style-2 .pxl-banner-box__wrap-top .pxl-banner-box__feature-type .pxl-banner-box__connect-text { position: absolute; bottom: -45px; left: -6px; } .pxl-banner-box__style-2 .pxl-banner-box__wrap-top .pxl-banner-box__feature-text { color: var(--primary-color); font-family: Inter; font-size: 12px; font-style: normal; font-weight: 400; line-height: 150%; letter-spacing: -0.24px; padding: 0 0 0 10px; margin-bottom: 16px; } .pxl-banner-box__style-2 .pxl-banner-box__wrap-top .pxl-banner-box__feature-text em { color: var(--secondary-color); font-family: Inter; font-size: 12px; font-style: normal; font-weight: 400; line-height: 150%; letter-spacing: -0.24px; position: relative; } .pxl-banner-box__style-2 .pxl-banner-box__wrap-top .pxl-banner-box__feature-text em::before { content: ''; width: 2px; height: 100%; -webkit-border-radius: 5px; -khtml-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; background-color: var(--secondary-color); left: -6px; position: absolute; z-index: 1; height: 19px; } .pxl-banner-box__style-2 .pxl-banner-box__wrap-top .pxl-banner-box__feature-text em::after { content: ''; width: calc(100% + 8px); height: 100%; background: linear-gradient(to right, rgba(105, 56, 239, 0.2) 0%, rgba(105, 56, 239, 0.06) 100%); left: -6px; position: absolute; height: 19px; } .pxl-banner-box__style-2 .pxl-banner-box__wrap-top .pxl-banner-box__feature-lazyload { width: 100%; display: flex; flex-direction: column; gap: 10px; } .pxl-banner-box__style-2 .pxl-banner-box__wrap-top .pxl-banner-box__feature-lazyload span { width: 100%; height: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -o-border-radius: 10px; border-radius: 10px; background: linear-gradient(90deg, #ededed 0%, #fafafa 100%); background-size: 200% 100%; animation: gradientShift 3s ease-in-out infinite alternate; } .pxl-banner-box__style-2 .pxl-banner-box__wrap-top .pxl-banner-box__feature-lazyload span:last-child { max-width: 141px; } .pxl-banner-box__style-2 .pxl-banner-box__wrap-top .pxl-banner-box__chart { display: inline-flex; padding: 12px; flex-direction: column; align-items: flex-start; gap: 6px; border-radius: 12px; background: #fff; box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); width: 100%; max-width: 156px; position: relative; z-index: 1; float: right; margin-top: -100px; } .pxl-banner-box__style-2 .pxl-banner-box__wrap-top .pxl-banner-box__chart-sub { color: #535862; font-size: 8px; font-style: normal; font-weight: 500; line-height: 120%; letter-spacing: -0.16px; } .pxl-banner-box__style-2 .pxl-banner-box__wrap-top .pxl-banner-box__chart-number { color: var(--primary-color); font-size: 24px; font-style: normal; font-weight: 500; line-height: 125%; letter-spacing: -0.96px; } .pxl-banner-box__style-2 .pxl-banner-box__wrap-top .pxl-banner-box__chart-object { max-width: 132px; } .pxl-banner-box__style-2 .pxl-banner-box__wrap-top .pxl-banner-box__bg { position: absolute; top: 39px; left: 41px; } .pxl-banner-box__style-3 .svg-right-custom { position: absolute; right: 0; z-index: -1; } .pxl-banner-box__style-3 .pxl-banner-box__top { position: relative; padding: 40px 0 58px 0; } .pxl-banner-box__style-3 .pxl-banner-box__top-wrap { display: flex; position: relative; z-index: 1; } .pxl-banner-box__style-3 .pxl-banner-box__top-icon { display: flex; width: 40px; height: 40px; justify-content: center; align-items: center; gap: 12.562px; flex-shrink: 0; aspect-ratio: 1/1; border-radius: 207.281px; background: var(--secondary-color); } .pxl-banner-box__style-3 .pxl-banner-box__top-feature { margin: -8px 18px 0 20px; display: flex; padding: 12px; flex-direction: column; gap: 10px; border-radius: 16px; background: #fff; box-shadow: 0px 6.292px 25.167px 0px rgba(24, 29, 39, 0.12); list-style: none; } .pxl-banner-box__style-3 .pxl-banner-box__top-feature .pxl-banner-box__feature-item { display: flex; padding: 6px 10px; align-items: center; gap: 11.306px; align-self: stretch; border-radius: 10px; background-color: #fff; position: relative; transition: all 0.3s ease; } .pxl-banner-box__style-3 .pxl-banner-box__top-feature .pxl-banner-box__feature-item__icon { display: flex; justify-content: center; align-items: center; transition: all 0.3s ease; } .pxl-banner-box__style-3 .pxl-banner-box__top-feature .pxl-banner-box__feature-item__text { color: var(--primary-color); font-weight: 500; transition: all 0.3s ease; } .pxl-banner-box__style-3 .pxl-banner-box__top-feature .pxl-banner-box__feature-item__mouse { position: absolute; right: 10px; top: 10px; transform: translate(100%, -100%); opacity: 0; visibility: hidden; transition: all 0.3s ease; } .pxl-banner-box__style-3 .pxl-banner-box__top-feature .pxl-banner-box__feature-item.active { background: #ebe9fe; } .pxl-banner-box__style-3 .pxl-banner-box__top-feature .pxl-banner-box__feature-item.active .pxl-banner-box__feature-item__icon svg path { stroke: var(--secondary-color); } .pxl-banner-box__style-3 .pxl-banner-box__top-feature .pxl-banner-box__feature-item.active .pxl-banner-box__feature-item__text { color: var(--secondary-color); } .pxl-banner-box__style-3 .pxl-banner-box__top-feature .pxl-banner-box__feature-item.active .pxl-banner-box__feature-item__mouse { opacity: 1; visibility: visible; } .pxl-banner-box__style-3 .pxl-banner-box__top-lazyload { margin-top: -92px; width: 100%; display: flex; flex-direction: column; } .pxl-banner-box__style-3 .pxl-banner-box__top-lazyload>span:first-child { width: 100%; max-width: 275px; height: 32px; border-radius: 50px; background: #ebe9fe; } .pxl-banner-box__style-3 .pxl-banner-box__top-lazyload .group-laziload { margin-top: 24px; display: flex; flex-direction: column; gap: 12px; } .pxl-banner-box__style-3 .pxl-banner-box__top-lazyload .group-laziload span { width: 100%; background: linear-gradient(90deg, #e9eaeb 0%, #fff 100%); border-radius: 20px 0 0 20px; height: 18px; } .pxl-banner-box__style-3 .pxl-banner-box__top-lazyload .group-laziload span:last-child { max-width: 283px; } .pxl-banner-box__style-4 .pxl-banner-box__top { text-align: center; position: relative; } @media screen and (max-width: 575px) { .pxl-banner-box__style-4 .pxl-banner-box__top { display: flex; flex-direction: column-reverse; } } .pxl-banner-box__style-4 .pxl-banner-box__top>svg { width: 100%; } @media screen and (max-width: 575px) { .pxl-banner-box__style-4 .pxl-banner-box__top>svg { display: none; } } .pxl-banner-box__style-4 .pxl-banner-box__top-icon { background: linear-gradient(180deg, #9b8afb -24.58%, #f5f5f5 113.75%); box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); display: flex; width: 120px; height: 120px; padding: 16px; align-items: center; border-radius: 50%; } @media screen and (min-width: 576px) { .pxl-banner-box__style-4 .pxl-banner-box__top-icon { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } } @media screen and (max-width: 575px) { .pxl-banner-box__style-4 .pxl-banner-box__top-icon { margin: 0px auto 50px; } } .pxl-banner-box__style-4 .pxl-banner-box__top-icon svg { animation: shake-button-lightning 1.5s ease-in-out infinite; transform-origin: center; will-change: transform; } .pxl-banner-box__style-4 .pxl-banner-box__top-feature { list-style: none; padding: 0; margin: 0; width: 100%; height: 100%; } @media screen and (min-width: 576px) { .pxl-banner-box__style-4 .pxl-banner-box__top-feature { position: absolute; } } @media screen and (max-width: 575px) { .pxl-banner-box__style-4 .pxl-banner-box__top-feature { display: flex; gap: 8px; flex-flow: row wrap; justify-content: center; } } .pxl-banner-box__style-4 .pxl-banner-box__top-feature .pxl-banner-box__feature-item { display: flex; padding: 5px 8px; align-items: center; gap: 4px; border-radius: 99px; background: #fff; box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); line-height: 1; transform: scale(1); transition: all 0.3s ease; line-height: 1; } @media screen and (min-width: 576px) { .pxl-banner-box__style-4 .pxl-banner-box__top-feature .pxl-banner-box__feature-item { position: absolute; } .pxl-banner-box__style-4 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:first-child { top: 60px; left: 80px; } .pxl-banner-box__style-4 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:nth-child(2) { top: 40px; right: 80px; } .pxl-banner-box__style-4 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:nth-child(3) { top: 120px; left: 0px; } .pxl-banner-box__style-4 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:nth-child(4) { top: 120px; right: 0px; } .pxl-banner-box__style-4 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:nth-child(5) { top: 200px; left: 90px; } .pxl-banner-box__style-4 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:nth-child(6) { top: 220px; right: 80px; } .pxl-banner-box__style-4 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:nth-child(7) { top: 21px; left: 210px; } .pxl-banner-box__style-4 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:nth-child(8) { top: 240px; right: 210px; } .pxl-banner-box__style-4 .pxl-banner-box__top-feature .pxl-banner-box__feature-item.active { transform: scale(1.2); } } .pxl-banner-box__style-4 .pxl-banner-box__top-feature .pxl-banner-box__feature-item__text { font-size: 12px; font-style: normal; font-weight: 400; line-height: 1.2; letter-spacing: -0.24px; color: var(--primary-color); white-space: nowrap; } .pxl-banner-box__style-5 .pxl-banner-box__top { position: relative; } @media screen and (max-width: 1024px) { .pxl-banner-box__style-5 .pxl-banner-box__top { max-width: 550px; margin: 0 auto; } } .pxl-banner-box__style-5 .pxl-banner-box__top-feature { position: relative; margin-bottom: 0; } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item { display: flex; position: relative; } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item--line { position: absolute; } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item.active .pxl-banner-box__feature-item__text { color: #fff; background-color: var(--secondary-color); } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item.active .pxl-banner-box__feature-item__number { border-color: #d9d6fe; } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item__wrap { position: relative; } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item__number { position: absolute; left: 0; top: 50%; transform: translate(-50%, -50%); width: 26px; height: 26px; display: flex; justify-content: center; align-items: center; border: 3px solid #e9eaeb; color: var(--primary-color); font-size: 12px; font-weight: 700; line-height: 1.2; letter-spacing: -0.24px; border-radius: 50%; background-color: #fff; z-index: 1; transition: all 0.3s ease; } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item__text { min-width: 260px; letter-spacing: -0.24px; color: var(--primary-color); position: relative; text-align: center; z-index: 1; padding: 16px 16px 16px 21px; align-items: center; border-radius: 12px; background: #fff; box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); width: fit-content; max-width: 305px; transition: all 0.3s ease; } @media screen and (min-width: 576px) { .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item__text span { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; } } @media screen and (max-width: 575px) { .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item__text { min-width: 100%; } } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:nth-child(odd) { margin: 30px 56px 0 auto; justify-content: end; } @media screen and (min-width: 576px) { .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:nth-child(odd) .pxl-banner-box__feature-item--line { width: 300px; height: 91px; border-right: 1px solid #ddd; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; border-radius: 0 12px 12px 0px; top: 0%; right: 0; transform: translate(24px, 25px); overflow: hidden; } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:nth-child(odd) .pxl-banner-box__feature-item--line::before { content: ""; position: absolute; bottom: 1px; right: 1px; width: calc(100% - 1px); height: calc(100% - 1px); background: #fff; border-radius: 0 0 0 12px; } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:nth-child(odd) .pxl-banner-box__feature-item--line:after { content: ""; position: absolute; top: -100%; left: -100%; width: 300%; height: 300%; background-image: conic-gradient(transparent 0%, #7a5af8 10%, transparent 0%); border-radius: 0%; will-change: transform; animation: pxl_spin 10s infinite; z-index: -1; } } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:nth-child(even) { margin: 40px auto 0 24px; justify-content: flex-start; } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:nth-child(even) .pxl-banner-box__feature-item__number { right: 0; left: unset; transform: translate(50%, -50%); } @media screen and (min-width: 576px) { .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:nth-child(even) .pxl-banner-box__feature-item--line { width: 300px; height: 67px; border-left: 1px solid #ddd; border-bottom: 1px solid #ddd; border-radius: 0 0 0 12px; top: 0%; left: 0; transform: translate(33px, 38px); overflow: hidden; } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:nth-child(even) .pxl-banner-box__feature-item--line::before { content: ""; position: absolute; left: 1px; bottom: 1px; width: calc(100% - 1px); height: calc(100% - 1px); background: #fff; border-radius: 0 0 0 12px; } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:nth-child(even) .pxl-banner-box__feature-item--line:after { content: ""; position: absolute; top: -1px; left: -100%; width: 300%; height: 50%; background-image: conic-gradient(transparent 0%, #7a5af8 0%, transparent 40%); border-radius: 0%; will-change: transform; animation: pxl_spin_rev 10s infinite; animation-delay: 4s; z-index: -1; } } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:first-child { padding-top: 29px; margin-top: 0; } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:first-child::before { content: ""; width: 100%; height: 40px; background: linear-gradient(to top, rgba(255, 255, 255, 0) 0%, #fff 100%); position: absolute; top: 0; left: 0; z-index: 1; } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:first-child .pxl-banner-box__feature-item__text, .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:first-child .pxl-banner-box__feature-item__number { z-index: 2; } @media screen and (min-width: 576px) { .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:first-child .pxl-banner-box__feature-item--line-first { position: absolute; width: 62px; height: 46px; border-left: 1px solid #ddd; border-bottom: 1px solid #ddd; border-top: 1px solid transparent; border-right: 1px solid transparent; border-radius: 0 0 0 12px; top: 50%; left: 0; transform: translate(-100%, -100%); overflow: hidden; } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:first-child .pxl-banner-box__feature-item--line-first::before { content: ""; position: absolute; left: 1px; bottom: 1px; width: 100%; height: 100%; background: #fff; border-radius: 0 0 0 12px; } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:first-child .pxl-banner-box__feature-item--line-first:after { content: ""; position: absolute; top: -100%; left: -100%; width: 300%; height: 300%; background-image: conic-gradient(transparent 0%, #7a5af8 0%, transparent 20%); border-radius: 0%; will-change: transform; animation: pxl_spin_rev 5s infinite; z-index: -1; } } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:last-child { margin-top: 29px; } .pxl-banner-box__style-5 .pxl-banner-box__top-feature .pxl-banner-box__feature-item:last-child .pxl-banner-box__top-icon { position: absolute; right: 0; top: 50%; transform: translate(calc(100% + 16px), -50%); } .pxl-banner-box__style-6, .pxl-banner-box__style-7, .pxl-banner-box__style-8 { width: 100%; position: relative; display: flex; justify-content: center; align-items: center; overflow: hidden; } .pxl-banner-box__style-6 .pxl-banner-box__link, .pxl-banner-box__style-7 .pxl-banner-box__link, .pxl-banner-box__style-8 .pxl-banner-box__link { z-index: 4; position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .pxl-banner-box__style-6 .pxl-banner-box__image, .pxl-banner-box__style-7 .pxl-banner-box__image, .pxl-banner-box__style-8 .pxl-banner-box__image { position: relative; width: 100%; } .pxl-banner-box__style-6 .pxl-banner-box__meta, .pxl-banner-box__style-7 .pxl-banner-box__meta, .pxl-banner-box__style-8 .pxl-banner-box__meta { position: absolute; bottom: 0px; left: 0; right: 0; height: 160px; background: linear-gradient(180deg, rgba(253, 253, 253, 0.00) 0%, rgba(253, 253, 253, 0.88) 50%, #fdfdfd 100%); display: flex; justify-content: space-between; align-items: end; padding: 24px; z-index: 3; } .pxl-banner-box__style-6 .pxl-banner-box__meta .pxl-banner-box__title, .pxl-banner-box__style-7 .pxl-banner-box__meta .pxl-banner-box__title, .pxl-banner-box__style-8 .pxl-banner-box__meta .pxl-banner-box__title { color: #4e0d30; padding: 5px 16px; display: flex; gap: 6px; align-items: center; border-radius: 50px; background-color: #fce7f6; } .pxl-banner-box__style-6 .pxl-banner-box__meta .pxl-banner-box__title-icon, .pxl-banner-box__style-7 .pxl-banner-box__meta .pxl-banner-box__title-icon, .pxl-banner-box__style-8 .pxl-banner-box__meta .pxl-banner-box__title-icon { line-height: 1; } .pxl-banner-box__style-6 .pxl-banner-box__meta .pxl-banner-box__icon, .pxl-banner-box__style-7 .pxl-banner-box__meta .pxl-banner-box__icon, .pxl-banner-box__style-8 .pxl-banner-box__meta .pxl-banner-box__icon { display: flex; width: 32px; height: 32px; padding: 4px; flex-direction: column; justify-content: center; align-items: center; border-radius: 50%; border: 1px solid #d5d7da; transition: all 0.3s ease; } @media screen and (max-width: 767px) { .pxl-banner-box__style-6 .pxl-banner-box__meta, .pxl-banner-box__style-7 .pxl-banner-box__meta, .pxl-banner-box__style-8 .pxl-banner-box__meta { height: 80px; padding: 16px; } } .pxl-banner-box__style-6:hover .pxl-banner-box__icon, .pxl-banner-box__style-7:hover .pxl-banner-box__icon, .pxl-banner-box__style-8:hover .pxl-banner-box__icon { background-color: #2e90fa; border-color: #2e90fa; } .pxl-banner-box__style-6:hover .pxl-banner-box__icon svg path, .pxl-banner-box__style-7:hover .pxl-banner-box__icon svg path, .pxl-banner-box__style-8:hover .pxl-banner-box__icon svg path { fill: #fff; } .pxl-banner-box__style-6 { padding: 56px; } @media screen and (max-width: 767px) { .pxl-banner-box__style-6 { padding: 24px; } } @media screen and (max-width: 575px) { .pxl-banner-box__style-6 { padding: 15px; } } .pxl-banner-box__style-6 .pxl-banner-box__image { position: relative; width: 100%; aspect-ratio: 402 / 405; } .pxl-banner-box__style-6 .pxl-banner-box__image>div { bottom: 0; } .pxl-banner-box__style-6 .pxl-banner-box__image img { width: 100%; height: auto; display: block; box-shadow: 0px 4px 16px rgba(24, 29, 39, 0.12); border-radius: 6px; } .pxl-banner-box__style-6 .pxl-banner-box__image-1 { position: relative; aspect-ratio: 290/405; width: 71.6%; z-index: 2; } .pxl-banner-box__style-6 .pxl-banner-box__image-2 { position: absolute; left: 22.47%; aspect-ratio: 255/357; width: 62.96296%; z-index: 1; } .pxl-banner-box__style-6 .pxl-banner-box__image-3 { position: absolute; right: 0; aspect-ratio: 221/309; width: 54.5679%; } .pxl-banner-box__style-7 { padding: 0 64px; width: 100%; aspect-ratio: 766 / 517; } @media screen and (max-width: 767px) { .pxl-banner-box__style-7 { padding: 0 24px; } } @media screen and (max-width: 575px) { .pxl-banner-box__style-7 { padding: 0 15px; } } .pxl-banner-box__style-7 .pxl-banner-box__image { aspect-ratio: 640 / 489; } .pxl-banner-box__style-7 .pxl-banner-box__image img { width: 100%; height: auto; display: block; box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); border-radius: 6px; } .pxl-banner-box__style-7 .pxl-banner-box__image-1 { position: relative; top: 16.36%; left: 0; aspect-ratio: 427/409; width: 66.72%; z-index: 1; } .pxl-banner-box__style-7 .pxl-banner-box__image-2 { position: absolute; top: 0; right: 0; aspect-ratio: 312/337; width: 42.34375%; } .pxl-banner-box__style-7 .pxl-banner-box__image-2 img { border-radius: 0 0 6px 6px; } .pxl-banner-box__style-8 { padding: 80px 56px 0px; } @media screen and (max-width: 767px) { .pxl-banner-box__style-8 { padding: 0 24px; } } @media screen and (max-width: 575px) { .pxl-banner-box__style-8 { padding: 0 15px; } } .pxl-banner-box__style-8 .pxl-banner-box__image { width: 100%; max-height: 435px; } .pxl-banner-box__style-8 .pxl-banner-box__image img { border-radius: 6px; } @media screen and (max-width: 767px) { .pxl-banner-box__style-8 .pxl-banner-box__image { max-height: unset; } } .pxl-banner-box__style-8 .pxl-banner-box__meta { height: 220px; } @media screen and (max-width: 767px) { .pxl-banner-box__style-8 .pxl-banner-box__meta { height: 120px; } } .pxl-banner-box__style-9 { display: flex; flex-direction: column; gap: 24px; -webkit-border-radius: 16px; -khtml-border-radius: 16px; -moz-border-radius: 16px; -ms-border-radius: 16px; -o-border-radius: 16px; border-radius: 16px; border: 1px solid #d5d7da; background: #f8f9fc; padding: 8px; transition: all 0.3s ease; } .pxl-banner-box__style-9 .pxl-banner-box__top { -webkit-border-radius: 12px; -khtml-border-radius: 12px; -moz-border-radius: 12px; -ms-border-radius: 12px; -o-border-radius: 12px; border-radius: 12px; border: 1px solid #d5d7da; background: #fff; padding: 24px; } .pxl-banner-box__style-9 .pxl-banner-box__top .pxl-banner-box__title { color: var(--primary-color); margin-bottom: 17px; } .pxl-banner-box__style-9 .pxl-banner-box__top .pxl-banner-box__title svg { margin-bottom: -2px; } .pxl-banner-box__style-9 .pxl-banner-box__top .pxl-banner-box__desc { margin: 0; } .pxl-banner-box__style-9 .pxl-banner-box_button { padding: 0 16px 16px; transition: all 0.3s ease; } .pxl-banner-box__style-9 .pxl-banner-box_button svg { transition: all 0.3s ease; margin: 0 0 -1px 2px; } .pxl-banner-box__style-9 .pxl-banner-box_button svg path { transition: all 0.3s ease; } .pxl-banner-box__style-9:hover { background-color: var(--secondary-color); } .pxl-banner-box__style-9:hover .pxl-banner-box_button { color: #fff; } .pxl-banner-box__style-9:hover .pxl-banner-box_button svg { transform: translateX(50%); } .pxl-banner-box__style-9:hover .pxl-banner-box_button svg path { stroke: #fff; } .pxl-counter .pxl-counter__number { display: inline-flex; flex-wrap: wrap; align-items: center; } .pxl-counter--style-default .pxl-counter__number { color: var(--primary-color); letter-spacing: 0; } .pxl-counter--style-liquid-glass { --color-gradient-0: #ed64f0; --color-gradient-1: #e5496a; --color-gradient-2: #c44a92; --color-gradient-3: #9049cd; --color-gradient-4: #6b49f6; --color-gradient-5: #6248ff; display: flex; } .pxl-counter--style-liquid-glass .pxl-counter__holder { position: relative; width: 84px; height: 84px; border-radius: 138px; border: 3px solid rgba(255, 255, 255, 0.88); animation: shake-button 10s linear infinite; } .pxl-counter--style-liquid-glass .pxl-counter__holder::before { content: ''; background: linear-gradient(89deg, #fff 0%, var(--color-gradient-0) 100%); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; border-radius: 138px; } .pxl-counter--style-liquid-glass .pxl-counter__holder::after { content: ''; position: absolute; top: -1px; left: -1px; border-radius: 99px; background-blend-mode: screen, screen, color-burn; box-shadow: 23px 32px 13px -34px #fff inset, -23px -30px 21px -34px #fff inset, 4px 4px 2px -4px rgba(255, 255, 255, 0.2) inset, 0px 0px 44px 0px rgba(255, 255, 255, 0.2) inset; backdrop-filter: blur(20px); z-index: 2; height: calc(100% + 2px); width: calc(100% + 2px); z-index: 2; } .pxl-counter--style-liquid-glass .pxl-counter__number { position: absolute; z-index: 3; top: 50%; flex-wrap: nowrap; left: 50%; transform: translate(-50%, -50%); text-align: center; font-family: Inter; font-size: 32px; font-style: normal; font-weight: 600; line-height: 1.2; letter-spacing: -0.88px; background: linear-gradient(89deg, var(--color-gradient-1) 0.48%, var(--color-gradient-2) 27.38%, var(--color-gradient-3) 51.79%, var(--color-gradient-4) 75.69%, var(--color-gradient-5) 99.52%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .pxl-counter--style-gradient { --gradient-color-1: #e5496a; --gradient-color-2: #c44a92; --gradient-color-3: #9049cd; --gradient-color-4: #6b49f6; --gradient-color-5: #6248ff; } .pxl-counter--style-gradient .pxl-counter__number { background: linear-gradient(89deg, var(--gradient-color-1) 0.48%, var(--gradient-color-2) 27.38%, var(--gradient-color-3) 51.79%, var(--gradient-color-4) 75.69%, var(--gradient-color-5) 99.52%); font-size: 240px; font-weight: 500; line-height: 110%; background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; letter-spacing: 0px; } .pxl-counter--style-gradient-3-color { --gradient-color-1: #957efc; --gradient-color-2: #deb1ff; --gradient-color-3: #f7f7fb; } .pxl-counter--style-gradient-3-color .pxl-counter__number { background: linear-gradient(91deg, var(--gradient-color-1) -1.38%, var(--gradient-color-2) 69.51%, var(--gradient-color-3) 101.01%); font-size: 80px; font-weight: 400; line-height: 100%; letter-spacing: -4px; background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .pxl-icon-box { position: relative; } .pxl-icon-box .pxl-icon-box__layout-2 rect, .pxl-icon-box .pxl-icon-box--layout-3 rect { will-change: transform; } .pxl-icon-box__layout-1.pxl-icon-box__inline-title .pxl-icon-box__icon { position: absolute; left: 0; top: 0; } .pxl-icon-box__layout-1.pxl-icon-box__inline-title .pxl-icon-box__title { margin-left: 50px; } .pxl-icon-box__layout-1.pxl-icon-box__center .pxl-icon-box__icon { margin-left: auto; margin-right: auto; } .pxl-icon-box__layout-1.pxl-icon-box__center .pxl-icon-box__title, .pxl-icon-box__layout-1.pxl-icon-box__center .pxl-icon-box__desc { text-align: center; } .pxl-icon-box__layout-1.pxl-icon-box__right .pxl-icon-box__icon { margin-left: auto; } .pxl-icon-box__layout-1.pxl-icon-box__right .pxl-icon-box__title, .pxl-icon-box__layout-1.pxl-icon-box__right .pxl-icon-box__desc { text-align: right; } .pxl-icon-box__layout-1.pxl-icon-box__bg-blur { border-radius: 16px; border: 1px solid #a4a7ae; background: rgba(255, 255, 255, 0.08); backdrop-filter: blur(8px); padding: 40px 24px; } .pxl-icon-box__layout-1 .pxl-icon-box__icon { width: 48px; height: 48px; -webkit-border-radius: 8px; -khtml-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; border-radius: 8px; display: flex; justify-content: center; align-items: center; margin-bottom: 24px; } .pxl-icon-box__layout-1 .pxl-icon-box__icon-gradient { width: 56px; height: 56px; position: relative; } .pxl-icon-box__layout-1 .pxl-icon-box__icon-gradient::before { content: ''; border-radius: 16px; background: linear-gradient(180deg, #f5d2ff -31.8%, #851adc 100%); backdrop-filter: blur(3.85185px); position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 1; } .pxl-icon-box__layout-1 .pxl-icon-box__icon-gradient::after { content: ''; border-radius: 16px; border: 6px solid rgba(255, 255, 255, 0.32); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; } .pxl-icon-box__layout-1 .pxl-icon-box__icon-gradient svg, .pxl-icon-box__layout-1 .pxl-icon-box__icon-gradient i, .pxl-icon-box__layout-1 .pxl-icon-box__icon-gradient img { position: relative; z-index: 3; } .pxl-icon-box__layout-1 .pxl-icon-box__icon-liquid-glass { width: 80px; height: 80px; position: relative; margin: 0; } @media screen and (max-width: 575px) { .pxl-icon-box__layout-1 .pxl-icon-box__icon-liquid-glass { width: 48px; height: 48px; } } .pxl-icon-box__layout-1 .pxl-icon-box__icon-liquid-glass svg { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1; } @media screen and (max-width: 575px) { .pxl-icon-box__layout-1 .pxl-icon-box__icon-liquid-glass svg { width: 24px; height: 24px; } } .pxl-icon-box__layout-1 .pxl-icon-box__icon-liquid-glass:after { content: ''; position: absolute; top: -1px; left: -1px; border-radius: 99px; background-blend-mode: screen, screen, color-burn; box-shadow: 23px 32px 13px -34px #fff inset, -23px -30px 21px -34px #fff inset, 4px 4px 2px -4px rgba(255, 255, 255, 0.2) inset, 0px 0px 44px 0px rgba(255, 255, 255, 0.2) inset; backdrop-filter: blur(20px); z-index: 0; height: calc(100% + 2px); width: calc(100% + 2px); } .pxl-icon-box__layout-1.pxl-icon-box__hover-shadow { padding: 24px; border-radius: 12px; background: #fff; box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0); transition: all 0.3s ease; height: 100%; } @media screen and (max-width: 1200px) { .pxl-icon-box__layout-1.pxl-icon-box__hover-shadow { padding: 16px; box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); } } .pxl-icon-box__layout-1.pxl-icon-box__hover-shadow .pxl-icon-box__icon { margin-bottom: 24px; border-radius: 50%; background-color: #f5f5f5; width: 48px; height: 48px; padding: 8px 9px; display: flex; justify-content: center; } .pxl-icon-box__layout-1.pxl-icon-box__hover-shadow .pxl-icon-box__title { margin-bottom: 16px; font-size: 18px; font-weight: 600; line-height: 1.35; letter-spacing: -0.36px; color: #181d27; } .pxl-icon-box__layout-1.pxl-icon-box__hover-shadow .pxl-icon-box__desc { margin-bottom: 0; font-size: 16px; font-weight: 400; line-height: 1.35; letter-spacing: -0.32px; color: #181d27; } .pxl-icon-box__layout-1.pxl-icon-box__hover-shadow:hover { box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); } .pxl-icon-box__layout-1 .pxl-icon-box__title { font-size: 20px; line-height: 1.2; letter-spacing: -0.8px; color: #181d27; margin-bottom: 16px; } .pxl-icon-box__layout-1 .pxl-icon-box__desc { color: var(--third-color); margin-bottom: 0; } .pxl-icon-box__layout-1.pxl-icon-box__icon-left { display: flex; align-items: center; } .pxl-icon-box__layout-1.pxl-icon-box__icon-right { display: flex; flex-direction: row-reverse; align-items: center; } .pxl-icon-box__layout-2 { position: relative; min-height: 331px; } @media screen and (max-width: 1200px) { .pxl-icon-box__layout-2>svg { display: none; } } .pxl-icon-box__layout-2 .pxl-icon-box__feature { position: absolute; margin: 0; padding: 0; list-style: none; width: 430px; top: 0; left: 0; } @media screen and (max-width: 1200px) { .pxl-icon-box__layout-2 .pxl-icon-box__feature { position: unset; display: flex; gap: 8px; justify-content: center; flex-flow: row wrap; width: 100%; } } .pxl-icon-box__layout-2 .pxl-icon-box__feature-item { padding: 4px 16px 4px 4px; display: flex; justify-content: center; align-items: center; position: relative; background-color: #fff; width: fit-content; border-radius: 50px; position: absolute; box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); gap: 8px; } @media screen and (max-width: 1200px) { .pxl-icon-box__layout-2 .pxl-icon-box__feature-item { position: relative; } } .pxl-icon-box__layout-2 .pxl-icon-box__feature-item:hover { border: 1.5px solid #e9eaeb; box-shadow: none; } .pxl-icon-box__layout-2 .pxl-icon-box__feature-item:hover::before { content: ""; position: absolute; border-radius: 999px; background: linear-gradient(299deg, rgba(173, 157, 255, 0.88) 0%, rgba(158, 229, 255, 0.88) 49.19%, rgba(220, 160, 255, 0.88) 98.39%); filter: blur(6px); top: 0%; left: 0%; width: 100%; height: 100%; z-index: -1; } @media screen and (min-width: 1201px) { .pxl-icon-box__layout-2 .pxl-icon-box__feature-item:first-child { top: -20px; left: 150px; } .pxl-icon-box__layout-2 .pxl-icon-box__feature-item:nth-child(2) { top: 82px; left: -10px; } .pxl-icon-box__layout-2 .pxl-icon-box__feature-item:nth-child(3) { top: 187px; left: 180px; } .pxl-icon-box__layout-2 .pxl-icon-box__feature-item:nth-child(4) { top: 82px; left: 190px; } .pxl-icon-box__layout-2 .pxl-icon-box__feature-item:nth-child(5) { top: -23px; left: -40px; } .pxl-icon-box__layout-2 .pxl-icon-box__feature-item:nth-child(6) { top: 187px; left: -30px; } .pxl-icon-box__layout-2 .pxl-icon-box__feature-item:nth-child(7) { top: 80px; left: 400px; } } .pxl-icon-box__layout-2 .pxl-icon-box__feature-icon { width: 40px; height: 40px; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; padding: 8px 9px; display: flex; justify-content: center; align-items: center; background-color: #f5f5f5; } .pxl-icon-box__layout-2 .pxl-icon-box__feature-text { font-size: 14px; font-weight: 500; line-height: 1.3; letter-spacing: -0.28px; color: var(--primary-color); } .pxl-icon-box__layout-2 .pxl-icon-box__logo { position: absolute; left: 51%; top: 32%; transform: translate(-50%, -50%); } @media screen and (max-width: 1200px) { .pxl-icon-box__layout-2 .pxl-icon-box__logo { position: relative; transform: unset; left: unset; top: unset; text-align: center; margin: 50px 0; } .pxl-icon-box__layout-2 .pxl-icon-box__logo::before { content: ''; position: absolute; top: 0; left: 50%; transform: translate(-50%, -100%); width: 2px; height: 50px; display: block; border: 1px dashed #ddd; } .pxl-icon-box__layout-2 .pxl-icon-box__logo::after { content: ''; position: absolute; bottom: 0; left: 50%; transform: translate(-50%, 100%); width: 2px; height: 50px; display: block; border: 1px dashed #ddd; } } .pxl-icon-box__layout-2 .pxl-icon-box__demo { position: absolute; right: -10px; top: -46px; } @media screen and (max-width: 1200px) { .pxl-icon-box__layout-2 .pxl-icon-box__demo { position: relative; top: unset; right: unset; width: fit-content; margin: 0 auto; } } .pxl-icon-box__layout-2 .pxl-icon-box__demo>div:before { content: ''; background: linear-gradient(45deg, #ad9dff, #9ee5ff 50%, #dca0ff); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; z-index: -1; border-radius: 16px; opacity: 0.88; filter: blur(12px); } .pxl-icon-box__layout-2 .pxl-icon-box__demo-main { max-width: 373px; width: 100%; display: block; margin: 15px 46px 0 0; position: relative; } .pxl-icon-box__layout-2 .pxl-icon-box__demo-sub { max-width: 274px; width: 100%; display: block; margin: 0 auto; position: absolute; top: -33px; right: 16px; z-index: -1; } .pxl-icon-box--layout-3 { position: relative; } .pxl-icon-box--layout-3>svg { width: 100%; height: 100%; } @media screen and (max-width: 575px) { .pxl-icon-box--layout-3>svg { display: none; } } .pxl-icon-box--layout-3 .pxl-icon-box__feature-list { position: absolute; width: 100%; height: 100%; list-style: none; margin: 0; padding: 0; } @media screen and (max-width: 575px) { .pxl-icon-box--layout-3 .pxl-icon-box__feature-list { position: relative; display: flex; gap: 10px; } } .pxl-icon-box--layout-3 .pxl-icon-box__feature-item { position: absolute; width: 56px; height: 56px; -webkit-border-radius: 50%; -khtml-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; box-sizing: border-box; border: 8px solid #fff; background-color: #f5f5f5; display: flex; justify-content: center; align-items: center; box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); } .pxl-icon-box--layout-3 .pxl-icon-box__feature-item:first-child { top: -20px; } .pxl-icon-box--layout-3 .pxl-icon-box__feature-item:nth-child(2) { top: 58px; } .pxl-icon-box--layout-3 .pxl-icon-box__feature-item:nth-child(3) { top: 50%; transform: translateY(-50%); } .pxl-icon-box--layout-3 .pxl-icon-box__feature-item:nth-child(4) { bottom: 62px; } .pxl-icon-box--layout-3 .pxl-icon-box__feature-item:last-child { bottom: -16px; } @media screen and (max-width: 575px) { .pxl-icon-box--layout-3 .pxl-icon-box__feature-item { position: relative; top: unset !important; left: unset !important; right: unset !important; bottom: unset !important; transform: unset !important; width: 40px; height: 40px; } } .pxl-icon-box--layout-3.pxl-icon-box__align-left .pxl-icon-box__feature-list { top: 0; left: 0; } .pxl-icon-box--layout-3.pxl-icon-box__align-left .pxl-icon-box__feature-list .pxl-icon-box__feature-item:first-child { top: -24px; left: 88px; } .pxl-icon-box--layout-3.pxl-icon-box__align-left .pxl-icon-box__feature-list .pxl-icon-box__feature-item:nth-child(2) { top: 62px; left: 172px; } .pxl-icon-box--layout-3.pxl-icon-box__align-left .pxl-icon-box__feature-list .pxl-icon-box__feature-item:nth-child(3) { top: 50%; left: 57px; transform: translateY(-50%); } .pxl-icon-box--layout-3.pxl-icon-box__align-left .pxl-icon-box__feature-list .pxl-icon-box__feature-item:nth-child(4) { left: 213px; bottom: 102px; } .pxl-icon-box--layout-3.pxl-icon-box__align-left .pxl-icon-box__feature-list .pxl-icon-box__feature-item:last-child { left: 112px; bottom: -16px; } .pxl-icon-box--layout-3.pxl-icon-box__align-right>svg { transform: scaleX(-1); } .pxl-icon-box--layout-3.pxl-icon-box__align-right .pxl-icon-box__feature-list { top: 0; right: 0; } .pxl-icon-box--layout-3.pxl-icon-box__align-right .pxl-icon-box__feature-list .pxl-icon-box__feature-item:first-child { top: -24px; right: 100px; } .pxl-icon-box--layout-3.pxl-icon-box__align-right .pxl-icon-box__feature-list .pxl-icon-box__feature-item:nth-child(2) { top: 98px; right: 218px; } .pxl-icon-box--layout-3.pxl-icon-box__align-right .pxl-icon-box__feature-list .pxl-icon-box__feature-item:nth-child(3) { top: 50%; right: 57px; transform: translateY(-50%); } .pxl-icon-box--layout-3.pxl-icon-box__align-right .pxl-icon-box__feature-list .pxl-icon-box__feature-item:nth-child(4) { bottom: 65px; right: 152px; } .pxl-icon-box--layout-3.pxl-icon-box__align-right .pxl-icon-box__feature-list .pxl-icon-box__feature-item:last-child { bottom: -16px; right: 112px; } .pxl-icon-box-carousel { margin: -30px; } .pxl-icon-box-carousel .pxl-swiper-container { padding: 30px; margin: 0 -8px; } .pxl-icon-box-carousel .pxl-swiper-container .pxl-swiper-slider__item { opacity: 0; transition: all 0.3s ease; } .pxl-icon-box-carousel .pxl-swiper-container .pxl-swiper-slider__item.swiper-slide-visible { opacity: 1; } .pxl-icon-box-carousel .pxl-icon-box__item { padding: 0 8px; } .pxl-icon-box-carousel .pxl-icon-box__item-inner { box-shadow: 0px 4px 16px 0px rgba(24, 29, 39, 0.12); background-color: #fff; border-radius: 16px; border-radius: 24px; padding: 12px; display: flex; flex-direction: column; align-items: center; justify-content: space-between; min-height: 384px; } .pxl-icon-box-carousel .pxl-icon-box__item-content { display: flex; flex-direction: column; gap: 16px; padding: 12px; } .pxl-icon-box-carousel .pxl-icon-box__item-icon { width: 48px; height: 48px; border-radius: 50%; background-color: #ff5aaf; display: flex; justify-content: center; align-items: center; } .pxl-icon-box-carousel .pxl-icon-box__item-icon svg { width: 24px; height: 24px; } .pxl-icon-box-carousel .pxl-icon-box__item-icon i { font-size: 24px; } .pxl-icon-box-carousel .pxl-icon-box__item-title { color: #132436; } .pxl-icon-box-carousel .pxl-icon-box__item-button { width: 100%; } .pxl-icon-box-carousel .pxl-icon-box__item-button a { width: 100%; border-radius: 44px; background: #e9eaeb; padding: 4px 4px 4px 16px; display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 16px; font-weight: 500; line-height: 1.35; letter-spacing: -0.32px; color: #132436; transition: all 0.3s ease; } .pxl-icon-box-carousel .pxl-icon-box__item-button a:hover { background: #132436; color: #fff; } .pxl-icon-box-carousel .pxl-icon-box__item-button span { padding: 7px 16px; border-radius: 50px; background: #fff; display: flex; justify-content: center; align-items: center; } .pxl-icon-box-carousel .pxl-icon-box__item-button span svg { width: 18px; height: 18px; } .pxl-icon__users { display: flex; gap: 10px; cursor: pointer; } .pxl-icon__users-left { align-items: center; } .pxl-icon__users-center { flex-direction: column; justify-content: center; align-items: center; } .pxl-icon__users-right { flex-direction: row-reverse; align-items: center; } .pxl-icon__users .pxl-hasnt-login { display: flex; align-items: center; } .pxl-icon__users .pxl-hasnt-login .btn-user { font-size: 16px; font-weight: 500; line-height: 1.35; padding: 9px 16px; } .pxl-icon__users .pxl-hasnt-login .btn-user__sign-in { color: var(--primary-color); } .pxl-icon__users .pxl-hasnt-login .btn-user__sign-up { color: #fff; background-color: var(--secondary-color); -webkit-border-radius: 8px; -khtml-border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -o-border-radius: 8px; border-radius: 8px; border: 2px solid #e9eaeb; } .pxl-icon__users .pxl-hasnt-login .btn-user__sign-up:hover, .pxl-icon__users .pxl-hasnt-login .btn-user__sign-up:focus { background-color: var(--primary-color); } .pxl-icon__users i { color: var(--secondary-color); font-size: 20px; -webkit-transition: all 300ms ease; -khtml-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; } .pxl-icon__users i:hover, .pxl-icon__users i:active, .pxl-icon__users i:focus { color: var(--primary-color); } .pxl-icon__users span { -webkit-transition: all 300ms ease; -khtml-transition: all 300ms ease; -moz-transition: all 300ms ease; -ms-transition: all 300ms ease; -o-transition: all 300ms ease; transition: all 300ms ease; } @media screen and (max-width: 1600px) { .pxl-icon__users.pxl-yes { font-size: 0; } .pxl-icon__users.pxl-yes .pxl-has-login { display: none; font-size: 0 !important; } } .pxl-icon__users.pxl-yes .pxl-hasnt-login { position: relative; } .pxl-icon__users.pxl-yes .pxl-hasnt-login:before { content: "\f007"; font-family: "Font Awesome 5 Pro"; color: var(--primary-color); font-size: 18px; font-weight: 400; line-height: 80px; display: none; } @media screen and (max-width: 1600px) { .pxl-icon__users.pxl-yes .pxl-hasnt-login:before { display: block; } .pxl-icon__users.pxl-yes .pxl-hasnt-login .pxl-not-login { position: absolute; padding: 20px 30px; bottom: -50px; left: 0; background-color: #fff; opacity: 0; visibility: hidden; display: flex; flex-direction: row; flex-wrap: nowrap; -webkit-transition: all 0.3s ease; -khtml-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; transform: translate(-50%, 10px); -webkit-box-shadow: 0 1px 72px 0 rgba(0, 0, 0, 0.08); -khtml-box-shadow: 0 1px 72px 0 rgba(0, 0, 0, 0.08); -moz-box-shadow: 0 1px 72px 0 rgba(0, 0, 0, 0.08); -ms-box-shadow: 0 1px 72px 0 rgba(0, 0, 0, 0.08); -o-box-shadow: 0 1px 72px 0 rgba(0, 0, 0, 0.08); box-shadow: 0 1px 72px 0 rgba(0, 0, 0, 0.08); } .pxl-icon__users.pxl-yes .pxl-hasnt-login .pxl-not-login a:first-child { margin-right: 5px; font-size: 16px !important; } .pxl-icon__users.pxl-yes .pxl-hasnt-login .pxl-not-login span { font-size: 16px !important; } .pxl-icon__users.pxl-yes .pxl-hasnt-login .pxl-not-login a:last-child { margin-left: 5px; font-size: 16px !important; } .pxl-icon__users.pxl-yes .pxl-hasnt-login:hover .pxl-not-login { opacity: 1; visibility: visible; transform: translate(-50%, 0); } } .pxl-user .pxl-user-inner { max-width: 430px; margin: auto; } .pxl-user .pxl-user-holder { background-color: #fff; -webkit-border-radius: 5px; -khtml-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; position: relative; overflow: hidden; -webkit-box-shadow: 0 4px 18px rgba(0, 0, 0, 0.06); -khtml-box-shadow: 0 4px 18px rgba(0, 0, 0, 0.06); -moz-box-shadow: 0 4px 18px rgba(0, 0, 0, 0.06); -ms-box-shadow: 0 4px 18px rgba(0, 0, 0, 0.06); -o-box-shadow: 0 4px 18px rgba(0, 0, 0, 0.06); box-shadow: 0 4px 18px rgba(0, 0, 0, 0.06); } .pxl-user .pxl-user-meta { padding: 30px; } .pxl-user .pxl-user-title { text-align: center; margin-bottom: 32px; font-size: 22px; text-transform: capitalize; } .pxl-user .pxl-user-bottom { border-top: 1px solid #efefef; padding: 18px 30px; background-color: #f8f8f8; text-align: center; font-size: 15px; -webkit-border-radius: 0 0 5px 5px; -khtml-border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px; -ms-border-radius: 0 0 5px 5px; -o-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px; } .pxl-user .pxl-user-bottom a { text-decoration: underline; } .pxl-user .pxl-user-form .field-group { position: relative; margin-bottom: 15px; } .pxl-user .pxl-user-form .field-group:last-child { margin-bottom: 0; } .pxl-user .pxl-user-form .button { width: 100%; line-height: 45px; border-radius: 0px; margin-top: 10px; height: 45px !important; font-size: 14px; font-weight: 600; max-width: 200px; justify-content: center; } .pxl-user .pxl-user-form input { border-radius: 0; padding-left: 75px; background-color: #fff !important; border-color: #e9e9e9; } .pxl-user .pxl-user-form input:hover, .pxl-user .pxl-user-form input:active, .pxl-user .pxl-user-form input:focus { border-color: var(--primary-color) !important; } .pxl-user .pxl-user-form i { width: 55px; height: 32px; font-size: 16px; color: var(--primary-color); text-align: center; line-height: 32px; position: absolute; top: 50%; left: 0; border-right: 1px solid #efefef; -webkit-transform: translate(0, -50%); -khtml-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); font-weight: 900; font-style: normal; } .pxl-user .pxl-user-form span { color: #fff; background-color: rgba(255, 0, 0, 0.8); display: inline-block; -webkit-border-radius: 3px; -khtml-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; font-size: 10px; line-height: 18px; padding: 0 8px; position: absolute; top: 50%; -webkit-transform: translate(0, -50%); -khtml-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); right: 10px; } .pxl-user .pxl-user-footer { padding: 25px 15px 0 15px; text-align: center; } .pxl-user .pxl-user-footer a { text-decoration: underline; margin-left: 8px; } .pxl-user .pxl-user-form-profile { text-align: center; } .pxl-user .pxl-user-form-profile .user-avatar img { border: 1px solid #ebebeb; padding: 5px; } .pxl-user .pxl-user-form-profile .user-name { font-size: 15px; font-weight: 500; margin-top: 8px; margin-bottom: 18px; } .pxl-user .zmdi:before { font-family: "Font Awesome 5 Free"; } .pxl-user .zmdi-account:before { content: "\f007"; } .pxl-user .zmdi-lock:before { content: "\f023"; } .pxl-user .zmdi-email:before { content: "\f0e0"; } .logged-in .pxl-user .pxl-user-bottom, .logged-in .pxl-user .pxl-user-title { display: none; } .pxl-user-popup { background-color: rgba(9, 29, 62, 0.85); visibility: hidden; } .pxl-user-popup.open { visibility: visible; } .pxl-user-popup .pxl-user .pxl-user-content { max-width: 400px; margin: auto; background-color: #fff; border-radius: 5px; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .12); -khtml-box-shadow: 0 0 10px rgba(0, 0, 0, .12); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, .12); -ms-box-shadow: 0 0 10px rgba(0, 0, 0, .12); -o-box-shadow: 0 0 10px rgba(0, 0, 0, .12); box-shadow: 0 0 10px rgba(0, 0, 0, .12); padding: 50px; } @media screen and (max-width: 767px) { .pxl-user-popup .pxl-user .pxl-user-content { padding-left: 20px; padding-right: 20px; padding-bottom: 24px; } } .pxl-user-popup .pxl-user .pxl-user-content .pxl-user-heading { font-weight: 500; line-height: 1.1; font-size: 28px; text-align: center; margin-bottom: 30px; letter-spacing: -0.56px; } .pxl-user-popup .pxl-user .pxl-user-content .pxl-user-desc { margin-bottom: 30px !important; color: #9b9b9b; } .pxl-user-popup .pxl-user .pxl-user-footer { padding-top: 15px; } .pxl-user-popup .pxl-user .pxl-user-footer a { font-weight: 500; color: var(--secondary-color) !important; text-decoration: none; } .pxl-user-popup .pxl-user .pxl-user-footer a:hover { color: var(--primary-color); text-decoration: underline; } .pxl-user-popup .pxl-user .pxl-user-footer span { color: #9b9b9b; } .pxl-user-popup .pxl-user .pxl-user-forgot-pass { text-align: center; margin-top: 8px; } .pxl-user-popup .pxl-user .pxl-user-forgot-pass a { color: var(--secondary-color); font-weight: 500; } .pxl-user-popup .pxl-user .pxl-user-forgot-pass a:hover { color: var(--primary-color); text-decoration: underline; } .pxl-user-popup .pxl-user.u-close { display: none; } .pxl-user-account { list-style: none; position: absolute; top: 57px; background-color: #fff; min-width: 180px; margin-top: 35px; padding: 20px; text-align: left; box-shadow: 0 7px 20px rgba(0, 0, 0, .15); -webkit-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1); -khtml-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1); -moz-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1); -ms-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1); -o-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1); transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1); visibility: hidden; opacity: 0; z-index: 999; } .pxl-user-account a { font-size: 14px !important; font-weight: 500; color: var(--primary-color) !important; display: block !important; line-height: normal !important; padding: 5px 0 !important; background-color: transparent !important; text-transform: capitalize; } .pxl-user-account a:hover { padding-left: 5px !important; color: var(--secondary-color) !important; } .pxl-user-account.active { margin-top: 17px; opacity: 1; visibility: visible; } .pxl-icon-close { border: 9px solid transparent; width: 36px; height: 36px; display: inline-flex; justify-content: center; align-items: center; position: relative; cursor: pointer; } .pxl-icon-close:before, .pxl-icon-close:after { content: ''; position: absolute; height: 2px; width: 100%; top: 50%; left: 0; margin-top: -1px; background-color: #444; transform-origin: 50% 50%; opacity: 1; -webkit-transition: transform ease 0.25s; -khtml-transition: transform ease 0.25s; -moz-transition: transform ease 0.25s; -ms-transition: transform ease 0.25s; -o-transition: transform ease 0.25s; transition: transform ease 0.25s; } .pxl-icon-close:before { -webkit-transform: rotate(45deg); -khtml-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .pxl-icon-close:after { -webkit-transform: rotate(-45deg); -khtml-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } .pxl-icon-close:hover:before, .pxl-icon-close:hover:after { background-color: var(--primary-color); -webkit-transform: rotate(0deg); -khtml-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } .pxl-modal { position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 9999; -webkit-transition: 0.4s cubic-bezier(0.24, 0.74, 0.58, 1); -khtml-transition: 0.4s cubic-bezier(0.24, 0.74, 0.58, 1); -moz-transition: 0.4s cubic-bezier(0.24, 0.74, 0.58, 1); -ms-transition: 0.4s cubic-bezier(0.24, 0.74, 0.58, 1); -o-transition: 0.4s cubic-bezier(0.24, 0.74, 0.58, 1); transition: 0.4s cubic-bezier(0.24, 0.74, 0.58, 1); -webkit-transform: translateY(-100%); -khtml-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); opacity: 0; } .pxl-modal .pxl-modal-close { position: absolute; top: 0; right: 0; border-radius: 0px; -webkit-transition: 0.4s cubic-bezier(0.24, 0.74, 0.58, 1); -khtml-transition: 0.4s cubic-bezier(0.24, 0.74, 0.58, 1); -moz-transition: 0.4s cubic-bezier(0.24, 0.74, 0.58, 1); -ms-transition: 0.4s cubic-bezier(0.24, 0.74, 0.58, 1); -o-transition: 0.4s cubic-bezier(0.24, 0.74, 0.58, 1); transition: 0.4s cubic-bezier(0.24, 0.74, 0.58, 1); transition-delay: 500ms; -webkit-transition-delay: 500ms; -webkit-transform: scale(0); -khtml-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); opacity: 0; z-index: 9999; background-color: var(--primary-color); width: 40px; height: 40px; } .pxl-modal .pxl-modal-close .pxl-icon-close { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -khtml-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background-color: transparent; } .pxl-modal .pxl-modal-close .pxl-icon-close:before, .pxl-modal .pxl-modal-close .pxl-icon-close:after { background-color: rgba(255, 255, 255, 0.9); } .pxl-modal .pxl-modal-overlay { position: absolute; width: 100%; height: 100%; top: 0; right: 0; display: block; background-color: rgba(255, 255, 255, 0.95); } .pxl-modal .pxl-modal-content { position: fixed; width: 100%; max-width: 1200px; padding: 30px 15px; left: 50%; top: 50%; z-index: 3; -webkit-transform: translate(-50%, -50%); -khtml-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transition: 0.4s cubic-bezier(0.24, 0.74, 0.58, 1); -khtml-transition: 0.4s cubic-bezier(0.24, 0.74, 0.58, 1); -moz-transition: 0.4s cubic-bezier(0.24, 0.74, 0.58, 1); -ms-transition: 0.4s cubic-bezier(0.24, 0.74, 0.58, 1); -o-transition: 0.4s cubic-bezier(0.24, 0.74, 0.58, 1); transition: 0.4s cubic-bezier(0.24, 0.74, 0.58, 1); margin-top: 60px; transition-delay: 500ms; -webkit-transition-delay: 500ms; opacity: 0; } .pxl-modal.open { -webkit-transform: translateY(0%); -khtml-transform: translateY(0%); -moz-transform: translateY(0%); -ms-transform: translateY(0%); -o-transform: translateY(0%); transform: translateY(0%); opacity: 1; } .pxl-modal.open .pxl-modal-close { -webkit-transform: scale(1); -khtml-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 1; } .pxl-modal.open .pxl-modal-content { margin-top: 0; opacity: 1; } .pxl-modal.remove { -webkit-transform: translateY(-100%); -khtml-transform: translateY(-100%); -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -o-transform: translateY(-100%); transform: translateY(-100%); opacity: 0; transition-delay: 500ms; -webkit-transition-delay: 500ms; } .pxl-modal.remove .pxl-modal-content { margin-top: 60px; transition-delay: 0ms; -webkit-transition-delay: 0ms; } .pxl-modal.remove .pxl-modal-close { -webkit-transform: scale(0); -khtml-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); transition-delay: 0ms; -webkit-transition-delay: 0ms; } .pxl-modal.pxl-modal-search .pxl-modal-content { max-width: 680px; } .pxl-icon-close { border: 9px solid transparent; width: 36px; height: 36px; display: inline-flex; justify-content: center; align-items: center; position: relative; cursor: pointer; } .pxl-icon-close:before, .pxl-icon-close:after { content: ''; position: absolute; height: 2px; width: 100%; top: 50%; left: 0; margin-top: -1px; background-color: #444; transform-origin: 50% 50%; opacity: 1; -webkit-transition: transform ease 0.25s; -khtml-transition: transform ease 0.25s; -moz-transition: transform ease 0.25s; -ms-transition: transform ease 0.25s; -o-transition: transform ease 0.25s; transition: transform ease 0.25s; } .pxl-icon-close:before { -webkit-transform: rotate(45deg); -khtml-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .pxl-icon-close:after { -webkit-transform: rotate(-45deg); -khtml-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } .pxl-icon-close:hover:before, .pxl-icon-close:hover:after { background-color: var(--primary-color); -webkit-transform: rotate(0deg); -khtml-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } .pxl-user-form-login .login-form .fields-content .field-group { position: relative; } .pxl-user-form-login .login-form .fields-content .field-group .field-icon { position: absolute; width: 20px; z-index: 2; top: 13px; left: 17px; } .pxl-user-form-login .field-rememberme { position: relative; left: -3px; } .pxl-user-form-login .field-forgot-password { position: relative; left: 1px; display: none; } .pxl-user-form-login .field-footer-group button { text-transform: uppercase; } .pxl-user-form-login .field-footer-group button svg { display: none; } .field-group.field-footer-group { position: relative; display: flex; justify-content: center; } .pxl-user-register .pxl-user-content .pxl-user-form .pxl-user-form-register .register-form .fields-content .field-group { position: relative; } .pxl-user-register .pxl-user-content .pxl-user-form .pxl-user-form-register .register-form .fields-content .field-group .field-icon { position: absolute; width: 20px; z-index: 2; top: 13px; left: 17px; } .pxl-user-register .pxl-user-content .pxl-user-form .pxl-user-form-register .register-form .field-footer-group button { text-transform: uppercase; } .pxl-user-register .pxl-user-content .pxl-user-form .pxl-user-form-register .register-form .field-footer-group button svg { display: none; } .pxl-container-border { --border-color: #d5d7da; --border-dot-color: var(--secondary-color); position: absolute; top: 0; left: 0; right: 0; bottom: 0; } .pxl-container-border__item { position: absolute; overflow: hidden; } .pxl-container-border__item.pxl-container-border__item-top:after, .pxl-container-border__item.pxl-container-border__item-bottom:after { content: ''; position: absolute; top: 0; width: 64px; height: 2px; background: linear-gradient(90deg, var(--border-dot-color) -51.04%, #f7f8f8 100%); } .pxl-container-border__item.pxl-container-border__item-top:before, .pxl-container-border__item.pxl-container-border__item-bottom:before { content: ''; position: absolute; top: 0; width: 64px; height: 2px; background: linear-gradient(180deg, var(--border-dot-color) -51.04%, #f7f8f8 100%); } .pxl-container-border__item.pxl-container-border__item-left:before { content: ''; position: absolute; width: 2px; height: 200px; border-radius: 35px; background: linear-gradient(0deg, var(--border-dot-color) -51.04%, rgba(34, 34, 34, 0.00) 100%); } .pxl-container-border__item.pxl-container-border__item-right:before { content: ''; position: absolute; width: 2px; height: 200px; border-radius: 35px; background: linear-gradient(180deg, var(--border-dot-color) -51.04%, rgba(34, 34, 34, 0.00) 100%); } .pxl-container-border__item.pxl-container-border__item-top { top: 0; width: 100%; height: 2px; } .pxl-container-border__item.pxl-container-border__item-top::before { transform: scaleX(-1); left: 0; animation: line_running_top 10s infinite; will-change: left; } .pxl-container-border__item.pxl-container-border__item-top::after { transform: scaleX(-1); left: 0; animation: line_running_top 10s infinite; will-change: left; } .pxl-container-border__item.pxl-container-border__item-bottom { bottom: 0; width: 100%; height: 2px; } .pxl-container-border__item.pxl-container-border__item-bottom::before { right: 0; animation: line_running_bottom 10s infinite; will-change: right; } .pxl-container-border__item.pxl-container-border__item-bottom:after { right: 0; animation: line_running_bottom 10s infinite; will-change: right; } .pxl-container-border__item.pxl-container-border__item-left { left: 0; height: 100%; width: 1px; } .pxl-container-border__item.pxl-container-border__item-left::before { top: 0; animation: line_running_left 10s infinite; will-change: top; } .pxl-container-border__item.pxl-container-border__item-right { right: 0; height: 100%; width: 1px; } .pxl-container-border__item.pxl-container-border__item-right::before { animation: line_running_right 10s infinite; will-change: bottom; } .pxl-container-border__style-1 .pxl-container-border__item-top { background: url('../img/line-dashed.svg'); } .pxl-container-border__style-1 .pxl-container-border__item-bottom { background: url('../img/line-dashed.svg'); } .pxl-container-border__style-1 .pxl-container-border__item-left { border: 1px dashed var(--border-color); } .pxl-container-border__style-1 .pxl-container-border__item-right { border: 1px dashed var(--border-color); } .pxl-container-border__style-2 .pxl-container-border__item-top { background: linear-gradient(90deg, rgba(233, 234, 235, 0.00) 0%, var(--border-color) 50%, rgba(233, 234, 235, 0.00) 100%); } .pxl-container-border__style-2 .pxl-container-border__item-bottom { background: linear-gradient(90deg, rgba(233, 234, 235, 0.00) 0%, var(--border-color) 50%, rgba(233, 234, 235, 0.00) 100%); } .pxl-container-border__style-2 .pxl-container-border__item-left { background: linear-gradient(0deg, rgba(233, 234, 235, 0.00) 0%, var(--border-color) 50%, rgba(233, 234, 235, 0.00) 100%); } .pxl-container-border__style-2 .pxl-container-border__item-right { background: linear-gradient(180deg, rgba(233, 234, 235, 0.00) 0%, var(--border-color) 50%, rgba(233, 234, 235, 0.00) 100%); } .elementor-element { position: relative; } .elementor-element .pxl-container-overlay__item { position: absolute; z-index: 1; background-size: cover; } .elementor-element .pxl-container-overlay__item-top { width: 100%; height: 30%; top: 0; left: 0; } .elementor-element .pxl-container-overlay__item-left { width: 30%; height: 100%; top: 0; left: 0; } .elementor-element .pxl-container-overlay__item-right { width: 30%; height: 100%; top: 0; right: 0; } .elementor-element .pxl-container-overlay__item-bottom { width: 100%; height: 30%; bottom: 0; left: 0; } .elementor-element .pxl-container-overlay__item-full { width: 100%; height: 100%; top: 0; left: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0.96) 10.85%, rgba(0, 0, 0, 0.23) 63.74%, rgba(0, 0, 0, 0.96) 100%); } .elementor-element .pxl-container-overlay__item-full-light { width: 100%; height: 100%; top: 0; left: 0; background: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 10.85%, rgba(255, 255, 255, 0.23) 63.74%, rgba(255, 255, 255, 0.96) 100%); } .elementor-element .pxl-container-overlay__item-default.pxl-container-overlay__item-top { background: linear-gradient(180deg, #fdfdfd 0%, rgba(253, 253, 253, 0.00) 100%); } .elementor-element .pxl-container-overlay__item-default.pxl-container-overlay__item-left { background: linear-gradient(90deg, #fdfdfd 0%, rgba(253, 253, 253, 0.00) 100%); } .elementor-element .pxl-container-overlay__item-default.pxl-container-overlay__item-right { background: linear-gradient(270deg, #fdfdfd 0%, rgba(253, 253, 253, 0.00) 100%); } .elementor-element .pxl-container-overlay__item-default.pxl-container-overlay__item-bottom { background: linear-gradient(0deg, #fdfdfd 0%, rgba(253, 253, 253, 0.00) 100%); } .elementor-element .pxl-container-overlay__item-3d.pxl-container-overlay__item-top { background: url('../img/grid-3d-top.svg') no-repeat center / cover; background-position: center top; } .elementor-element .pxl-container-overlay__item-3d.pxl-container-overlay__item-left { background: url('../img/grid-3d-left.svg') no-repeat center / cover; } .elementor-element .pxl-container-overlay__item-3d.pxl-container-overlay__item-right { background: url('../img/grid-3d-right.svg') no-repeat center / cover; } .elementor-element .pxl-container-overlay__item-3d.pxl-container-overlay__item-bottom { background: url('../img/grid-3d-bottom.svg') no-repeat center / cover; background-position: center bottom; } @keyframes line_running_top { 0% { left: 0; } 100% { left: 100%; } } @keyframes line_running_bottom { 0% { right: 0; } 100% { right: 100%; } } @keyframes line_running_left { 0% { top: 0; } 100% { top: 100%; } } @keyframes line_running_right { 0% { bottom: 0%; } 100% { bottom: 100%; } } .pxl-line { position: absolute; border-radius: 6px; z-index: 2; } .pxl-line__top { top: 0; left: 0; width: 100%; height: 1px; background: linear-gradient(90deg, rgba(213, 215, 218, 0.00) 0%, #d5d7da 25%, #d5d7da 50%, #d5d7da 75%, rgba(213, 215, 218, 0.00) 100%); } .pxl-line__top.pxl-line__gr-df { background: linear-gradient(90deg, rgba(213, 215, 218, 0) 0%, #d5d7da 25%, #d5d7da 75%, rgba(213, 215, 218, 0) 100%); } .pxl-line__top.pxl-line__gr-rtl { background: linear-gradient(90deg, rgba(213, 215, 218, 0.00) 0%, #d5d7da 25%, #d5d7da 50%, #d5d7da 75%, rgba(213, 215, 218, 0.00) 100%); } .pxl-line__top.pxl-line__gr-rtl { background: linear-gradient(90deg, rgba(213, 215, 218, 0.00) 0%, #d5d7da 25%, #d5d7da 50%, #d5d7da 75%, rgba(213, 215, 218, 0.00) 100%); } .pxl-line__right { right: 0; top: 0; height: 100%; width: 1px; background: linear-gradient(0deg, rgba(213, 215, 218, 0.00) 0%, #d5d7da 25%, #d5d7da 50%, #d5d7da 75%, rgba(213, 215, 218, 0.00) 100%); } .pxl-line__right.pxl-line__gr-df { background: linear-gradient(0deg, rgba(213, 215, 218, 0) 0%, #d5d7da 25%, #d5d7da 75%, rgba(213, 215, 218, 0) 100%); } .pxl-line__right.pxl-line__gr-btt { background: linear-gradient(180deg, rgba(213, 215, 218, 0.00) 0%, #d5d7da 25%, #d5d7da 75%, #d5d7da 100%); } .pxl-line__right.pxl-line__gr-ttb { background: linear-gradient(180deg, #d5d7da 0%, #d5d7da 50%, rgba(213, 215, 218, 0) 100%); } .pxl-line__bottom { bottom: 0; left: 0; width: 100%; height: 1px; background: linear-gradient(90deg, rgba(213, 215, 218, 0.00) 0%, #d5d7da 25%, #d5d7da 50%, #d5d7da 75%, rgba(213, 215, 218, 0.00) 100%); } .pxl-line__bottom.pxl-line__gr-df { background: linear-gradient(90deg, rgba(213, 215, 218, 0) 0%, #d5d7da 25%, #d5d7da 75%, rgba(213, 215, 218, 0) 100%); } .pxl-line__bottom.pxl-line__gr-rtl { background: linear-gradient(90deg, rgba(213, 215, 218, 0.00) 0%, #d5d7da 25%, #d5d7da 50%, #d5d7da 75%, rgba(213, 215, 218, 0.00) 100%); } .pxl-line__bottom.pxl-line__gr-rtl { background: linear-gradient(90deg, rgba(213, 215, 218, 0.00) 0%, #d5d7da 25%, #d5d7da 50%, #d5d7da 75%, rgba(213, 215, 218, 0.00) 100%); } .pxl-line__left { top: 0; left: 0; height: 100%; width: 1px; background: linear-gradient(0deg, rgba(213, 215, 218, 0.00) 0%, #d5d7da 25%, #d5d7da 75%, rgba(213, 215, 218, 0) 100%); } .pxl-line__left.pxl-line__gr-df { background: linear-gradient(0deg, rgba(213, 215, 218, 0) 0%, #d5d7da 25%, #d5d7da 75%, rgba(213, 215, 218, 0) 100%); } .pxl-line__left.pxl-line__gr-btt { background: linear-gradient(0deg, #d5d7da 0%, #d5d7da 25%, #d5d7da 75%, rgba(213, 215, 218, 0) 100%); } .pxl-line__left.pxl-line__gr-ttb { background: linear-gradient(180deg, #d5d7da 0%, #d5d7da 50%, rgba(213, 215, 218, 0) 100%); } .pxl-line__vertical { position: absolute; left: 50%; margin-left: -0.5px; height: 100%; width: 1px; background: linear-gradient(180deg, rgba(213, 215, 218, 0.00) 0%, #d5d7da 25%, #d5d7da 50%, #d5d7da 75%, rgba(213, 215, 218, 0.00) 100%); } .pxl-line__horizontal { position: absolute; width: 100%; height: 1px; top: 50%; transform: translateY(-50%); background: linear-gradient(90deg, rgba(213, 215, 218, 0.00) 0%, #d5d7da 25%, #d5d7da 50%, #d5d7da 75%, rgba(213, 215, 218, 0.00) 100%); } @media (min-width: 1367px) { .pxl-line.pxl-hide-laptop { display: none; } } @media (min-width: 1025px) and (max-width: 1366px) { .pxl-line.pxl-hide-tablet-landscape { display: none; } } @media (min-width: 768px) and (max-width: 1024px) { .pxl-line.pxl-hide-tablet-portrait { display: none; } } @media (min-width: 576px) and (max-width: 767px) { .pxl-line.pxl-hide-mobile-landscape { display: none; } } @media (max-width: 575px) { .pxl-line.pxl-hide-mobile-portrait { display: none; } } .pxl-dot { position: absolute; width: 13px; height: 13px; border-radius: 13px; z-index: 1; background-color: var(--secondary-color); } .pxl-dot.pxl-dot__default .pxl-dot__top { position: absolute; top: 0; left: 0; transform: translate(-50%, -50%); } .pxl-dot.pxl-dot__default .pxl-dot__bottom { position: absolute; bottom: 0; right: 0; transform: translate(50%, 50%); } .pxl-dot.pxl-dot__default .pxl-dot__left { position: absolute; bottom: 0; left: 0; transform: translate(-50%, 50%); } .pxl-dot.pxl-dot__default .pxl-dot__right { position: absolute; top: 0; right: 0; transform: translate(50%, -50%); } .pxl-dot.pxl-dot__cut-corner { border-radius: 0; border: 2px solid #535862; background-color: transparent; } .pxl-dot.pxl-dot__cut-corner.pxl-dot__top { top: -2px; left: -2px; border-right: none; border-bottom: none; } .pxl-dot.pxl-dot__cut-corner.pxl-dot__bottom { bottom: -2px; right: -2px; border-left: none; border-top: none; } .pxl-dot.pxl-dot__cut-corner.pxl-dot__left { left: -2px; bottom: -2px; border-right: none; border-top: none; } .pxl-dot.pxl-dot__cut-corner.pxl-dot__right { top: -2px; right: -2px; border-left: none; border-bottom: none; } .pxl-container { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } .pxl-sticky-container { opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease; transform: translateY(-100%); height: 0; } .pxl-sticky-container.pxl-sticky-active { opacity: 1; visibility: visible; transform: translateY(0); height: auto; } .pxl-has-star-light { position: absolute; } .elementor-element>.pxl-star, .elementor-element>.pxl-light { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .add-active.elementor-element>.pxl-light { opacity: 0; transition: opacity 2s ease 1s; } .add-active.active.elementor-element>.pxl-light { opacity: 1; } .pxl-sticky-container { transition: top 0.3s ease, bottom 0.3s ease, left 0.3s ease, width 0.3s ease; will-change: top, bottom, left, width; } .hidden-button-buy .pxl-buy-now { display: none; } .custom-bg-2-shape-blue { position: relative; } .custom-bg-2-shape-blue:before { content: ""; width: 7.5%; height: 20%; display: block; border-radius: 368px; background: #c421ff; filter: blur(120px); top: 33%; left: 33%; transform: translate(-50%, -50%); z-index: -1; } .custom-bg-2-shape-blue:after { content: ""; display: block; width: 7.5%; height: 15%; border-radius: 368px; background: #00fbff; filter: blur(120px); bottom: 33%; right: 33%; position: absolute; transform: translate(50%, 50%); z-index: -1; } [data-scroll-effect="scroll-item-run"] { will-change: transform, opacity; transform-style: preserve-3d; overflow: hidden; } .scroll-item-run, .scroll-item-run-left-to-right, .scroll-item-run-right-to-left { transform: translateZ(0); backface-visibility: hidden; transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); } .e-con[data-scroll-effect="scroll-item-run"] { position: relative; } [data-scroll-effect="scroll-item-run"] .elementor-element { will-change: transform, opacity; } @media (max-width: 768px) { [data-scroll-effect="scroll-item-run"] { transform: none !important; opacity: 1 !important; } .disable-mobile-scroll-animation [data-scroll-effect="scroll-item-run"] { transform: none !important; opacity: 1 !important; } } @media (prefers-reduced-motion: reduce) { [data-scroll-effect="scroll-item-run"] { transform: none !important; opacity: 1 !important; transition: none !important; } } .scroll-animations-loading [data-scroll-effect="scroll-item-run"] { opacity: 0; } @media screen and (max-width: 1024px) { .pxl-sticky-inner-container { position: relative !important; top: unset !important; } } .custom-overlay-h8 .pxl-container-overlay__item-bottom { background: linear-gradient(0deg, #fff 0%, #fff 30%, rgba(0, 0, 0, 0.00) 100%) !important; } .scroll-item-zoom.zoomed { position: fixed !important; top: 0 !important; transform: scale(1) !important; transition: transform 1s ease !important; } .error404 #pxl-main { padding: 120px 0 0px; } .error404 .error-cnt { display: flex; justify-content: space-between; } @media screen and (max-width: 1024px) { .error404 .error-cnt { flex-direction: column; } } @media screen and (max-width: 767px) { .error404 .error-cnt { margin-bottom: 70px; } } .error404 .error-cnt__left { min-width: 514px; margin-right: -147px; z-index: 1; position: relative; padding-top: 56px; } @media screen and (max-width: 1024px) { .error404 .error-cnt__left { text-align: center; display: flex; justify-content: center; align-items: center; flex-direction: column; margin: 0; padding: 0; } } @media screen and (max-width: 767px) { .error404 .error-cnt__left { min-width: 100%; } } .error404 .error-cnt__left .error-cnt__slg { padding: 4px 16px 4px 4px; border: 1px solid #d5d7da; -webkit-border-radius: 50px; -khtml-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; border-radius: 50px; display: flex; justify-content: start; gap: 8px; width: fit-content; margin: 0 auto 48px 0; } @media screen and (max-width: 1024px) { .error404 .error-cnt__left .error-cnt__slg { margin: 0 auto 20px; } } .error404 .error-cnt__left .error-cnt__slg-bef { padding: 7px 16px; -webkit-border-radius: 50px; -khtml-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; border-radius: 50px; background-color: var(--primary-color); color: #fff; font-weight: 500; } .error404 .error-cnt__left .error-cnt__slg-aft { color: var(--primary-color); display: flex; align-items: center; gap: 6px; font-weight: 500; } .error404 .error-cnt__left .error-cnt__tit { max-width: 445px; margin-bottom: 40px; } @media screen and (max-width: 1024px) { .error404 .error-cnt__left .error-cnt__tit { margin-bottom: 15px; } } .error404 .error-cnt__left .error-cnt__desc { margin-bottom: 64px; max-width: 427px; } @media screen and (max-width: 1024px) { .error404 .error-cnt__left .error-cnt__desc { margin-bottom: 20px; } } .error404 .error-cnt__left .error-cnt__btn { width: fit-content; display: flex; align-items: center; gap: 6px; } .error404 .error-cnt>svg { transform: scale(1.1) rotateX(45deg) rotateZ(45deg); margin: -61px 76px 0 0; } .error404 .error-cnt>svg .moving-line-h1 { animation: moveHorizontal1 4s ease-in-out infinite; } .error404 .error-cnt>svg .moving-line-h2 { animation: moveHorizontal2 4s ease-in-out infinite 1s; } .error404 .error-cnt>svg .moving-line-v1 { animation: moveVertical1 3s ease-in-out infinite; } .error404 .error-cnt>svg .moving-line-v2 { animation: moveVertical2 3s ease-in-out infinite 0.5s; } @media screen and (max-width: 1024px) { .error404 .error-cnt>svg { margin: -100px auto 0; width: 70%; } } @media screen and (max-width: 767px) { .error404 .error-cnt>svg { display: none; } } @keyframes moveHorizontal1 { 0% { transform: translateX(-200px); opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } 100% { transform: translateX(200px); opacity: 0; } } @keyframes moveHorizontal2 { 0% { transform: translateX(200px); opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } 100% { transform: translateX(-200px); opacity: 0; } } @keyframes moveVertical1 { 0% { transform: translateY(-200px); opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } 100% { transform: translateY(200px); opacity: 0; } } @keyframes moveVertical2 { 0% { transform: translateY(200px); opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } 100% { transform: translateY(-200px); opacity: 0; } }