@media only screen and (max-width: 767px) { section.package-content .pk-lists .item { padding-top:3px; padding-right: 35px; padding-bottom: 35px; padding-left: 35px } } @media only screen and (min-device-width: 428px) and (max-device-width:926px) { section.package-content .pk-lists .item { padding-top:3px; padding-right: 55px; padding-bottom: 35px; padding-left: 55px } } @media only screen and (min-device-width: 390px) and (max-device-width:844px) { section.package-content .pk-lists .item { padding-top:3px; padding-right: 52px; padding-bottom: 35px; padding-left: 52px } } @media only screen and (max-width: 767px) { .header .navbar-brand img { height: 50PX; width: auto; margin-top: -26px; margin-bottom: -27px; } .ppmgp .parent-menu { padding: 1rem 1rem 0; margin-top: -5px !important; margin-bottom: -30px; } } @media only screen and (max-width: 767px) { .container.cus.mobile { max-width:1360px !impo; padding-right: 0rem!important; padding-left: 0.18rem!important } } @media only screen and (min-width: 767px) { .container.cus.mobile { width:100%; padding-right: 2.8rem!important; padding-left: 3.2rem!important; margin-right: auto; margin-left: auto } } #dynamicFontSize { font-size: 1.75rem!important } @media (max-width: 768px) { #dynamicFontSize { font-size:1.49rem!important } } @media (min-width: 768px) { #dynamicFontSize { font-size:16px; margin-top: -65px; padding-bottom: 10px } } @media only screen and (max-width: 768px) { .fa-brands.fa-x-twitter.special { color:#fff; font-size: 31px; margin-left: -6px; padding: 1px } } @media only screen and (max-width: 767px) { section.package-content .pk-lists .item { padding-top:3px; padding-right: 35px; padding-bottom: 35px; padding-left: 35px } } @media only screen and (min-device-width: 428px) and (max-device-width:926px) { section.package-content .pk-lists .item { padding-top:3px; padding-right: 55px; padding-bottom: 35px; padding-left: 55px } } @media only screen and (min-device-width: 390px) and (max-device-width:844px) { section.package-content .pk-lists .item { padding-top:3px; padding-right: 52px; padding-bottom: 35px; padding-left: 52px } } .btn-dm-menu .navcoll .rightshow .f1r { display: none; } .footer { padding: 0.5rem 0; } .footer a:not(.btn) { color: #fff; } .footer .title { color: #fff; padding: 10px; } .footer_top.dark { background-color: #3a75fa !important; } .footer_top.dark .site-logo img { max-height: 1000px; width: 200px; } .footer_top.dark .quick-link li a:hover { color: #ff6f61; } .footer_bottom.dark { background-color: #3a75fa !important; } .footer_bottom.dark .container { padding: 20px; } .footer-lang-selector { margin-top: 4px; margin-left: 20px; padding: 3px; display: inline-block; border: 1px solid #fff; outline: none; background-color: transparent; color: #fff; font-size: 14px; line-height: 24px; } a.nav-link-fotter { padding: 10px; margin-bottom: 10px !important; text-decoration: none; color: #fff !important; border-radius: 0.25rem; } ul.list-unstyled li { margin-bottom: 16px; } a.nav-link-fotter:hover { background: #5592ff; color: #ffffff !important; border-radius: 0.25rem; } a.nav-link-fotter:active { background-color: #295ccf; /* This color will be applied when the link is clicked */ /* You can add more styles for the active state if needed */ } .top-hr { border-top: 1px solid #fff; padding-top: 1rem; } .footer .site-logo a { background: #3a75fa ; padding: 1rem; border-radius: 0.25rem; } @media (max-width: 576px) { section.banner .content { text-align: center; } section.banner .content h1 { font-size: 30px; } .header-top .navbar-nav.list-inline { display: none; } nav.header-top .link { margin-left: auto; } footer { border-top: none; } footer .col-auto { -ms-flex: 0 0 auto; width: 100%; text-align: center; } } @media(min-width: 768px) { .top-nav-link.btn-primary0 { color:#fff; padding-left: ; font-size: 16px; font-weight: 600 } } @media(max-width: 768px) { .top-nav-link.btn-primary0 { color:#fff; font-size: 16px; font-weight: 600 } } @media(min-width: 768px) { .nav-item.cart.mobile { display:none } } @media(max-width: 768px) { .container.mobile.hearder { width:100%; padding-right: 0rem; margin-left: 0rem; overflow: hidden; padding-top: 8.1px } } @media(min-width: 768px) { .nav-item.mobile.cart { display:none } } @media only screen and (min-width: 768px) { .buttons-container .cussec-drop .bar-sec.cus-btn-cus.aaa,.ppmgp .cussec-drop .bar-sec.cus-btn-cus.aaa { display:flex; margin: 0; width: 80%; justify-content: center; border-radius: 3px } } .hidden { display: none } @media (min-width: 768px) { .ppmgp .down-gap { padding-bottom:63.5px } } @media(min-width: 768px) { .fa-solid.fa-ellipsis-vertical { font-size:33px; margin-right: -8px } } @media(max-width: 768px) { .fa-solid.fa-ellipsis-vertical { font-size:33px; margin-right: 9px } } .hidden { display: none } @media (max-width: 768px) { .ppmgp .down-gap { padding-bottom:40.5px } } @media only screen and (max-width: 768px) { .nav-item .nav-link { padding:.75rem 1rem!important } } @media(min-width: 768px) { .pgpz .nav-item { padding-left:8px!important; padding-right: 20px!important } } @media (max-width: 768px) { #dynamicFontSize { font-size:16px; margin-top: -1px; padding-bottom: 0px!important } } @media(min-width: 992px) { .nav-item .nav-link { padding:1.09rem 1rem!important } } @media(min-width: 992px) { .ppmgp { flex-wrap:nowrap } .ppmgp .parent-menu:not(:empty) { width: 25% } .ppmgp .down-gap { flex: 2; text-align: center; white-space: nowrap } .ppmgp .parent-menu { width: 1.75rem; padding: 0 } .ppmgp .howToTooltipBtn,.ppmgp .parent-menu { flex: 1 } } .free { position: relative; padding: .75rem 1.25rem; margin-bottom: 1rem; border: 1px solid #fff0; border-radius: 3px } .freenote { position: relative; border: 1px solid #fff0; border-radius: 3px } .close { font-size: 1.09rem!important } .fa.fa-exclamation-circle { font-size: 20px; vertical-align: -1px } @media (max-width: 768px) { .success_alert { margin-top:-0.6rem!important } } @media (max-width: 768px) { .note_alert { margin-top:-0.6rem!important } } @media only screen and (max-width: 768px) { .alert-warning { font-weight:400!important } } @media(max-width: 767px) { .mob-none { display:none } } @media(min-width: 767px) { .mob-none { display:block } } @media(min-width: 767px) { .pc-none { display:none } } @media(max-width: 767px) { .pc-none { display:block } } @media(min-width: 768px) { .input-sections { display:flex; justify-content: nav-bar-nav; width: 100% } } @media(max-width: 768px) { .deliveri-time.btn.btn-info.post-time-control { margin-top:14px!important } } @media(max-width: 768px) { .user-input.pc-none { margin-top:20px!important } } @media(min-width: 768px) { .new-desktop-class-1.new-desktop-class-2 { display:none!important } } @media(max-width: 768px) { .new-mobile-class-1.new-mobile-class-2 { display:none!important } } @media(max-width: 768px) { .image-background { position:absolute; top: 0; left: 0; background-color: #E6E7E9; z-index: -1; margin-left: -10px!important } } @media (max-width: 768px) { #profileImg { max-width:108%!important; border-radius: 0px!important; margin-bottom: 5px!important; margin-left: -17px!important; width: 1000px!important } } @media (max-width: 768px) { .user-input.mobilemargin { } } @media only screen and (min-width: 768px) { .buy-now-button { position:absolute; top: 64%!important } } .cart-box.add-to-cart-button:active { background-color: #133b95!important; border-color: #3a75fa } .cart-box.buy-now-button:active { background-color: #133b95!important; border-color: #3a75fa } @media (max-width: 768px) { #profileImga { max-width:108.1%!important; border-radius: 0px!important; margin-bottom: -20px!important; margin-left: -18.2px!important; width: 1000px!important } } @media only screen and (min-width: 768px) { .buttons-container .cussec-drop .bar-sec.cus-btn-cus.aaa,.ppmgp .cussec-drop .bar-sec.cus-btn-cus.aaa { display:flex; margin: 0; width: 80%; justify-content: center; border-radius: 3px } } @media (max-width: 768px) { .custom-collapse { position:relative; height: 0; overflow: hidden; transition: height .35s ease } .custom-collapse.width { width: 0; height: auto; transition: width .35s ease } } @media (prefers-reduced-motion:reduce) { .custom-collapse,.custom-collapse.width { transition: none } } .cus-btn-cus.dropline-cus-before { /* border-radius: 2px !important; */ } .parent-menu .dropline-cus-before:before { content: ""; height: calc(100% + 2px); width: 52px; display: block; position: absolute; left: -1px; border-top-left-radius: 8px; border-bottom-left-radius: 8px; } @media (max-width: 768px) { .custom-collapse { position:relative; height: 0; overflow: hidden; transition: height .35s ease } .custom-collapse.width { width: 0; height: auto; transition: width .35s ease } } @media (prefers-reduced-motion:reduce) { .custom-collapse,.custom-collapse.width { transition: none } } .material-symbols-outlined { font-variation-settings: 'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24 } .card-header { padding: .75rem 1.25rem; margin-bottom: 0; background-color: rgb(0 0 0 / .03); border-bottom: 1px solid rgb(0 0 0 / .125) } .card-header:first-child { border-radius: calc(.25rem - 1px) calc(.25rem - 1px) 0 0 } .card-header+.list-group .list-group-item:first-child { border-top: 0 } button,select { text-transform: none } .form-control::-moz-placeholder { color: #6c757d; opacity: 1 } .form-control::placeholder { color: #6c757d; opacity: 1 } .form-control:disabled,.form-control[readonly] { background-color: #e9ecef; color: #6c757d; opacity: 1 } .form-control:disabled:hover,.form-control[readonly]:hover { border-color: #ced4da } .default .header-top.d-none.d-lg-block { display: none!important } section.header-top { background: #316aecfa; padding: 0 30px 0 } section.header-top.mini-menu { padding-left: 10px } section.header-top.mini-menu li { position: relative } section.header-top.mini-menu li a { display: inline-block; font-size: 16.5px; font-weight: 600; padding: 5px 20px 5px 20px; margin-left: -24px; color: #fff; background-color: #316aecfa; text-decoration: none; border-radius: 0 80px 80px 0; transition: .3s ease; font-weight: 400; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji" } section.header-top.mini-menu li.active { border-color: #f16334!important; color: #f16334!important } section.header-top.mini-menu li.active a,section.header-top.mini-menu li:hover a { color: #fff; background-color: #3066e1fa } @media only screen and (min-width: 768px) { .buttons-container .cussec-drop .bar-sec.cus-btn-cus.aaa,.ppmgp .cussec-drop .bar-sec.cus-btn-cus.aaa { display:flex; margin: 0; border-radius: 3px; width: 80%!important; justify-content: center; } } .btn-info { color: #FFFFFF; } .btn-info:hover { border-color: #295ccf !important; background-color: #295ccf !important; color: #FFF !important; } .btn-info:focus, .btn-info:active { border-color: #295ccf !important; background-color: #1541a5 !important; color: #FFF !important; } .post-time { align-items: flex-end; display: flex; height: 100% } .post-time-control { padding: .5rem .875rem; display: flex; justify-content: nav-bar-nav; align-items: center; width: 100%; color: #fff!important; } .user-input input::placeholder { color: #717579; } .right-to-left>div>div { margin-bottom: -50px!important; flex: unset!important; width: 100%!important; } .left-to-right>div>div { flex: unset!important; width: 100%!important } @media screen and (min-width: 1004px) and (max-width:1749px) { .col-md-12.faq { max-width:100%!important } } @media screen and (min-width: 1450px) and (max-width:1669px) { .col-md-12.faq { max-width:85%!important } } @media screen and (min-width: 1669px) and (min-height:53px) { .col-md-12.faq { max-width:80%!important } } .bg-light { background-color: #!important; position: relative!important } .bg-light::before { content: ""!important; position: absolute!important; top: 0!important; bottom: 0!important; left: -500px!important; right: -500px!important; background: # !important; z-index: -1!important } .material-symbols-outlined { font-variation-settings: 'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24 } @media (min-width: 768px) { .header { padding-top:24px!important; padding-bottom: 30px!important; background-color: #3a75fa!important } } html,body { height: 100%; width: 100%; height: 100% } .btn.bar-sec.if.btn-facebook.cus-btn-cus .content-aline .cbtxt.m-txt-service .fa-solid.fa-thumbs-up { color: #3a559f !important; font-size: 17.5px !important; margin-right: 3px !important; vertical-align: middle !important } .drmb.tif.cussec-drop.cus .content-aline .cbtxt.m-txt-service .fa-solid { font-size: 17.5px !important; margin-right: 3px !important } .drmb.tif.cussec-drop.cus .content-aline .cbtxt.m-txt-service .fa { font-size: 17.5px !important; margin-right: 3px !important } .drmb.tif.cussec-drop.cus .content-aline .cbtxt.m-txt-service .fa-brands { font-size: 17.5px !important; margin-right: 3px !important } .drmb.tif.cussec-drop.cus .content-aline .cbtxt.m-txt-service .fab { font-size: 17.5px !important; margin-right: 3px !important } .d-lg-block.content-aline .fa-brands { font-size: 29px } .content-aline.w-100 .fa { font-size: 29px } .content-aline.w-100 .fa-solid { font-size: 29px } .content-aline.w-100 .fa-brands { font-size: 29px } .cussec-drop .cbtxt { font-weight: 400; text-shadow: 1px 1px 16px rgb(0 0 0 / .1) !important } .cussec-drop .fa-brands { text-shadow: 1px 1px 16px rgb(0 0 0 / .15) !important } .cussec-drop .fa { text-shadow: 1px 1px 16px rgb(0 0 0 / .15) !important } .cussec-drop .fa-solid { text-shadow: 1px 1px 16px rgb(0 0 0 / .15) !important } .btn-dm-menu.navcoll.leftshow.3a1 { --sub-menu: rgb(255, 255, 255); --sub-level: undefined; left: 50%; transform: translateX(-50%); top: 100%; } .navcoll.btn-dm-submenu.zmo { --sub-menu: rgb(255, 0, 59); --sub-level: 1; } .navcoll.btn-dm-submenu.z1w { --sub-menu: rgb(237, 21, 230); --sub-level: 1; } .navcoll.btn-dm-submenu.fpl { --sub-menu: rgb(113, 8, 203); --sub-level: 1; } .navcoll.btn-dm-submenu.vvb { --sub-menu: rgb(0, 135, 255); --sub-level: 1; } .navcoll.btn-dm-submenu.cxi { --sub-menu: rgb(255, 80, 37); --sub-level: 1; } @media only screen and (min-width: 768px) { .navcoll.btn-dm-menu.yko { --sub-menu: rgb(255, 61, 61); --sub-level: 1; left: 50%; transform: translateX(-50%); top: 100%; } } @media only screen and (min-width: 768px) { .navcoll.btn-dm-menu.vri { --sub-menu: rgb(87, 116, 217); --sub-level: 1; left: 50%; transform: translateX(-50%); top: 100%; } } @media only screen and (min-width: 768px) { .navcoll.btn-dm-menu.jqq { --sub-menu: rgb(53, 50, 50); --sub-level: 1; left: 50%; transform: translateX(-50%); top: 100%; } } @media only screen and (min-width: 768px) { .navcoll.btn-dm-menu.bjq { --sub-menu: rgba(27, 29, 30, 0.89); --sub-level: 1; left: 50%; transform: translateX(-50%); top: 100%; } } @media only screen and (min-width: 768px) { .btn-dm-menu.navcoll.rightshow.f1r { --sub-menu: rgb(255, 255, 255); --sub-level: undefined; left: 50%; transform: translateX(-50%); top: 100%; right: 0px; } } @media only screen and (min-width: 768px) { .navcoll.btn-dm-submenu.t89 { --sub-menu: rgb(13, 13, 13); --sub-level: 1; left: -309px; padding: 0px 11px; } } @media only screen and (min-width: 768px) { .navcoll.btn-dm-submenu.v57 { --sub-menu: rgb(29, 185, 84); --sub-level: 1; left: -309px; padding: 0px 11px; } } @media only screen and (min-width: 768px) { .navcoll.btn-dm-submenu.cp10 { --sub-menu: rgb(255, 0, 0); --sub-level: 1; left: -309px; padding: 0px 11px; } } @media only screen and (min-width: 768px) { .navcoll.btn-dm-submenu.unw { --sub-menu: rgb(100, 65, 165); --sub-level: 1; left: -309px; padding: 0px 11px; } } @media only screen and (min-width: 768px) { .navcoll.btn-dm-submenu.hk01 { --sub-menu: rgb(189, 8, 28); --sub-level: 1; left: -309px; padding: 0px 11px; } } @media only screen and (min-width: 768px) { .navcoll.btn-dm-submenu.gz6 { --sub-menu: rgb(0, 119, 181); --sub-level: 1; left: -309px; padding: 0px 11px; } } @media only screen and (min-width: 768px) { .navcoll.btn-dm-submenu.ka34 { --sub-menu: rgb(42, 171, 238); --sub-level: 1; left: -309px; padding: 0px 11px; } } @media only screen and (min-width: 768px) { .navcoll.btn-dm-submenu.f99 { --sub-menu: rgb(255, 69, 0); --sub-level: 1; left: -309px; padding: 0px 11px; } } @media only screen and (min-width: 768px) { .navcoll.btn-dm-submenu.uyt { --sub-menu: rgb(255, 85, 0); --sub-level: 1; left: -309px; padding: 0px 11px; } } @media only screen and (min-width: 768px) { .navcoll.btn-dm-submenu.vgb { --sub-menu: rgb(74, 118, 168); --sub-level: 1; left: -309px; padding: 0px 11px; } } @media only screen and (min-width: 768px) { .navcoll.btn-dm-submenu.jsw { --sub-menu: rgb(207, 34, 23); --sub-level: 1; left: -309px; padding: 0px 11px; } } @media only screen and (min-width: 768px) { .navcoll.btn-dm-submenu.5bs { --sub-menu: rgb(26, 183, 234); --sub-level: 1; left: -309px; padding: 0px 11px; } } .fa-solid.fa-eye.iv { color: #7B2CBF; } .fa-solid.fa-gift.igt2 { color: #7B2CBF; vertical-align: 0px; } .fa-solid.fa-gift.ik3 { color: #ff003b; font-size: 17.5px; margin-right: 3px; } .fa-solid.fa-heart.ik3 { color: #ff003b; font-size: 17.5px; margin-right: 3px; } .fa-solid.fa-user.ifas { color: #ff00b1; } .fa-solid.fa-gift.ifas { color: #ff00b1; } .fa-solid.fa-comment.ccx { color: #0087ff !important; } .fa-solid.fa-user.obzf,.fa-solid.fa-heart.dfg4,.fa-regular.fa-id-badge.bob,.fa-brands.fa-instagram.bob { color: #E76F51; } .fa-solid.fa-eye.ytytyt,.fa-solid.fa-comment.ytytyt,.fab.fa-youtube.ytytyt, .fa-solid.fa-thumbs-up.ytytyt, .fa-brands.fa-youtube.ytytyt { color: #ff1717; } .fa-solid.fa-eye.fbfb,.fa-solid.fa-comment.fbfb,.fa-brands.fa-facebook.fbfb, .fa-solid.fa-star.fbfb,.fa-solid.fa-user.fbfb,.fa-solid.fa-gift.fbfb, .fa-solid.fa-thumbs-up.fbfb { color: #3a559f; } .cbtxt.m-txt-service.ftmai { border: none; outline: none; } .fa-solid.fa-ellipsis-vertical.otot { font-size: 29px; margin-right: 0px; } .cbtxt.m-txt-service.ofhdn { overflow: hidden; } .container.cus.mobile { max-width: 1360px; } @media only screen and (max-width: 767px) { .buttons-container, .ppmgp { padding-top: 0.1rem !important; padding-right: 0rem !important; padding-left: 0rem !important; } } @media(min-width: 768px) { .service-features.new.row { margin-left: -0.0rem !important; margin-right: -1rem !important; } } .post-time-control { padding: .5rem .875rem; display: flex; justify-content: space-between; align-items: center; width: 100%; color: #fff!important; } @media (max-width: 768px) { .container.warningTop.service { margin-top: -50px !important; padding-bottom: 60px !important; } } @media (min-width: 768px) { .container.warningTop.service { margin-top: 100px !important; margin-bottom: -50px !important; } } .btn-facebook { color: #fff; background-color: #395693; border-color: #395693; } .btn-facebook:hover { color: #fff; background-color: #395693; border-color: #395693; } .btn-facebook:focus, .btn-facebook.focus { box-shadow: 0 0 0 2px #395693; } .btn-facebook.disabled, .btn-facebook:disabled { color: #fff; background-color: #395693; border-color: #395693; } .btn-facebook:not(:disabled):not(.disabled):active, .btn-facebook:not(:disabled):not(.disabled).active,.show > .btn-pinterest.btn-dm-toggle { color: #fff; background-color: #395693; border-color: #395693; } .btn-pinterest:not(:disabled):not(.disabled):active:focus, .btn-facebook:not(:disabled):not(.disabled).active:focus,.show > .btn-pinterest.btn-dm-toggle:focus { box-shadow: 0 0 0 2px #395693; } .fa-solid.fa-gift.toktok { vertical-align: 0px; } .cbtxt .fa-solid.fa-gift { vertical-align: 0px; } .cbtxt .fa-solid.fa-thumbs-up.fbfb { vertical-align: -1px; } .cbtxt .fa-solid.fa-thumbs-up.ytytyt { vertical-align: -1px; } .cbtxt .fa-solid.fa-heart.ik3 { vertical-align: -1px; } .cbtxt .fa-solid.fa-user.ifas { vertical-align: -1px; } .cbtxt .fa-solid.fa-eye.iv { vertical-align: -1px; } .cbtxt .fa-solid.fa-comment.ccx { vertical-align: -1px; } .cbtxt .fa-solid.fa-eye.ytytyt { vertical-align: -1px; } @media only screen and (min-width: 767px) and (max-width: 768px) { .mob-none { display: none !important; } } @media only screen and (min-width: 768px) and (max-width: 768px) { .mob-none { display: block !important; } } @media only screen and (min-width: 467px) and (max-width: 994px) { #profileImga { max-width: 107.5% !important; border-radius: 0 !important; margin-bottom: -20px !important; margin-left: 49.5% !important; transform: translateX(-50%) !important; width: 108% !important; } } @media only screen and (min-width: 515px) and (max-width: 994px) { #profileImga { max-width: 107.5% !important; border-radius: 0 !important; margin-bottom: -20px !important; margin-left: 50% !important; transform: translateX(-50%) !important; width: 108% !important; } } .fa-solid.fa-share.obzf { color: #E76F52; } .fa-solid.fa-share.ytytyt { color: #ff1717; } /* ——— Theme tokens (tweak if needed) ——— */ :root { --sf-ink: #0e1223; --sf-muted: #6b7380; --sf-border: #e8ebf0; --sf-bg: #ffffff; --sf-bg-soft: #f7f9fc; --sf-primary: #217fcd; --sf-radius: 16px; --sf-radius-sm: 10px; --sf-shadow: 0 10px 30px rgba(15, 23, 42, .08); } /* =========================== BESTSELLERS STRIP =========================== */ .package-details { padding: 2rem 0 1rem !important; background: linear-gradient(180deg,var(--sf-bg), var(--sf-bg-soft)) !important; } .package-details .free-ser-tit, .package-details > p span, .package-details > p { color: var(--sf-ink) !important; } .package-details .container { position: relative !important; } /* Slider track spacing */ .package-details .slick-slider, .package-details .ss-dots { margin-top: .75rem !important; } /* Card shell (uses inline color via currentColor) */ .package-details .re-card { position: relative !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: space-between !important; gap: .65rem !important; border: 1px solid currentColor !important; color: var(--sf-ink) !important; /* fallback if no inline color */ background: var(--sf-bg) !important; border-radius: var(--sf-radius) !important; padding: 1.15rem .95rem !important; min-height: 235px !important; box-shadow: var(--sf-shadow) !important; overflow: hidden !important; transition: transform .25s ease, box-shadow .25s ease, background .25s ease !important; } .package-details .re-card::after { content: ""; position: absolute; inset: -1px; border-radius: inherit; pointer-events: none; background: radial-gradient(120px 120px at 90% -10%, currentColor 0%, transparent 60%) !important; opacity: .08; } /* Hover */ .package-details .re-card:hover { transform: translateY(-6px) !important; box-shadow: 0 16px 40px rgba(15,23,42,.12) !important; } /* Icon bubble */ .package-details .re-card .newf { font-size: 26px !important; line-height: 1 !important; width: 52px !important; height: 52px !important; display: grid !important; place-items: center !important; border-radius: 50% !important; background: color-mix(in srgb, currentColor 12%, transparent) !important; border: 1px solid color-mix(in srgb, currentColor 35%, transparent) !important; box-shadow: inset 0 0 0 2px rgba(255,255,255,.6) !important; } /* Badge: piece amount */ .package-details .re-card .piece { font-size: .85rem !important; letter-spacing: .02em !important; color: var(--sf-muted) !important; } /* Service title */ .package-details .re-card .service-name { font-weight: 700 !important; font-size: clamp(1rem, .9rem + .25vw, 1.125rem) !important; text-align: center !important; color: var(--sf-ink) !important; } /* Price block */ .package-details .re-card .pricenewf { font-size: clamp(1rem, .9rem + .35vw, 1.25rem) !important; font-weight: 800 !important; color: currentColor !important; } .package-details .re-card .original-price { margin-left: .35rem !important; font-weight: 600 !important; color: var(--sf-muted) !important; text-decoration: line-through !important; font-size: .95rem !important; } .package-details .re-card .discountqqq { margin-top: .35rem !important; background: color-mix(in srgb, currentColor 12%, transparent) !important; color: currentColor !important; border: 1px dashed currentColor !important; font-size: .75rem !important; padding: .25rem .5rem !important; border-radius: 999px !important; display: inline-block; } /* CTA button */ .package-details .order-now-button-fea { /* all: unset !important; */ } .package-details .re-card a.order-now-button-fea { /* width: 100% !important; */ } .package-details .re-card a.order-now-button-fea > button.order-now-button-fea { width: 100% !important; /* cursor: pointer !important; */ /* border: none !important; */ /* border-radius: 999px !important; */ /* padding: .7rem 1rem !important; */ /* font-weight: 700 !important; */ /* letter-spacing: .02em !important; */ /* color: #fff !important; */ /* background: linear-gradient(90deg, currentColor 0%, color-mix(in srgb, currentColor 70%, #000 20%) 100%) !important; */ /* box-shadow: 0 6px 18px color-mix(in srgb, currentColor 30%, transparent) !important; */ /* transition: transform .15s ease, box-shadow .2s ease, opacity .2s ease !important; */ } .package-details .re-card a.order-now-button-fea > button.order-now-button-fea:hover { } .package-details .re-card a.order-now-button-fea > button.order-now-button-fea:active { transform: translateY(0) scale(.98) !important; } .package-details .re-card a.order-now-button-fea > button.order-now-button-fea { all: unset; display: block !important; width: 100% !important; text-align: center !important; cursor: pointer !important; color: #fff !important; font-weight: 700 !important; padding: .5rem 0.5rem !important; border-radius: 999px !important; background: #217fcd !important; box-shadow: 0 6px 18px rgba(33,127,205,.28) !important; transition: transform .15s ease, box-shadow .2s ease, opacity .2s ease !important; } /* Slide spacing */ .package-details .slide { padding: .35rem !important; } /* Slick/Custom arrows */ .package-details .slick-arrow, .package-details .ss-arrow { position: absolute !important; top: 50% !important; transform: translateY(-50%) !important; width: 40px !important; height: 40px !important; display: grid !important; place-items: center !important; border-radius: 50% !important; border: 1px solid var(--sf-border) !important; background: #fff !important; color: var(--sf-ink) !important; box-shadow: var(--sf-shadow) !important; transition: background .2s ease, color .2s ease, border-color .2s ease !important; z-index: 2 !important; } .package-details .slick-prev, .package-details .ss-prev { left: -6px !important; } .package-details .slick-next, .package-details .ss-next { right: -6px !important; } .package-details .slick-arrow:hover, .package-details .ss-arrow:hover { background: var(--sf-primary) !important; color: #fff !important; border-color: transparent !important; } /* Slick/Custom dots */ .package-details .slick-dots, .package-details .ss-dots { display: flex !important; gap: .5rem !important; justify-content: center !important; align-items: center !important; margin-top: .75rem !important; } .package-details .slick-dots li, .package-details .ss-dots button { list-style: none !important; width: 9px !important; height: 9px !important; border-radius: 999px !important; background: #d9dee7 !important; border: none !important; padding: 0 !important; } .package-details .slick-dots li.slick-active, .package-details .ss-dots .is-active { width: 22px !important; background: var(--sf-primary) !important; } /* =========================== INFO SECTIONS (L↔R) =========================== */ .left-to-right, .right-to-left { padding: 2.25rem 0 !important; background: var(--sf-bg) !important; } .right-to-left { /* background: var(--sf-bg-soft) !important; */ } .left-to-right .content-wrap, .right-to-left .content-wrap { /* max-width: 1120px !important; */ margin: 0 auto !important; display: flex !important; align-items: center !important; gap: 1.75rem !important; /* padding: .5rem 1rem !important; */ } .left-to-right .w-30, .right-to-left .w-30 { flex: 0 0 32% !important; } .left-to-right .w-70, .right-to-left .w-70 { flex: 1 1 68% !important; } /* Poster */ .left-to-right .poster img, .right-to-left .poster img { /* width: 100% !important; */ height: auto !important; display: block !important; border-radius: var(--sf-radius) !important; /* box-shadow: var(--sf-shadow) !important; */ } /* Head + text */ .title-fancy { font-weight: 800 !important; /* font-size: clamp(1.1rem, .95rem + .75vw, 1.6rem) !important; */ color: var(--sf-ink) !important; margin-bottom: .65rem !important; position: relative !important; } .title-fancy::after { /* content: ""; */ /* display: block; */ /* width: 64px !important; */ /* height: 3px !important; */ /* margin-top: .5rem !important; */ /* border-radius: 2px !important; */ /* background: linear-gradient(90deg, var(--sf-primary), transparent) !important; */ } .infoText { color: var(--sf-muted) !important; font-size: clamp(.95rem, .9rem + .25vw, 1.05rem) !important; line-height: 1.65 !important; } /* Swap order on RTL block for large screens (image right) */ .right-to-left .content-wrap { flex-direction: row-reverse !important; } /* =========================== RESPONSIVE =========================== */ @media (max-width: 992px) { .package-details { padding: 1.25rem 0 .5rem !important; } .package-details .slick-prev, .package-details .ss-prev { left: 2px !important; } .package-details .slick-next, .package-details .ss-next { right: 2px !important; } } @media (max-width: 768px) { .left-to-right .content-wrap, .right-to-left .content-wrap { flex-direction: column !important; gap: 1rem !important; } .left-to-right .w-30, .right-to-left .w-30, .left-to-right .w-70, .right-to-left .w-70 { flex: 1 1 100% !important; } .package-details .re-card { padding: 1rem .9rem !important; min-height: 220px !important; } .package-details .slick-arrow, .package-details .ss-arrow { width: 36px !important; height: 36px !important; } } .package-details .re-card { background: #fff !important; border: 1px solid #e6e8ee !important; /* your inline border color still wins if present */ border-radius: 14px !important; box-shadow: 0 8px 24px rgba(15,23,42,.08) !important; padding: 16px 14px !important; min-height: 235px !important; text-align: center !important; display: flex !important; flex-direction: column !important; justify-content: space-between !important; gap: 8px !important; transition: transform .2s ease, box-shadow .2s ease !important; } /* Optional: nicer focus states */ .package-details .re-card a.order-now-button-fea > button.order-now-button-fea:focus-visible, .package-details .slick-arrow:focus-visible, .package-details .ss-arrow:focus-visible { outline: 3px solid color-mix(in srgb, var(--sf-primary) 35%, transparent) !important; outline-offset: 3px !important; box-shadow: 0 0 0 6px color-mix(in srgb, var(--sf-primary) 20%, transparent) !important; } /* Brand colors */ :root { --brand-1: #217fcd; /* primary */ --brand-2: #6ac8ff; /* accent */ --brand-3: #0e5997; /* deep */ } /* Target ONLY the top heading span inside .package-details */ .col-md-12.package-details > p > span:first-child { position: relative !important; display: inline-block !important; font-weight: 800 !important; /* gradient text */ background: linear-gradient(90deg, var(--brand-1), var(--brand-2), var(--brand-3)) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; color: transparent !important; /* override inline color */ } /* subtle underline for that heading only */ .col-md-12.package-details > p > span:first-child::after { content: "" !important; display: block !important; width: 72px !important; height: 4px !important; margin: 10px auto 0 !important; border-radius: 999px !important; background: linear-gradient(90deg, var(--brand-1), var(--brand-2), var(--brand-3)) !important; opacity: .9 !important; }