/* ======================= Css table of contents Start ================================= * Template name: Repio * Version: 1.0 * Description: Repio - cleaning repair handyman Services Multipurpose HTML Template * Author: wowtheme7 * Author-url: https://themeforest.net/user/wowtheme7 */ /* **************************** Abstracts **************************** ** Functions ** Mixins ** Variables /* **************************** Components **************************** ** Accordion ** Button ** Form ** Swiper ** Tab ** Table ** Toast /* **************************** Layout **************************** ** Custom Cursor ** Footer ** Header ** Mobile nav menu ** Magic Cursor ** Mega Menu ** Mobile nav Menu ** Preloader ** Pagination ** Progress ** OffCanvas ** Range slider ** Scroll top ** Slick /* **************************** Partials **************************** ** About ** Banner ** Before After ** Blog ** Brand ** Breadcrumb ** Checkout ** Choose Us ** Contact ** Counter ** Cta ** Event ** Expert ** Faq ** Feature ** Gallery ** Hover Animation ** Maquee ** Pricing ** Product ** Project ** Rtl ** Section Title ** Service ** Team ** Testimonial ** Video ** Work /* **************************** Utilities **************************** ** Aspect ** Bg img ** Bg ** Border ** Classes ** Colors hover ** Colors ** Cursor ** Duration ** Font size ** Font ** Gap ** Grid ** Group ** Height ** Hover Animation White ** Inset ** Line clamp ** Line height ** Margin ** Max height ** Max width ** Outline ** Overlay ** Padding ** Placeholder ** Rotate ** Rounded ** Scale ** Scrollbar ** Shadow ** Transform ** Transition ** Translate ** Typography ** Underline ** Width ** Z index ** Animation /* **************************** Partials **************************** ** RTL ================================== Css table of contents End======================================== */ /* Font Family*/ @import url("https://fonts.googleapis.com/css2?family=Parkinsans:wght@300..800&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Rethink+Sans:ital,wght@0,400..800;1,400..800&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Urbanist:ital,wght@0,100..900;1,100..900&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&family=Oswald:wght@200..700&display=swap"); /* ========================= Variable Css Start ======================== */ :root { /* Font Family Variable */ --heading-font: 'Parkinsans', sans-serif; --body-font: 'Parkinsans', sans-serif; --rethink-font: 'Rethink Sans', sans-serif; --rurbanist-font: 'RUrbanist', sans-serif; --oswald-font: 'Oswald', sans-serif; --nunito-font: 'Nunito', sans-serif; /* Font Size Variable Start */ --heading-one: clamp(2rem, -0.0733rem + 6.3692vw, 4.25rem); --heading-two: clamp(1.75rem, 0.7133rem + 2.8846vw, 2.875rem); --heading-three: clamp(1.5rem, 0.3353rem + 2.1661vw, 2.5rem); --heading-four: clamp(1.25rem, 0.5569rem + 1.444vw, 2rem); --heading-five: clamp(1.125rem, 1.2rem + 0.722vw, 1.75rem); --heading-six: clamp(1rem, 0.769rem + 0.6813vw, 1.25rem); /* Font Size End */ /* template main color */ --main-h: 98; --main-s: 100%; --main-l: 32%; --main: var(--main-h) var(--main-s) var(--main-l); /* template main two color */ --main-two-h: 47; --main-two-s: 100%; --main-two-l: 50%; --main-two: var(--main-two-h) var(--main-two-s) var(--main-two-l); /* template main Four color */ --main-four-h: 17; --main-four-s: 83%; --main-four-l: 54%; --main-four: var(--main-four-h) var(--main-four-s) var(--main-four-l); /* template main Six color */ --main-six-h: 360; --main-six-s: 76%; --main-six-l: 47%; --main-six: var(--main-six-h) var(--main-six-s) var(--main-six-l); /* template main Six color */ --main-eight-h: 213; --main-eight-s: 99%; --main-eight-l: 44%; --main-eight: var(--main-eight-h) var(--main-eight-s) var(--main-eight-l); /* Common Color */ --white: 0 0% 100%; --black: 211 86% 11%; --body: 0 0% 40%; --heading-color: var(--black); --body-color: var(--body); --translate-x-50: translateX(-50%); --translate-y-50: translateY(-50%); --size-05: 0.125rem; --size-1: 0.25rem; --size-105: 0.375rem; --size-2: 0.5rem; --size-205: 0.625rem; --size-3: 0.75rem; --size-305: 0.875rem; --size-4: 1rem; --size-405: 1.125rem; --size-5: 1.25rem; --size-505: 1.375rem; --size-6: 1.5rem; --size-605: 1.625rem; --size-7: 1.75rem; --size-705: 1.875rem; --size-8: 2rem; --size-805: 2.125rem; --size-9: 2.25rem; --size-905: 2.375rem; --size-10: 2.5rem; --size-101: 2.625rem; --size-11: 2.75rem; --size-110: 2.875rem; --size-12: 3rem; --size-122: 3.125rem; --size-13: 3.25rem; --size-133: 3.375rem; --size-14: 3.5rem; --size-140: 3.625rem; --size-15: 3.75rem; --size-155: 3.875rem; --size-16: 4rem; --size-166: 4.125rem; --size-17: 4.25rem; --size-170: 4.375rem; --size-18: 4.5rem; --size-118: 4.625rem; --size-19: 4.75rem; --size-190: 4.875rem; --size-20: 5rem; --size-21: 5.5rem; --size-210: 5.625rem; --size-22: 5.75rem; --size-23: 6rem; --size-24: 6.25rem; --size-25: 6.5rem; --size-26: 6.75rem; --size-27: 7rem; --size-28: 7.25rem; --size-280: 7.375rem; --size-29: 7.5rem; --size-30: 7.75rem; --size-31: 8.5rem; --size-32: 8.75rem; --size-33: 9rem; --size-34: 9.25rem; --size-38: 9.5rem; --size-39: 9.75rem; --size-40: 10rem; --size-43: 10.75rem; --size-48: 12rem; --size-56: 14rem; --main-50: hsl(var(--main-h), var(--main-s), calc(var(--main-l) + (100% - var(--main-l)) * 0.9)); --main-100: hsl(var(--main-h), var(--main-s), calc(var(--main-l) + (100% - var(--main-l)) * 0.8)); --main-200: hsl(var(--main-h), var(--main-s), calc(var(--main-l) + (100% - var(--main-l)) * 0.7)); --main-300: hsl(var(--main-h), var(--main-s), calc(var(--main-l) + (100% - var(--main-l)) * 0.6)); --main-400: hsl(var(--main-h), var(--main-s), calc(var(--main-l) + (100% - var(--main-l)) * 0.5)); --main-500: hsl(var(--main-h), var(--main-s), calc(var(--main-l) + (100% - var(--main-l)) * 0.4)); --main-600: hsl(var(--main-h), var(--main-s), var(--main-l)); --main-700: hsl(var(--main-h), var(--main-s), calc(var(--main-l) - var(--main-l) * 0.1)); --main-800: hsl(var(--main-h), var(--main-s), calc(var(--main-l) - var(--main-l) * 0.2)); --main-900: hsl(var(--main-h), var(--main-s), calc(var(--main-l) - var(--main-l) * 0.3)); --main-two-50: hsl(var(--main-two-h), var(--main-two-s), calc(var(--main-two-l) + (100% - var(--main-two-l)) * 0.9)); --main-two-100: hsl(var(--main-two-h), var(--main-two-s), calc(var(--main-two-l) + (100% - var(--main-two-l)) * 0.8)); --main-two-200: hsl(var(--main-two-h), var(--main-two-s), calc(var(--main-two-l) + (100% - var(--main-two-l)) * 0.7)); --main-two-300: hsl(var(--main-two-h), var(--main-two-s), calc(var(--main-two-l) + (100% - var(--main-two-l)) * 0.6)); --main-two-400: hsl(var(--main-two-h), var(--main-two-s), calc(var(--main-two-l) + (100% - var(--main-two-l)) * 0.5)); --main-two-500: hsl(var(--main-two-h), var(--main-two-s), calc(var(--main-two-l) + (100% - var(--main-two-l)) * 0.4)); --main-two-600: hsl(var(--main-two-h), var(--main-two-s), var(--main-two-l)); --main-two-700: hsl(var(--main-two-h), var(--main-two-s), calc(var(--main-two-l) - var(--main-two-l) * 0.1)); --main-two-800: hsl(var(--main-two-h), var(--main-two-s), calc(var(--main-two-l) - var(--main-two-l) * 0.2)); --main-two-900: hsl(var(--main-two-h), var(--main-two-s), calc(var(--main-two-l) - var(--main-two-l) * 0.3)); --main-four-50: hsl(var(--main-four-h), var(--main-four-s), calc(var(--main-four-l) + (100% - var(--main-four-l)) * 0.9)); --main-four-100: hsl(var(--main-four-h), var(--main-four-s), calc(var(--main-four-l) + (100% - var(--main-four-l)) * 0.8)); --main-four-200: hsl(var(--main-four-h), var(--main-four-s), calc(var(--main-four-l) + (100% - var(--main-four-l)) * 0.7)); --main-four-300: hsl(var(--main-four-h), var(--main-four-s), calc(var(--main-four-l) + (100% - var(--main-four-l)) * 0.6)); --main-four-400: hsl(var(--main-four-h), var(--main-four-s), calc(var(--main-four-l) + (100% - var(--main-four-l)) * 0.5)); --main-four-500: hsl(var(--main-four-h), var(--main-four-s), calc(var(--main-four-l) + (100% - var(--main-four-l)) * 0.4)); --main-four-600: hsl(var(--main-four-h), var(--main-four-s), var(--main-four-l)); --main-four-700: hsl(var(--main-four-h), var(--main-four-s), calc(var(--main-four-l) - var(--main-four-l) * 0.1)); --main-four-800: hsl(var(--main-four-h), var(--main-four-s), calc(var(--main-four-l) - var(--main-four-l) * 0.2)); --main-four-900: hsl(var(--main-four-h), var(--main-four-s), calc(var(--main-four-l) - var(--main-four-l) * 0.3)); --main-six-50: hsl(var(--main-six-h), var(--main-six-s), calc(var(--main-six-l) + (100% - var(--main-six-l)) * 0.9)); --main-six-100: hsl(var(--main-six-h), var(--main-six-s), calc(var(--main-six-l) + (100% - var(--main-six-l)) * 0.8)); --main-six-200: hsl(var(--main-six-h), var(--main-six-s), calc(var(--main-six-l) + (100% - var(--main-six-l)) * 0.7)); --main-six-300: hsl(var(--main-six-h), var(--main-six-s), calc(var(--main-six-l) + (100% - var(--main-six-l)) * 0.6)); --main-six-400: hsl(var(--main-six-h), var(--main-six-s), calc(var(--main-six-l) + (100% - var(--main-six-l)) * 0.5)); --main-six-500: hsl(var(--main-six-h), var(--main-six-s), calc(var(--main-six-l) + (100% - var(--main-six-l)) * 0.4)); --main-six-600: hsl(var(--main-six-h), var(--main-six-s), var(--main-six-l)); --main-six-700: hsl(var(--main-six-h), var(--main-six-s), calc(var(--main-six-l) - var(--main-six-l) * 0.1)); --main-six-800: hsl(var(--main-six-h), var(--main-six-s), calc(var(--main-six-l) - var(--main-six-l) * 0.2)); --main-six-900: hsl(var(--main-six-h), var(--main-six-s), calc(var(--main-six-l) - var(--main-six-l) * 0.3)); --main-eight-50: hsl(var(--main-eight-h), var(--main-eight-s), calc(var(--main-eight-l) + (100% - var(--main-eight-l)) * 0.9)); --main-eight-100: hsl(var(--main-eight-h), var(--main-eight-s), calc(var(--main-eight-l) + (100% - var(--main-eight-l)) * 0.8)); --main-eight-200: hsl(var(--main-eight-h), var(--main-eight-s), calc(var(--main-eight-l) + (100% - var(--main-eight-l)) * 0.7)); --main-eight-300: hsl(var(--main-eight-h), var(--main-eight-s), calc(var(--main-eight-l) + (100% - var(--main-eight-l)) * 0.6)); --main-eight-400: hsl(var(--main-eight-h), var(--main-eight-s), calc(var(--main-eight-l) + (100% - var(--main-eight-l)) * 0.5)); --main-eight-500: hsl(var(--main-eight-h), var(--main-eight-s), calc(var(--main-eight-l) + (100% - var(--main-eight-l)) * 0.4)); --main-eight-600: hsl(var(--main-eight-h), var(--main-eight-s), var(--main-eight-l)); --main-eight-700: hsl(var(--main-eight-h), var(--main-eight-s), calc(var(--main-eight-l) - var(--main-eight-l) * 0.1)); --main-eight-800: hsl(var(--main-eight-h), var(--main-eight-s), calc(var(--main-eight-l) - var(--main-eight-l) * 0.2)); --main-eight-900: hsl(var(--main-eight-h), var(--main-eight-s), calc(var(--main-eight-l) - var(--main-eight-l) * 0.3)); --neutral-50: #f9fafb; --neutral-100: #f3f4f6; --neutral-200: #e5e7eb; --neutral-300: #d1d5db; --neutral-400: #9ca3af; --neutral-500: #6b7280; --neutral-600: #4b5563; --neutral-700: #374151; --neutral-800: #1f2937; --neutral-900: #111827; --neutral-950: #030712; --font-xs: 0.75rem; --font-sm: 0.875rem; --font-base: 1rem; --font-lg: 1.125rem; --font-xl: 1.25rem; --font-2xl: 1.5rem; --font-3xl: 1.875rem; } /* ========================= Variable Css End ======================== */ /* Media Breakpoint for Each Device End */ /* =========================== Accordion Css start ============================= */ .common-accordion .accordion-item:not(:last-child) { margin-block-end: 20px; } .common-accordion:first-of-type .accordion-button.collapsed { border-radius: 5px; } .common-accordion:last-of-type .accordion-button.collapsed { border-radius: 5px; } .common-accordion .accordion-button::after { background-image: none; } .common-accordion .accordion-button:focus { box-shadow: none; } .common-accordion .accordion-button:not(.collapsed) { background-color: transparent !important; box-shadow: none; color: var(--main-eight-600); } .common-accordion .accordion-button:not(.collapsed)::after { background-image: none; color: var(--main-eight-600); } .common-accordion .accordion-button[aria-expanded=true]::after, .common-accordion .accordion-button[aria-expanded=false]::after { font-family: "Phosphor"; font-weight: 900; content: "\f106"; color: var(--main-eight-600); display: inline-block; position: absolute; inset-block-start: 50%; transform: translateY(-50%); inset-inline-end: 30px; height: unset; text-align: center; } @media screen and (max-width: 575px) { .common-accordion .accordion-button[aria-expanded=true]::after, .common-accordion .accordion-button[aria-expanded=false]::after { inset-inline-end: 20px; } } .common-accordion .accordion-button[aria-expanded=false]::after { content: "\f107"; color: hsl(var(--heading-color)); } /* ================================= Accordion Css End =========================== */ /* ========================== Button Css Start =============== */ .button__label { position: relative; text-align: center; transition: color 0.05s cubic-bezier(0.645, 0.045, 0.355, 1); } .button--stroke:hover { color: #0e100f; } .button--stroke::after { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; border: 0.125rem solid #fffce1; border-radius: inherit; pointer-events: none; } .button--stroke .button__flair { transform: scale(0); transform-origin: 0 0; } .button--stroke .button__label { transition: color 0.15s cubic-bezier(0.645, 0.045, 0.355, 1); } .button__flair { position: absolute; top: 0; left: 0; right: 0; bottom: 0; pointer-events: none; } .button__flair::before { content: ""; position: absolute; top: 0; left: 0; width: 200%; aspect-ratio: 1/1; background-color: #fffce1; border-radius: 50%; transform: translate(-50%, -50%); pointer-events: none; } .btn { border: 0; color: hsl(var(--white)); line-height: 1; padding: 18px 32px; position: relative; overflow: hidden; border-radius: 6px; z-index: 1; transition: 0.2s linear; } .btn:hover, .btn:focus, .btn:focus-visible { box-shadow: none !important; } .btn-main { background-color: var(--main-eight-600) !important; color: hsl(var(--white)) !important; } .btn-main.button--stroke::after { border-color: transparent; } .hover-style-one:hover, .hover-style-one:active { background-color: var(--main-eight-600); } .hover-style-one:hover.button--stroke::after, .hover-style-one:active.button--stroke::after { border-color: transparent; } .hover-style-one .button__flair::before { background-color: var(--main-two-600); } .hover-style-two:hover, .hover-style-two:active { color: var(--main-two-600) !important; } .hover-style-two:hover.button--stroke::after, .hover-style-two:active.button--stroke::after { border-color: transparent; } .hover-style-two .button__flair::before { background-color: hsl(var(--white)); } .tw-primary-btn { padding: 7.5px 7.5px 7.5px 7.5px; } .tw-primary-btn .btn_inner { padding: 14px 65px 14px 37px; } .tw-primary-btn .btn_inner::before { content: ""; position: absolute; z-index: 0; top: 0; right: 0; width: 44px; height: 100%; background-color: hsl(var(--white)); border-radius: 50px; transition: all 0.3s ease-in-out 0s; } .tw-primary-btn .btn_inner .btn_icon { min-width: 44px; transform: rotate(-45deg); } .tw-primary-btn .btn_inner .btn_icon > span i:first-child, .tw-primary-btn .btn_inner .btn_icon > span i:last-child { transition: all 0.4s ease-in-out 0s; } .tw-primary-btn .btn_inner .btn_icon > span i:last-child { position: absolute; transform: translatex(-150%); } .tw-primary-btn .btn_inner .btn_text { text-shadow: 0 23px 0 currentColor; } .tw-primary-btn .btn_inner .btn_text > span { backface-visibility: hidden; transform: translateY(0); } .tw-primary-btn:hover .btn_inner::before { width: 100%; clip-path: polygon(0 0, 100% 0%, 100% 100%, 0% 100%); } .tw-primary-btn:hover .btn_inner .btn_icon i:first-child { transform: translateX(150%); } .tw-primary-btn:hover .btn_inner .btn_icon i:last-child { transform: translateX(0); } .tw-primary-btn:hover .btn_inner .btn_text { color: hsl(var(--black)) !important; } .tw-primary-btn:hover .btn_inner .btn_text > span { transform: translateY(-24px); } .tw-btn-circle { width: 161px; height: 161px; line-height: 1; display: inline-flex; align-items: center; justify-content: center; background: var(--main-four-600); border-radius: 50%; position: relative; overflow: hidden; } .tw-btn-circle .tw-btn-circle-icon { text-align: center; transition: 0.4s; } .tw-btn-circle .tw-hover-btn-wrapper { display: inline-block; } .tw-btn-circle .tw-btn-circle-dot { position: absolute; left: 42px; bottom: -15px; width: 20px; height: 20px; transition: all 0.6s; border-radius: 50%; background-color: hsl(var(--white)); transform: translate(-50%, -50%); z-index: -1; } .tw-btn-circle:hover .tw-btn-circle-dot { width: 420px; height: 420px; } .tw-btn-circle:hover .tw-btn-circle-icon img { filter: brightness(0) invert(0); } .tw-btn-circle:hover span { color: hsl(var(--heading-color)) !important; } .tw-btn-circle-icon img { transition: 0.4s; } @media screen and (max-width: 1199px) { .tw-hover-btn-wrapper { margin-block-start: var(--size-8) !important; } } /* =========================== Button Css End =================== */ /* ================================= Form Css Start =========================== */ /* input File Start */ .common-file[type=file] { line-height: 50px; padding: 0; position: relative; } .common-file[type=file]::file-selector-button { border: 1px solid hsl(var(--black)/0.08); padding: 4px 6px; border-radius: 0.2em; background-color: hsl(var(--main)) !important; transition: 0.2s linear; line-height: 25px; position: relative; margin-inline-start: 15px; color: hsl(var(--body-color)) !important; } .common-file[type=file]::file-selector-button:hover { background-color: var(--main-eight-600); border: 1px solid var(--main-eight-600); color: hsl(var(--black)); } /* input File End */ /* Autofill Css */ input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active, textarea:-webkit-autofill, textarea:-webkit-autofill:hover, textarea:-webkit-autofill:focus, textarea:-webkit-autofill:active { -webkit-transition: background-color 5000s ease-in-out 0s; transition: background-color 5000s ease-in-out 0s; } input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill, textarea:-webkit-autofill, textarea:-webkit-autofill, textarea:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px transparent inset; -webkit-text-fill-color: hsl(var(--heading-color)) !important; caret-color: hsl(var(--heading-color)); } /* Autofill Css End */ /* Number Arrow None */ input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; } input[type=number] { -moz-appearance: textfield; } /* Custom Checkbox & Radio Css Start */ .common-check { display: flex; align-items: center; margin-block-end: 16px; } .common-check:last-child { margin-block-end: 0; } .common-check a { display: inline; } .common-check.common-radio .form-check-input { border-radius: 50%; } .common-check.common-radio .form-check-input:checked { background-color: transparent !important; } .common-check.common-radio .form-check-input:checked::after { visibility: visible; opacity: 1; -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); } .common-check.common-radio .form-check-input:checked::before { display: none; } .common-check .form-check-input { transition: 0.2s linear; box-shadow: none; background-color: transparent; box-shadow: none !important; border: 0; position: relative; border-radius: 3px; width: 18px; height: 18px; border: 1px solid hsl(var(--black)/0.4); cursor: pointer; transition: 0.2s linear; margin-block-start: 0; } .common-check .form-check-input::before { position: absolute; content: "\e182"; font-family: "Phosphor"; font-weight: 900; color: hsl(var(--white)); font-size: 12px; inset-block-start: 50%; inset-inline-start: 50%; transform: translate(-50%, -50%); transition: 0.2s linear; visibility: hidden; opacity: 0; } .common-check .form-check-input::after { position: absolute; content: ""; inset-block-start: 50%; inset-inline-start: 50%; -webkit-transform: translate(-50%, -50%) scale(0.2); transform: translate(-50%, -50%) scale(0.2); width: 10px; height: 10px; background-color: var(--main-eight-600); border-radius: 50%; transition: 0.2s linear; z-index: 1; visibility: hidden; opacity: 0; } .common-check .form-check-input:checked { background-color: hsl(var(--main)) !important; border-color: hsl(var(--main)) !important; box-shadow: none; } .common-check .form-check-input:checked[type=checkbox] { background-image: none; } .common-check .form-check-input:checked::before { visibility: visible; opacity: 1; } /* Custom Checkbox & Radio Css End */ /* Switch Css Start */ .form-switch { padding-inline-start: 0; } .form-switch .form-check-input { box-shadow: none !important; margin: 0; position: relative; background-color: var(--gray-100); border: 0; background-image: none !important; width: 30px; height: 18px; } .form-switch .form-check-input:checked { background-color: var(--primary-600); } .form-switch .form-check-input:checked::before { inset-inline-start: calc(100% - 15px); transition: 0.2s linear; } .form-switch .form-check-input::before { position: absolute; content: ""; width: 12px; height: 12px; background: #fff; border-radius: 50%; top: 50%; transform: translateY(-50%); inset-inline-start: 3px; transition: 0.2s linear; } /* Switch Css End */ /* ================================= Form Css End =========================== */ /* ================================= Tab Css Start =========================== */ .common-tab .nav-item .nav-link.active { color: hsl(var(--white)) !important; border-color: hsl(var(--main)) !important; } .common-tab .nav-item .nav-link:hover { color: var(--main-eight-600); } /* ================================= Tab Css End =========================== */ /* ======================= Common Table Css Start ======================= */ .table > :not(caption) > * > * { border-bottom: 0; } .table tr th:first-child { padding-inline-start: 0; } .table tr th:last-child { padding-inline-end: 0; } .table tr th, .table tr td { vertical-align: middle; } .table tr th:first-child, .table tr td:first-child { text-align: left; } .table tr th:last-child, .table tr td:last-child { text-align: right; padding-inline-end: 0; } /* ======================= Common Table Css End ======================= */ /* Toast Message Css start */ :root { --success-600: #16A34A; /* Green */ --danger-600: #DC2626; /* Red */ --warning-600: #D97706; /* Amber */ --info-600: #0284C7; /* Sky Blue */ } #toast-container { position: fixed; inset-block-start: 20px; inset-inline-end: 20px; display: flex; flex-direction: column; gap: 16px; z-index: 9999; } .toast-message { position: relative; transition: all 0.5s cubic-bezier(0.68, -0.55, 0.25, 1.35); width: 300px; transform: translateX(calc(100% + 20px)); overflow: hidden; background-color: #fff; border-inline-start: 3px solid var(--success-600); box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); display: inline-block; padding-block: 12px; padding-inline: 16px; border-radius: 6px; } .toast-message.active { transform: translateX(0); } .toast-message.active .progress__bar::before { animation: progress-bar 3.5s linear forwards; visibility: visible; opacity: 1; } .toast-message:hover .progress__bar::before { animation-play-state: paused; } .toast-message__content { display: flex; align-items: center; gap: 16px; } .toast-message__icon { font-size: 24px; color: var(--success-600); line-height: 1; } .toast-message__title { margin-bottom: 0; font-size: 18px !important; } .toast-message__close { background-color: transparent; border: 0; padding: 0; line-height: 1; font-size: 16px; } .toast-message__text { color: #42494f; font-size: 14px; } .progress__bar { position: absolute; inset-block-end: 0; inset-inline-start: 0; height: 3px; width: 100%; background: #fff; } .progress__bar::before { content: ""; position: absolute; inset-block-end: 0; inset-inline-start: 0; height: 100%; width: 100%; background-color: var(--success-600); visibility: hidden; opacity: 0; } @keyframes progress-bar { from { width: 100%; } to { width: 0%; } } .success { border-color: var(--success-600); } .success .toast-message__icon { color: var(--success-600) !important; } .success .progress__bar::before { background-color: var(--success-600); } .danger { border-color: var(--danger-600); } .danger .toast-message__icon { color: var(--danger-600) !important; } .danger .progress__bar::before { background-color: var(--danger-600); } .warning { border-color: var(--warning-600); } .warning .toast-message__icon { color: var(--warning-600) !important; } .warning .progress__bar::before { background-color: var(--warning-600); } .info { border-color: var(--info-600); } .info .toast-message__icon { color: var(--info-600) !important; } .info .progress__bar::before { background-color: var(--info-600); } /* Toast Message Css End */ .nice-select { -webkit-tap-highlight-color: transparent; background-color: #fff; border-radius: 5px; border: solid 1px #e8e8e8; box-sizing: border-box; clear: both; cursor: pointer; display: block; float: left; font-family: inherit; font-size: 14px; font-weight: normal; height: 42px; line-height: 40px; outline: none; padding-left: 18px; padding-right: 30px; position: relative; text-align: left !important; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; white-space: nowrap; width: auto; } .nice-select:hover { border-color: #dbdbdb; } .nice-select:active, .nice-select.open, .nice-select:focus { border-color: #999; } .nice-select:after { border-bottom: 2px solid #999; border-right: 2px solid #999; content: ""; display: block; height: 10px; margin-top: -4px; pointer-events: none; position: absolute; right: 20px; top: 50%; -webkit-transform-origin: 66% 66%; -ms-transform-origin: 66% 66%; transform-origin: 66% 66%; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out; width: 10px; } .nice-select.open:after { -webkit-transform: rotate(-135deg); -ms-transform: rotate(-135deg); transform: rotate(-135deg); } .nice-select.open .list { opacity: 1; pointer-events: auto; -webkit-transform: scale(1) translateY(0); -ms-transform: scale(1) translateY(0); transform: scale(1) translateY(0); } .nice-select.disabled { border-color: #ededed; color: #999; pointer-events: none; } .nice-select.disabled:after { border-color: #cccccc; } .nice-select.wide { width: 100%; } .nice-select.wide .list { left: 0 !important; right: 0 !important; } .nice-select.right { float: right; } .nice-select.right .list { left: auto; right: 0; } .nice-select.small { font-size: 12px; height: 36px; line-height: 34px; } .nice-select.small:after { height: 4px; width: 4px; } .nice-select.small .option { line-height: 34px; min-height: 34px; } .nice-select .list { background-color: #fff; border-radius: 5px; box-shadow: 0 0 0 1px rgba(68, 68, 68, 0.11); box-sizing: border-box; margin-top: 4px; opacity: 0; overflow: hidden; padding: 0; pointer-events: none; position: absolute; top: 100%; left: 0; -webkit-transform-origin: 50% 0; -ms-transform-origin: 50% 0; transform-origin: 50% 0; -webkit-transform: scale(0.75) translateY(-21px); -ms-transform: scale(0.75) translateY(-21px); transform: scale(0.75) translateY(-21px); -webkit-transition: all 0.2s cubic-bezier(0.5, 0, 0, 1.25), opacity 0.15s ease-out; transition: all 0.2s cubic-bezier(0.5, 0, 0, 1.25), opacity 0.15s ease-out; z-index: 9; } .nice-select .list:hover .option:not(:hover) { background-color: transparent !important; } .nice-select .option { cursor: pointer; font-weight: 400; line-height: 40px; list-style: none; min-height: 40px; outline: none; padding-left: 18px; padding-right: 29px; text-align: left; -webkit-transition: all 0.2s; transition: all 0.2s; } .nice-select .option:hover, .nice-select .option.focus, .nice-select .option.selected.focus { background-color: #f6f6f6; } .nice-select .option.selected { font-weight: bold; } .nice-select .option.disabled { background-color: transparent; color: #999; cursor: default; } .no-csspointerevents .nice-select .list { display: none; } .no-csspointerevents .nice-select.open .list { display: block; } /* ================================= Typography Css Start =========================== */ * { margin: 0; padding: 0; box-sizing: border-box; } #scrollSmoother-container { overflow: hidden !important; } html { scroll-behavior: smooth; } body { font-family: var(--body-font); color: hsl(var(--body-color)); word-break: break-word; background-color: hsl(var(--white)); min-height: 100vh; display: flex; flex-direction: column; } p { font-weight: 400; margin: 0; line-height: 1.6; } span { display: inline-block; } h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { margin: 0; font-family: var(--heading-font); color: hsl(var(--heading-color)); line-height: 1.2; font-weight: 600; } h1, .h1 { font-size: var(--heading-one); } h2, .h2 { font-size: var(--heading-two); } h3, .h3 { font-size: var(--heading-three); } h4, .h4 { font-size: var(--heading-four); } h5, .h5 { font-size: var(--heading-five); } h6, .h6 { font-size: var(--heading-six); } h1 > a, h2 > a, h3 > a, h4 > a, h5 > a, h6 > a { font-weight: inherit; font-size: inherit; color: inherit; transition: 0.2s linear; line-height: inherit; } h1 > a:hover, h2 > a:hover, h3 > a:hover, h4 > a:hover, h5 > a:hover, h6 > a:hover { color: var(--main-eight-600); } a { display: inline-block; transition: 0.2s linear; text-decoration: none; color: #0661e9; } a:hover { color: #1d72f2; } img { max-width: 100%; height: auto; } select { cursor: pointer; } ul, ol { padding: 0; margin: 0; list-style: none; } button { border: 0; background-color: transparent; } button:focus { outline: none; box-shadow: none; } input:focus, input:focus-visible { box-shadow: none; } /* ================================= Typography Css End =========================== */ /* Bg Image Css Start */ .bg-img { background-size: cover; background-repeat: no-repeat; background-position: center center; width: 100%; height: 100%; } /* Bg Image Css End */ /* hover bg class start */ .bg-main-50 { background-color: var(--main-50) !important; } .bg-main-100 { background-color: var(--main-100) !important; } .bg-main-200 { background-color: var(--main-200) !important; } .bg-main-300 { background-color: var(--main-300) !important; } .bg-main-400 { background-color: var(--main-400) !important; } .bg-main-500 { background-color: var(--main-500) !important; } .bg-main-600 { background-color: var(--main-600) !important; } .bg-main-700 { background-color: var(--main-700) !important; } .bg-main-800 { background-color: var(--main-800) !important; } .bg-main-900 { background-color: var(--main-900) !important; } .bg-main-two-50 { background-color: var(--main-two-50) !important; } .bg-main-two-100 { background-color: var(--main-two-100) !important; } .bg-main-two-200 { background-color: var(--main-two-200) !important; } .bg-main-two-300 { background-color: var(--main-two-300) !important; } .bg-main-two-400 { background-color: var(--main-two-400) !important; } .bg-main-two-500 { background-color: var(--main-two-500) !important; } .bg-main-two-600 { background-color: var(--main-two-600) !important; } .bg-main-two-700 { background-color: var(--main-two-700) !important; } .bg-main-two-800 { background-color: var(--main-two-800) !important; } .bg-main-two-900 { background-color: var(--main-two-900) !important; } .bg-main-four-50 { background-color: var(--main-four-50) !important; } .bg-main-four-100 { background-color: var(--main-four-100) !important; } .bg-main-four-200 { background-color: var(--main-four-200) !important; } .bg-main-four-300 { background-color: var(--main-four-300) !important; } .bg-main-four-400 { background-color: var(--main-four-400) !important; } .bg-main-four-500 { background-color: var(--main-four-500) !important; } .bg-main-four-600 { background-color: var(--main-four-600) !important; } .bg-main-four-700 { background-color: var(--main-four-700) !important; } .bg-main-four-800 { background-color: var(--main-four-800) !important; } .bg-main-four-900 { background-color: var(--main-four-900) !important; } .bg-main-six-50 { background-color: var(--main-six-50) !important; } .bg-main-six-100 { background-color: var(--main-six-100) !important; } .bg-main-six-200 { background-color: var(--main-six-200) !important; } .bg-main-six-300 { background-color: var(--main-six-300) !important; } .bg-main-six-400 { background-color: var(--main-six-400) !important; } .bg-main-six-500 { background-color: var(--main-six-500) !important; } .bg-main-six-600 { background-color: var(--main-six-600) !important; } .bg-main-six-700 { background-color: var(--main-six-700) !important; } .bg-main-six-800 { background-color: var(--main-six-800) !important; } .bg-main-six-900 { background-color: var(--main-six-900) !important; } .bg-main-eight-50 { background-color: var(--main-eight-50) !important; } .bg-main-eight-100 { background-color: var(--main-eight-100) !important; } .bg-main-eight-200 { background-color: var(--main-eight-200) !important; } .bg-main-eight-300 { background-color: var(--main-eight-300) !important; } .bg-main-eight-400 { background-color: var(--main-eight-400) !important; } .bg-main-eight-500 { background-color: var(--main-eight-500) !important; } .bg-main-eight-600 { background-color: var(--main-eight-600) !important; } .bg-main-eight-700 { background-color: var(--main-eight-700) !important; } .bg-main-eight-800 { background-color: var(--main-eight-800) !important; } .bg-main-eight-900 { background-color: var(--main-eight-900) !important; } .bg-neutral-50 { background-color: var(--neutral-50) !important; } .bg-neutral-100 { background-color: var(--neutral-100) !important; } .bg-neutral-200 { background-color: var(--neutral-200) !important; } .bg-neutral-300 { background-color: var(--neutral-300) !important; } .bg-neutral-400 { background-color: var(--neutral-400) !important; } .bg-neutral-500 { background-color: var(--neutral-500) !important; } .bg-neutral-600 { background-color: var(--neutral-600) !important; } .bg-neutral-700 { background-color: var(--neutral-700) !important; } .bg-neutral-800 { background-color: var(--neutral-800) !important; } .bg-neutral-900 { background-color: var(--neutral-900) !important; } .bg-neutral-950 { background-color: var(--neutral-950) !important; } .hover-bg-main-50:hover { background-color: var(--main-50) !important; } .hover-bg-main-100:hover { background-color: var(--main-100) !important; } .hover-bg-main-200:hover { background-color: var(--main-200) !important; } .hover-bg-main-300:hover { background-color: var(--main-300) !important; } .hover-bg-main-400:hover { background-color: var(--main-400) !important; } .hover-bg-main-500:hover { background-color: var(--main-500) !important; } .hover-bg-main-600:hover { background-color: var(--main-600) !important; } .hover-bg-main-700:hover { background-color: var(--main-700) !important; } .hover-bg-main-800:hover { background-color: var(--main-800) !important; } .hover-bg-main-900:hover { background-color: var(--main-900) !important; } .hover-bg-main-two-50:hover { background-color: var(--main-two-50) !important; } .hover-bg-main-two-100:hover { background-color: var(--main-two-100) !important; } .hover-bg-main-two-200:hover { background-color: var(--main-two-200) !important; } .hover-bg-main-two-300:hover { background-color: var(--main-two-300) !important; } .hover-bg-main-two-400:hover { background-color: var(--main-two-400) !important; } .hover-bg-main-two-500:hover { background-color: var(--main-two-500) !important; } .hover-bg-main-two-600:hover { background-color: var(--main-two-600) !important; } .hover-bg-main-two-700:hover { background-color: var(--main-two-700) !important; } .hover-bg-main-two-800:hover { background-color: var(--main-two-800) !important; } .hover-bg-main-two-900:hover { background-color: var(--main-two-900) !important; } .hover-bg-main-four-50:hover { background-color: var(--main-four-50) !important; } .hover-bg-main-four-100:hover { background-color: var(--main-four-100) !important; } .hover-bg-main-four-200:hover { background-color: var(--main-four-200) !important; } .hover-bg-main-four-300:hover { background-color: var(--main-four-300) !important; } .hover-bg-main-four-400:hover { background-color: var(--main-four-400) !important; } .hover-bg-main-four-500:hover { background-color: var(--main-four-500) !important; } .hover-bg-main-four-600:hover { background-color: var(--main-four-600) !important; } .hover-bg-main-four-700:hover { background-color: var(--main-four-700) !important; } .hover-bg-main-four-800:hover { background-color: var(--main-four-800) !important; } .hover-bg-main-four-900:hover { background-color: var(--main-four-900) !important; } .hover-bg-main-six-50:hover { background-color: var(--main-six-50) !important; } .hover-bg-main-six-100:hover { background-color: var(--main-six-100) !important; } .hover-bg-main-six-200:hover { background-color: var(--main-six-200) !important; } .hover-bg-main-six-300:hover { background-color: var(--main-six-300) !important; } .hover-bg-main-six-400:hover { background-color: var(--main-six-400) !important; } .hover-bg-main-six-500:hover { background-color: var(--main-six-500) !important; } .hover-bg-main-six-600:hover { background-color: var(--main-six-600) !important; } .hover-bg-main-six-700:hover { background-color: var(--main-six-700) !important; } .hover-bg-main-six-800:hover { background-color: var(--main-six-800) !important; } .hover-bg-main-six-900:hover { background-color: var(--main-six-900) !important; } .hover-bg-main-eight-50:hover { background-color: var(--main-eight-50) !important; } .hover-bg-main-eight-100:hover { background-color: var(--main-eight-100) !important; } .hover-bg-main-eight-200:hover { background-color: var(--main-eight-200) !important; } .hover-bg-main-eight-300:hover { background-color: var(--main-eight-300) !important; } .hover-bg-main-eight-400:hover { background-color: var(--main-eight-400) !important; } .hover-bg-main-eight-500:hover { background-color: var(--main-eight-500) !important; } .hover-bg-main-eight-600:hover { background-color: var(--main-eight-600) !important; } .hover-bg-main-eight-700:hover { background-color: var(--main-eight-700) !important; } .hover-bg-main-eight-800:hover { background-color: var(--main-eight-800) !important; } .hover-bg-main-eight-900:hover { background-color: var(--main-eight-900) !important; } .hover-bg-neutral-50:hover { background-color: var(--neutral-50) !important; } .hover-bg-neutral-100:hover { background-color: var(--neutral-100) !important; } .hover-bg-neutral-200:hover { background-color: var(--neutral-200) !important; } .hover-bg-neutral-300:hover { background-color: var(--neutral-300) !important; } .hover-bg-neutral-400:hover { background-color: var(--neutral-400) !important; } .hover-bg-neutral-500:hover { background-color: var(--neutral-500) !important; } .hover-bg-neutral-600:hover { background-color: var(--neutral-600) !important; } .hover-bg-neutral-700:hover { background-color: var(--neutral-700) !important; } .hover-bg-neutral-800:hover { background-color: var(--neutral-800) !important; } .hover-bg-neutral-900:hover { background-color: var(--neutral-900) !important; } .hover-bg-neutral-950:hover { background-color: var(--neutral-950) !important; } .hover-bg-white:hover { background-color: hsl(var(--white)) !important; } .bg-white-08 { background-color: hsl(var(--white)/0.08); } .bg-white-13 { background-color: hsl(var(--white)/0.13); } .bg-white-7 { background-color: hsl(var(--white)/0.7); } .bg-white-06 { background-color: hsl(var(--white)/0.06); } .bg-black { background-color: hsl(var(--black)) !important; } .bg-img { background-size: cover !important; background-repeat: no-repeat !important; background-position: center center !important; width: 100%; height: 100%; } /* hover bg class end */ .border-main-50 { border-color: var(--main-50) !important; } .border-main-100 { border-color: var(--main-100) !important; } .border-main-200 { border-color: var(--main-200) !important; } .border-main-300 { border-color: var(--main-300) !important; } .border-main-400 { border-color: var(--main-400) !important; } .border-main-500 { border-color: var(--main-500) !important; } .border-main-600 { border-color: var(--main-600) !important; } .border-main-700 { border-color: var(--main-700) !important; } .border-main-800 { border-color: var(--main-800) !important; } .border-main-900 { border-color: var(--main-900) !important; } .border-main-two-50 { border-color: var(--main-two-50) !important; } .border-main-two-100 { border-color: var(--main-two-100) !important; } .border-main-two-200 { border-color: var(--main-two-200) !important; } .border-main-two-300 { border-color: var(--main-two-300) !important; } .border-main-two-400 { border-color: var(--main-two-400) !important; } .border-main-two-500 { border-color: var(--main-two-500) !important; } .border-main-two-600 { border-color: var(--main-two-600) !important; } .border-main-two-700 { border-color: var(--main-two-700) !important; } .border-main-two-800 { border-color: var(--main-two-800) !important; } .border-main-two-900 { border-color: var(--main-two-900) !important; } .border-main-four-50 { border-color: var(--main-four-50) !important; } .border-main-four-100 { border-color: var(--main-four-100) !important; } .border-main-four-200 { border-color: var(--main-four-200) !important; } .border-main-four-300 { border-color: var(--main-four-300) !important; } .border-main-four-400 { border-color: var(--main-four-400) !important; } .border-main-four-500 { border-color: var(--main-four-500) !important; } .border-main-four-600 { border-color: var(--main-four-600) !important; } .border-main-four-700 { border-color: var(--main-four-700) !important; } .border-main-four-800 { border-color: var(--main-four-800) !important; } .border-main-four-900 { border-color: var(--main-four-900) !important; } .border-main-six-50 { border-color: var(--main-six-50) !important; } .border-main-six-100 { border-color: var(--main-six-100) !important; } .border-main-six-200 { border-color: var(--main-six-200) !important; } .border-main-six-300 { border-color: var(--main-six-300) !important; } .border-main-six-400 { border-color: var(--main-six-400) !important; } .border-main-six-500 { border-color: var(--main-six-500) !important; } .border-main-six-600 { border-color: var(--main-six-600) !important; } .border-main-six-700 { border-color: var(--main-six-700) !important; } .border-main-six-800 { border-color: var(--main-six-800) !important; } .border-main-six-900 { border-color: var(--main-six-900) !important; } .border-main-eight-50 { border-color: var(--main-eight-50) !important; } .border-main-eight-100 { border-color: var(--main-eight-100) !important; } .border-main-eight-200 { border-color: var(--main-eight-200) !important; } .border-main-eight-300 { border-color: var(--main-eight-300) !important; } .border-main-eight-400 { border-color: var(--main-eight-400) !important; } .border-main-eight-500 { border-color: var(--main-eight-500) !important; } .border-main-eight-600 { border-color: var(--main-eight-600) !important; } .border-main-eight-700 { border-color: var(--main-eight-700) !important; } .border-main-eight-800 { border-color: var(--main-eight-800) !important; } .border-main-eight-900 { border-color: var(--main-eight-900) !important; } .border-neutral-50 { border-color: var(--neutral-50) !important; } .border-neutral-100 { border-color: var(--neutral-100) !important; } .border-neutral-200 { border-color: var(--neutral-200) !important; } .border-neutral-300 { border-color: var(--neutral-300) !important; } .border-neutral-400 { border-color: var(--neutral-400) !important; } .border-neutral-500 { border-color: var(--neutral-500) !important; } .border-neutral-600 { border-color: var(--neutral-600) !important; } .border-neutral-700 { border-color: var(--neutral-700) !important; } .border-neutral-800 { border-color: var(--neutral-800) !important; } .border-neutral-900 { border-color: var(--neutral-900) !important; } .border-neutral-950 { border-color: var(--neutral-950) !important; } .hover-border-main-50:hover { border-color: var(--main-50) !important; } .hover-border-main-100:hover { border-color: var(--main-100) !important; } .hover-border-main-200:hover { border-color: var(--main-200) !important; } .hover-border-main-300:hover { border-color: var(--main-300) !important; } .hover-border-main-400:hover { border-color: var(--main-400) !important; } .hover-border-main-500:hover { border-color: var(--main-500) !important; } .hover-border-main-600:hover { border-color: var(--main-600) !important; } .hover-border-main-700:hover { border-color: var(--main-700) !important; } .hover-border-main-800:hover { border-color: var(--main-800) !important; } .hover-border-main-900:hover { border-color: var(--main-900) !important; } .hover-border-main-two-50:hover { border-color: var(--main-two-50) !important; } .hover-border-main-two-100:hover { border-color: var(--main-two-100) !important; } .hover-border-main-two-200:hover { border-color: var(--main-two-200) !important; } .hover-border-main-two-300:hover { border-color: var(--main-two-300) !important; } .hover-border-main-two-400:hover { border-color: var(--main-two-400) !important; } .hover-border-main-two-500:hover { border-color: var(--main-two-500) !important; } .hover-border-main-two-600:hover { border-color: var(--main-two-600) !important; } .hover-border-main-two-700:hover { border-color: var(--main-two-700) !important; } .hover-border-main-two-800:hover { border-color: var(--main-two-800) !important; } .hover-border-main-two-900:hover { border-color: var(--main-two-900) !important; } .hover-border-main-four-50:hover { border-color: var(--main-four-50) !important; } .hover-border-main-four-100:hover { border-color: var(--main-four-100) !important; } .hover-border-main-four-200:hover { border-color: var(--main-four-200) !important; } .hover-border-main-four-300:hover { border-color: var(--main-four-300) !important; } .hover-border-main-four-400:hover { border-color: var(--main-four-400) !important; } .hover-border-main-four-500:hover { border-color: var(--main-four-500) !important; } .hover-border-main-four-600:hover { border-color: var(--main-four-600) !important; } .hover-border-main-four-700:hover { border-color: var(--main-four-700) !important; } .hover-border-main-four-800:hover { border-color: var(--main-four-800) !important; } .hover-border-main-four-900:hover { border-color: var(--main-four-900) !important; } .hover-border-main-six-50:hover { border-color: var(--main-six-50) !important; } .hover-border-main-six-100:hover { border-color: var(--main-six-100) !important; } .hover-border-main-six-200:hover { border-color: var(--main-six-200) !important; } .hover-border-main-six-300:hover { border-color: var(--main-six-300) !important; } .hover-border-main-six-400:hover { border-color: var(--main-six-400) !important; } .hover-border-main-six-500:hover { border-color: var(--main-six-500) !important; } .hover-border-main-six-600:hover { border-color: var(--main-six-600) !important; } .hover-border-main-six-700:hover { border-color: var(--main-six-700) !important; } .hover-border-main-six-800:hover { border-color: var(--main-six-800) !important; } .hover-border-main-six-900:hover { border-color: var(--main-six-900) !important; } .hover-border-main-eight-50:hover { border-color: var(--main-eight-50) !important; } .hover-border-main-eight-100:hover { border-color: var(--main-eight-100) !important; } .hover-border-main-eight-200:hover { border-color: var(--main-eight-200) !important; } .hover-border-main-eight-300:hover { border-color: var(--main-eight-300) !important; } .hover-border-main-eight-400:hover { border-color: var(--main-eight-400) !important; } .hover-border-main-eight-500:hover { border-color: var(--main-eight-500) !important; } .hover-border-main-eight-600:hover { border-color: var(--main-eight-600) !important; } .hover-border-main-eight-700:hover { border-color: var(--main-eight-700) !important; } .hover-border-main-eight-800:hover { border-color: var(--main-eight-800) !important; } .hover-border-main-eight-900:hover { border-color: var(--main-eight-900) !important; } .hover-border-neutral-50:hover { border-color: var(--neutral-50) !important; } .hover-border-neutral-100:hover { border-color: var(--neutral-100) !important; } .hover-border-neutral-200:hover { border-color: var(--neutral-200) !important; } .hover-border-neutral-300:hover { border-color: var(--neutral-300) !important; } .hover-border-neutral-400:hover { border-color: var(--neutral-400) !important; } .hover-border-neutral-500:hover { border-color: var(--neutral-500) !important; } .hover-border-neutral-600:hover { border-color: var(--neutral-600) !important; } .hover-border-neutral-700:hover { border-color: var(--neutral-700) !important; } .hover-border-neutral-800:hover { border-color: var(--neutral-800) !important; } .hover-border-neutral-900:hover { border-color: var(--neutral-900) !important; } .hover-border-neutral-950:hover { border-color: var(--neutral-950) !important; } .focus-border-main-50:focus { border-color: var(--main-50) !important; } .focus-border-main-100:focus { border-color: var(--main-100) !important; } .focus-border-main-200:focus { border-color: var(--main-200) !important; } .focus-border-main-300:focus { border-color: var(--main-300) !important; } .focus-border-main-400:focus { border-color: var(--main-400) !important; } .focus-border-main-500:focus { border-color: var(--main-500) !important; } .focus-border-main-600:focus { border-color: var(--main-600) !important; } .focus-border-main-700:focus { border-color: var(--main-700) !important; } .focus-border-main-800:focus { border-color: var(--main-800) !important; } .focus-border-main-900:focus { border-color: var(--main-900) !important; } .focus-border-main-two-50:focus { border-color: var(--main-two-50) !important; } .focus-border-main-two-100:focus { border-color: var(--main-two-100) !important; } .focus-border-main-two-200:focus { border-color: var(--main-two-200) !important; } .focus-border-main-two-300:focus { border-color: var(--main-two-300) !important; } .focus-border-main-two-400:focus { border-color: var(--main-two-400) !important; } .focus-border-main-two-500:focus { border-color: var(--main-two-500) !important; } .focus-border-main-two-600:focus { border-color: var(--main-two-600) !important; } .focus-border-main-two-700:focus { border-color: var(--main-two-700) !important; } .focus-border-main-two-800:focus { border-color: var(--main-two-800) !important; } .focus-border-main-two-900:focus { border-color: var(--main-two-900) !important; } .focus-border-main-four-50:focus { border-color: var(--main-four-50) !important; } .focus-border-main-four-100:focus { border-color: var(--main-four-100) !important; } .focus-border-main-four-200:focus { border-color: var(--main-four-200) !important; } .focus-border-main-four-300:focus { border-color: var(--main-four-300) !important; } .focus-border-main-four-400:focus { border-color: var(--main-four-400) !important; } .focus-border-main-four-500:focus { border-color: var(--main-four-500) !important; } .focus-border-main-four-600:focus { border-color: var(--main-four-600) !important; } .focus-border-main-four-700:focus { border-color: var(--main-four-700) !important; } .focus-border-main-four-800:focus { border-color: var(--main-four-800) !important; } .focus-border-main-four-900:focus { border-color: var(--main-four-900) !important; } .focus-border-main-six-50:focus { border-color: var(--main-six-50) !important; } .focus-border-main-six-100:focus { border-color: var(--main-six-100) !important; } .focus-border-main-six-200:focus { border-color: var(--main-six-200) !important; } .focus-border-main-six-300:focus { border-color: var(--main-six-300) !important; } .focus-border-main-six-400:focus { border-color: var(--main-six-400) !important; } .focus-border-main-six-500:focus { border-color: var(--main-six-500) !important; } .focus-border-main-six-600:focus { border-color: var(--main-six-600) !important; } .focus-border-main-six-700:focus { border-color: var(--main-six-700) !important; } .focus-border-main-six-800:focus { border-color: var(--main-six-800) !important; } .focus-border-main-six-900:focus { border-color: var(--main-six-900) !important; } .focus-border-main-eight-50:focus { border-color: var(--main-eight-50) !important; } .focus-border-main-eight-100:focus { border-color: var(--main-eight-100) !important; } .focus-border-main-eight-200:focus { border-color: var(--main-eight-200) !important; } .focus-border-main-eight-300:focus { border-color: var(--main-eight-300) !important; } .focus-border-main-eight-400:focus { border-color: var(--main-eight-400) !important; } .focus-border-main-eight-500:focus { border-color: var(--main-eight-500) !important; } .focus-border-main-eight-600:focus { border-color: var(--main-eight-600) !important; } .focus-border-main-eight-700:focus { border-color: var(--main-eight-700) !important; } .focus-border-main-eight-800:focus { border-color: var(--main-eight-800) !important; } .focus-border-main-eight-900:focus { border-color: var(--main-eight-900) !important; } .focus-border-neutral-50:focus { border-color: var(--neutral-50) !important; } .focus-border-neutral-100:focus { border-color: var(--neutral-100) !important; } .focus-border-neutral-200:focus { border-color: var(--neutral-200) !important; } .focus-border-neutral-300:focus { border-color: var(--neutral-300) !important; } .focus-border-neutral-400:focus { border-color: var(--neutral-400) !important; } .focus-border-neutral-500:focus { border-color: var(--neutral-500) !important; } .focus-border-neutral-600:focus { border-color: var(--neutral-600) !important; } .focus-border-neutral-700:focus { border-color: var(--neutral-700) !important; } .focus-border-neutral-800:focus { border-color: var(--neutral-800) !important; } .focus-border-neutral-900:focus { border-color: var(--neutral-900) !important; } .focus-border-neutral-950:focus { border-color: var(--neutral-950) !important; } .tw-border-dashed { border-style: dashed !important; } .border-transparent { border-color: transparent !important; } /* Colors class start */ .text-main-50 { color: var(--main-50); } .text-main-100 { color: var(--main-100); } .text-main-200 { color: var(--main-200); } .text-main-300 { color: var(--main-300); } .text-main-400 { color: var(--main-400); } .text-main-500 { color: var(--main-500); } .text-main-600 { color: var(--main-600); } .text-main-700 { color: var(--main-700); } .text-main-800 { color: var(--main-800); } .text-main-900 { color: var(--main-900); } .text-main-two-50 { color: var(--main-two-50); } .text-main-two-100 { color: var(--main-two-100); } .text-main-two-200 { color: var(--main-two-200); } .text-main-two-300 { color: var(--main-two-300); } .text-main-two-400 { color: var(--main-two-400); } .text-main-two-500 { color: var(--main-two-500); } .text-main-two-600 { color: var(--main-two-600); } .text-main-two-700 { color: var(--main-two-700); } .text-main-two-800 { color: var(--main-two-800); } .text-main-two-900 { color: var(--main-two-900); } .text-main-four-50 { color: var(--main-four-50); } .text-main-four-100 { color: var(--main-four-100); } .text-main-four-200 { color: var(--main-four-200); } .text-main-four-300 { color: var(--main-four-300); } .text-main-four-400 { color: var(--main-four-400); } .text-main-four-500 { color: var(--main-four-500); } .text-main-four-600 { color: var(--main-four-600); } .text-main-four-700 { color: var(--main-four-700); } .text-main-four-800 { color: var(--main-four-800); } .text-main-four-900 { color: var(--main-four-900); } .text-main-six-50 { color: var(--main-six-50); } .text-main-six-100 { color: var(--main-six-100); } .text-main-six-200 { color: var(--main-six-200); } .text-main-six-300 { color: var(--main-six-300); } .text-main-six-400 { color: var(--main-six-400); } .text-main-six-500 { color: var(--main-six-500); } .text-main-six-600 { color: var(--main-six-600); } .text-main-six-700 { color: var(--main-six-700); } .text-main-six-800 { color: var(--main-six-800); } .text-main-six-900 { color: var(--main-six-900); } .text-main-eight-50 { color: var(--main-eight-50); } .text-main-eight-100 { color: var(--main-eight-100); } .text-main-eight-200 { color: var(--main-eight-200); } .text-main-eight-300 { color: var(--main-eight-300); } .text-main-eight-400 { color: var(--main-eight-400); } .text-main-eight-500 { color: var(--main-eight-500); } .text-main-eight-600 { color: var(--main-eight-600); } .text-main-eight-700 { color: var(--main-eight-700); } .text-main-eight-800 { color: var(--main-eight-800); } .text-main-eight-900 { color: var(--main-eight-900); } .text-neutral-50 { color: var(--neutral-50); } .text-neutral-100 { color: var(--neutral-100); } .text-neutral-200 { color: var(--neutral-200); } .text-neutral-300 { color: var(--neutral-300); } .text-neutral-400 { color: var(--neutral-400); } .text-neutral-500 { color: var(--neutral-500); } .text-neutral-600 { color: var(--neutral-600); } .text-neutral-700 { color: var(--neutral-700); } .text-neutral-800 { color: var(--neutral-800); } .text-neutral-900 { color: var(--neutral-900); } .text-neutral-950 { color: var(--neutral-950); } .text--white { color: hsl(var(--white)); } .text-heading { color: hsl(var(--heading-color)); } .text-body { color: hsl(var(--body-color)) !important; } .text-main { color: var(--main-eight-600); } /* Colors class End */ /* Hover color class start */ .hover-text-main-50:hover { color: var(--main-50) !important; } .hover-text-main-100:hover { color: var(--main-100) !important; } .hover-text-main-200:hover { color: var(--main-200) !important; } .hover-text-main-300:hover { color: var(--main-300) !important; } .hover-text-main-400:hover { color: var(--main-400) !important; } .hover-text-main-500:hover { color: var(--main-500) !important; } .hover-text-main-600:hover { color: var(--main-600) !important; } .hover-text-main-700:hover { color: var(--main-700) !important; } .hover-text-main-800:hover { color: var(--main-800) !important; } .hover-text-main-900:hover { color: var(--main-900) !important; } .hover-text-main-two-50:hover { color: var(--main-two-50) !important; } .hover-text-main-two-100:hover { color: var(--main-two-100) !important; } .hover-text-main-two-200:hover { color: var(--main-two-200) !important; } .hover-text-main-two-300:hover { color: var(--main-two-300) !important; } .hover-text-main-two-400:hover { color: var(--main-two-400) !important; } .hover-text-main-two-500:hover { color: var(--main-two-500) !important; } .hover-text-main-two-600:hover { color: var(--main-two-600) !important; } .hover-text-main-two-700:hover { color: var(--main-two-700) !important; } .hover-text-main-two-800:hover { color: var(--main-two-800) !important; } .hover-text-main-two-900:hover { color: var(--main-two-900) !important; } .hover-text-main-four-50:hover { color: var(--main-four-50) !important; } .hover-text-main-four-100:hover { color: var(--main-four-100) !important; } .hover-text-main-four-200:hover { color: var(--main-four-200) !important; } .hover-text-main-four-300:hover { color: var(--main-four-300) !important; } .hover-text-main-four-400:hover { color: var(--main-four-400) !important; } .hover-text-main-four-500:hover { color: var(--main-four-500) !important; } .hover-text-main-four-600:hover { color: var(--main-four-600) !important; } .hover-text-main-four-700:hover { color: var(--main-four-700) !important; } .hover-text-main-four-800:hover { color: var(--main-four-800) !important; } .hover-text-main-four-900:hover { color: var(--main-four-900) !important; } .hover-text-main-six-50:hover { color: var(--main-six-50) !important; } .hover-text-main-six-100:hover { color: var(--main-six-100) !important; } .hover-text-main-six-200:hover { color: var(--main-six-200) !important; } .hover-text-main-six-300:hover { color: var(--main-six-300) !important; } .hover-text-main-six-400:hover { color: var(--main-six-400) !important; } .hover-text-main-six-500:hover { color: var(--main-six-500) !important; } .hover-text-main-six-600:hover { color: var(--main-six-600) !important; } .hover-text-main-six-700:hover { color: var(--main-six-700) !important; } .hover-text-main-six-800:hover { color: var(--main-six-800) !important; } .hover-text-main-six-900:hover { color: var(--main-six-900) !important; } .hover-text-main-eight-50:hover { color: var(--main-eight-50) !important; } .hover-text-main-eight-100:hover { color: var(--main-eight-100) !important; } .hover-text-main-eight-200:hover { color: var(--main-eight-200) !important; } .hover-text-main-eight-300:hover { color: var(--main-eight-300) !important; } .hover-text-main-eight-400:hover { color: var(--main-eight-400) !important; } .hover-text-main-eight-500:hover { color: var(--main-eight-500) !important; } .hover-text-main-eight-600:hover { color: var(--main-eight-600) !important; } .hover-text-main-eight-700:hover { color: var(--main-eight-700) !important; } .hover-text-main-eight-800:hover { color: var(--main-eight-800) !important; } .hover-text-main-eight-900:hover { color: var(--main-eight-900) !important; } .hover-text-neutral-50:hover { color: var(--neutral-50) !important; } .hover-text-neutral-100:hover { color: var(--neutral-100) !important; } .hover-text-neutral-200:hover { color: var(--neutral-200) !important; } .hover-text-neutral-300:hover { color: var(--neutral-300) !important; } .hover-text-neutral-400:hover { color: var(--neutral-400) !important; } .hover-text-neutral-500:hover { color: var(--neutral-500) !important; } .hover-text-neutral-600:hover { color: var(--neutral-600) !important; } .hover-text-neutral-700:hover { color: var(--neutral-700) !important; } .hover-text-neutral-800:hover { color: var(--neutral-800) !important; } .hover-text-neutral-900:hover { color: var(--neutral-900) !important; } .hover-text-neutral-950:hover { color: var(--neutral-950) !important; } /* Text Color */ .hover-text-white:hover { color: #fff !important; } .hover-text-heading:hover { color: hsl(var(--heading-color)) !important; } .hover-text-body:hover { color: hsl(var(--body-color)) !important; } /* Hover color class end */ .cursor-pointer { cursor: pointer; } .cursor-grab { cursor: grab; } .cursor-outer { margin-left: -15px; margin-top: -15px; width: 180px; height: 180px; border: 2px solid #000; box-sizing: border-box; z-index: 10000000; opacity: 0.5; transition: all 0.08s ease-out; } .mouseCursor { position: fixed; left: 0; top: 0; right: 0; bottom: 0; pointer-events: none; border-radius: 50%; transform: translateZ(0); visibility: hidden; text-align: center; } .cursor-inner { margin-left: -3px; margin-top: -3px; width: 6px; height: 6px; z-index: 10000001; transition: width 0.3s ease-in-out, height 0.3s ease-in-out, margin 0.3s ease-in-out, opacity 0.3s ease-in-out; } .cursor-inner span { color: var(--tw-common-black); opacity: 0; text-transform: capitalize; letter-spacing: 1px; font-size: 18px; } .cursor-inner span > span { margin-top: 0px; display: inline-block; } .cursor-inner.cursor-big span { opacity: 1; } .mouseCursor.cursor-big { width: 180px; height: 180px; line-height: 1; display: inline-flex; justify-content: center; align-items: center; background: var(--main-four-600); color: hsl(var(--white)); font-size: 18px; font-weight: 500; border-radius: 50%; } .cursor-4.cursor-big { background: none; } .mouseCursor.cursor-big.cursor-outer { display: none; } .tw-cursor-point-area { cursor: none; } .cursor-inner.cursor-big { overflow: hidden; } .cursor-inner.cursor-big .inner-text-2 { display: none; background: none; } .cursor-inner.cursor-big .inner-text-2 span { color: var(--tw-theme-primary); } .cursor-inner.cursor-big .inner-text-1 { display: inline-block; } .cursor-inner.cursor-big.active { overflow: hidden; background: none; width: 100px; height: 100px; } .cursor-inner.cursor-big.active .inner-text-2, .cursor-inner.cursor-big.active .inner-text-3, .cursor-inner.cursor-big.active .inner-text-4 { display: inline-block; background: none; } .cursor-inner.cursor-big.active .inner-text-1 { display: none; } .focus-outline-0:focus-visible, .focus-outline-0:focus { outline: 0 !important; } /* ================================= Classes Css Start =========================== */ @media screen and (min-width: 425px) and (max-width: 575px) { .col-xs-6 { width: 50%; } } .tw-leading-none { line-height: 1; } .opacity-05 { opacity: 0.05; } .opacity-1 { opacity: 0.1; } /* ================================= Classes Css End =========================== */ /* Font Size Class Start */ .text-inherit { font-size: inherit; } .tw-text-xs { font-size: 0.75rem; } .tw-text-sm { font-size: 0.875rem; } .tw-text-base { font-size: 1rem; } .tw-text-lg { font-size: 1.125rem; } .tw-text-xl { font-size: 1.25rem; } .tw-text-2xl { font-size: 1.5rem; } .tw-text-3xl { font-size: 1.875rem; } /* Font Size Class End */ .tw-text-05 { font-size: 0.125rem; } .tw-text-1 { font-size: 0.25rem; } .tw-text-105 { font-size: 0.375rem; } .tw-text-2 { font-size: 0.5rem; } .tw-text-205 { font-size: 0.625rem; } .tw-text-3 { font-size: 0.75rem; } .tw-text-305 { font-size: 0.875rem; } .tw-text-4 { font-size: 1rem; } .tw-text-405 { font-size: 1.125rem; } .tw-text-5 { font-size: 1.25rem; } .tw-text-505 { font-size: 1.375rem; } .tw-text-6 { font-size: 1.5rem; } .tw-text-605 { font-size: 1.625rem; } .tw-text-7 { font-size: 1.75rem; } .tw-text-705 { font-size: 1.875rem; } .tw-text-8 { font-size: 2rem; } .tw-text-805 { font-size: 2.125rem; } .tw-text-9 { font-size: 2.25rem; } .tw-text-905 { font-size: 2.375rem; } .tw-text-10 { font-size: 2.5rem; } .tw-text-101 { font-size: 2.625rem; } .tw-text-11 { font-size: 2.75rem; } .tw-text-110 { font-size: 2.875rem; } .tw-text-12 { font-size: 3rem; } .tw-text-122 { font-size: 3.125rem; } .tw-text-13 { font-size: 3.25rem; } .tw-text-133 { font-size: 3.375rem; } .tw-text-14 { font-size: 3.5rem; } .tw-text-140 { font-size: 3.625rem; } .tw-text-15 { font-size: 3.75rem; } .tw-text-155 { font-size: 3.875rem; } .tw-text-16 { font-size: 4rem; } .tw-text-166 { font-size: 4.125rem; } .tw-text-17 { font-size: 4.25rem; } .tw-text-170 { font-size: 4.375rem; } .tw-text-18 { font-size: 4.5rem; } .tw-text-118 { font-size: 4.625rem; } .tw-text-19 { font-size: 4.75rem; } .tw-text-190 { font-size: 4.875rem; } .tw-text-20 { font-size: 5rem; } .tw-text-21 { font-size: 5.5rem; } .tw-text-210 { font-size: 5.625rem; } .tw-text-22 { font-size: 5.75rem; } .tw-text-23 { font-size: 6rem; } .tw-text-24 { font-size: 6.25rem; } .tw-text-25 { font-size: 6.5rem; } .tw-text-26 { font-size: 6.75rem; } .tw-text-27 { font-size: 7rem; } .tw-text-28 { font-size: 7.25rem; } .tw-text-280 { font-size: 7.375rem; } .tw-text-29 { font-size: 7.5rem; } .tw-text-30 { font-size: 7.75rem; } .tw-text-31 { font-size: 8.5rem; } .tw-text-32 { font-size: 8.75rem; } .tw-text-33 { font-size: 9rem; } .tw-text-34 { font-size: 9.25rem; } .tw-text-38 { font-size: 9.5rem; } .tw-text-39 { font-size: 9.75rem; } .tw-text-40 { font-size: 10rem; } .tw-text-43 { font-size: 10.75rem; } .tw-text-48 { font-size: 12rem; } .tw-text-56 { font-size: 14rem; } /* Font Size Class End */ .font-heading { font-family: var(--heading-font); } .font-body { font-family: var(--body-font); } .font-rethink { font-family: var(--rethink-font) !important; } .font-rurbanist { font-family: var(--rurbanist-font) !important; } .font-oswald { font-family: var(--oswald-font) !important; } .font-nunito { font-family: var(--nunito-font) !important; } /* Height Css Class Start */ .tw-h-05 { height: 0.125rem; } .tw-h-1 { height: 0.25rem; } .tw-h-105 { height: 0.375rem; } .tw-h-2 { height: 0.5rem; } .tw-h-205 { height: 0.625rem; } .tw-h-3 { height: 0.75rem; } .tw-h-305 { height: 0.875rem; } .tw-h-4 { height: 1rem; } .tw-h-405 { height: 1.125rem; } .tw-h-5 { height: 1.25rem; } .tw-h-505 { height: 1.375rem; } .tw-h-6 { height: 1.5rem; } .tw-h-605 { height: 1.625rem; } .tw-h-7 { height: 1.75rem; } .tw-h-705 { height: 1.875rem; } .tw-h-8 { height: 2rem; } .tw-h-805 { height: 2.125rem; } .tw-h-9 { height: 2.25rem; } .tw-h-905 { height: 2.375rem; } .tw-h-10 { height: 2.5rem; } .tw-h-101 { height: 2.625rem; } .tw-h-11 { height: 2.75rem; } .tw-h-110 { height: 2.875rem; } .tw-h-12 { height: 3rem; } .tw-h-122 { height: 3.125rem; } .tw-h-13 { height: 3.25rem; } .tw-h-133 { height: 3.375rem; } .tw-h-14 { height: 3.5rem; } .tw-h-140 { height: 3.625rem; } .tw-h-15 { height: 3.75rem; } .tw-h-155 { height: 3.875rem; } .tw-h-16 { height: 4rem; } .tw-h-166 { height: 4.125rem; } .tw-h-17 { height: 4.25rem; } .tw-h-170 { height: 4.375rem; } .tw-h-18 { height: 4.5rem; } .tw-h-118 { height: 4.625rem; } .tw-h-19 { height: 4.75rem; } .tw-h-190 { height: 4.875rem; } .tw-h-20 { height: 5rem; } .tw-h-21 { height: 5.5rem; } .tw-h-210 { height: 5.625rem; } .tw-h-22 { height: 5.75rem; } .tw-h-23 { height: 6rem; } .tw-h-24 { height: 6.25rem; } .tw-h-25 { height: 6.5rem; } .tw-h-26 { height: 6.75rem; } .tw-h-27 { height: 7rem; } .tw-h-28 { height: 7.25rem; } .tw-h-280 { height: 7.375rem; } .tw-h-29 { height: 7.5rem; } .tw-h-30 { height: 7.75rem; } .tw-h-31 { height: 8.5rem; } .tw-h-32 { height: 8.75rem; } .tw-h-33 { height: 9rem; } .tw-h-34 { height: 9.25rem; } .tw-h-38 { height: 9.5rem; } .tw-h-39 { height: 9.75rem; } .tw-h-40 { height: 10rem; } .tw-h-43 { height: 10.75rem; } .tw-h-48 { height: 12rem; } .tw-h-56 { height: 14rem; } .tw-h-px { height: 1px; } .tw-h-screen { height: 100vh; } .tw-h-75-px { height: 75px; } .tw-h-84-px { height: 84px; } .tw-h-92-px { height: 92px; } .tw-h-148-px { height: 148px; } .tw-h-184-px { height: 184px; } .tw-h-207-px { height: 207px; } .tw-h-230-px { height: 230px; } .tw-h-282-px { height: 282px; } .tw-h-300-px { height: 300px; } .tw-h-320-px { height: 320px; } .tw-h-410-px { height: 410px; } .tw-h-560-px { height: 560px; } .tw-h-580-px { height: 580px; } .tw-h-576-px { height: 576px; } .tw-h-626-px { height: 626px; } .tw-h-666-px { height: 666px; } .tw-h-730-px { height: 730px; } .tw-h-735-px { height: 735px; } .tw-h-790-px { height: 790px; } .tw-h-1220-px { height: 1220px; } .tw-min-h-184-px { min-height: 184px; } .tw-min-h-210-px { min-height: 210px !important; } /* Height Css Class End */ /* Hover animation white css start */ .hover-animation-white { position: relative; overflow: hidden; } .hover-animation-white:after { content: ""; position: absolute; width: 250%; height: 0%; inset-inline-start: 50%; inset-block-start: 50%; background-color: rgba(255, 255, 255, 0.3); transform: translate(-50%, -50%) rotate(-45deg); z-index: 1; } .hover-animation-white:hover:after { height: 250%; transition: all 0.6s linear; background-color: transparent; } /* Hover animation white css end */ /* Gap Css start */ .tw-gap-05 { gap: var(--size-05); } .tw-gap-1 { gap: var(--size-1); } .tw-gap-105 { gap: var(--size-105); } .tw-gap-2 { gap: var(--size-2); } .tw-gap-205 { gap: var(--size-205); } .tw-gap-3 { gap: var(--size-3); } .tw-gap-305 { gap: var(--size-305); } .tw-gap-4 { gap: var(--size-4); } .tw-gap-405 { gap: var(--size-405); } .tw-gap-5 { gap: var(--size-5); } .tw-gap-505 { gap: var(--size-505); } .tw-gap-6 { gap: var(--size-6); } .tw-gap-605 { gap: var(--size-605); } .tw-gap-7 { gap: var(--size-7); } .tw-gap-705 { gap: var(--size-705); } .tw-gap-8 { gap: var(--size-8); } .tw-gap-805 { gap: var(--size-805); } .tw-gap-9 { gap: var(--size-9); } .tw-gap-905 { gap: var(--size-905); } .tw-gap-10 { gap: var(--size-10); } .tw-gap-101 { gap: var(--size-101); } .tw-gap-11 { gap: var(--size-11); } .tw-gap-110 { gap: var(--size-110); } .tw-gap-12 { gap: var(--size-12); } .tw-gap-122 { gap: var(--size-122); } .tw-gap-13 { gap: var(--size-13); } .tw-gap-133 { gap: var(--size-133); } .tw-gap-14 { gap: var(--size-14); } .tw-gap-140 { gap: var(--size-140); } .tw-gap-15 { gap: var(--size-15); } .tw-gap-155 { gap: var(--size-155); } .tw-gap-16 { gap: var(--size-16); } .tw-gap-166 { gap: var(--size-166); } .tw-gap-17 { gap: var(--size-17); } .tw-gap-170 { gap: var(--size-170); } .tw-gap-18 { gap: var(--size-18); } .tw-gap-118 { gap: var(--size-118); } .tw-gap-19 { gap: var(--size-19); } .tw-gap-190 { gap: var(--size-190); } .tw-gap-20 { gap: var(--size-20); } .tw-gap-21 { gap: var(--size-21); } .tw-gap-210 { gap: var(--size-210); } .tw-gap-22 { gap: var(--size-22); } .tw-gap-23 { gap: var(--size-23); } .tw-gap-24 { gap: var(--size-24); } .tw-gap-25 { gap: var(--size-25); } .tw-gap-26 { gap: var(--size-26); } .tw-gap-27 { gap: var(--size-27); } .tw-gap-28 { gap: var(--size-28); } .tw-gap-280 { gap: var(--size-280); } .tw-gap-29 { gap: var(--size-29); } .tw-gap-30 { gap: var(--size-30); } .tw-gap-31 { gap: var(--size-31); } .tw-gap-32 { gap: var(--size-32); } .tw-gap-33 { gap: var(--size-33); } .tw-gap-34 { gap: var(--size-34); } .tw-gap-38 { gap: var(--size-38); } .tw-gap-39 { gap: var(--size-39); } .tw-gap-40 { gap: var(--size-40); } .tw-gap-43 { gap: var(--size-43); } .tw-gap-48 { gap: var(--size-48); } .tw-gap-56 { gap: var(--size-56); } .tw-gap-26-px { gap: clamp(1rem, 0.0938rem + 4.5vw, 1.625rem); } .tw-gap-42-px { gap: clamp(1.5rem, 0.0938rem + 4.5vw, 2.625rem); } .tw-gap-56-px { gap: clamp(1.5rem, -4.48rem + 7.98vw, 3.5rem); } .tw-gap-74-px { gap: clamp(1.5rem, -24.8393rem + 28.0952vw, 4.625rem); } /* Gap Css end */ /* ======================== Group Css Start =============================== */ .group:hover .group-hover-text-white { color: hsl(var(--white)) !important; } .group:hover .group-hover-text-main-600 { color: var(--main-eight-600) !important; } .group:hover .group-hover-bg-white { background-color: hsl(var(--white)) !important; } .group:hover .group-hover-bg-main-600 { background-color: var(--main-eight-600) !important; } .group-hover-text-transition { transition: inherit; } .tw-invisible { visibility: hidden; } .group-item:hover .group-hover-item-visible { visibility: visible; } .group-item:hover .group-hover-item-opacity-1 { opacity: 1 !important; } .group-item:hover .group-hover-item-mt-0 { margin-top: 0; } .group-item:hover .group-hover-item-scale-12 { transform: scale(1.2); } .group-item:hover .group-hover-item-scale-1 { transform: scale(1); } .group-item:hover .group-hover-item-translate-x-0 { transform: translateX(0); } .group-item:hover .group-hover-item-d-block { display: block !important; } .group-item:hover .group-hover-item-d-none { display: none !important; } .group-item:hover .group-hover-item-text-invert-white { filter: brightness(0) invert(1); } .group-item:hover .group-hover-item-text-invert-black { filter: brightness(0) invert(0); } /* ======================== Group Css End =============================== */ /* grid css start */ .grid-cols-2 { grid-template-columns: 1fr 1fr; } @media (min-width: 425px) { .xs-grid-cols-2 { grid-template-columns: 1fr 1fr; } } .grid-col-5 { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); grid-template-columns: 1fr 1fr 1fr 1fr 1fr; } /* grid css end */ /* Inset class start */ .tw-start-0 { inset-inline-start: 0; } .tw-start-50 { inset-inline-start: 50%; } .tw-start-100 { inset-inline-start: 100%; } .tw-start-auto { inset-inline-start: auto; } .tw-end-0 { inset-inline-end: 0; } .tw-end-100 { inset-inline-end: 100%; } .tw-end-auto { inset-inline-end: auto; } /* Inset class End */ /* Line Clamp start */ .line-clamp-1 { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 1; } .line-clamp-2 { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 2; } .line-clamp-3 { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 3; } .line-clamp-4 { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 4; } /* Line Clamp End */ /* ================================= Margin Css Start =========================== */ .tw-m-05 { margin: var(--size-05); } .tw-m-1 { margin: var(--size-1); } .tw-m-105 { margin: var(--size-105); } .tw-m-2 { margin: var(--size-2); } .tw-m-205 { margin: var(--size-205); } .tw-m-3 { margin: var(--size-3); } .tw-m-305 { margin: var(--size-305); } .tw-m-4 { margin: var(--size-4); } .tw-m-405 { margin: var(--size-405); } .tw-m-5 { margin: var(--size-5); } .tw-m-505 { margin: var(--size-505); } .tw-m-6 { margin: var(--size-6); } .tw-m-605 { margin: var(--size-605); } .tw-m-7 { margin: var(--size-7); } .tw-m-705 { margin: var(--size-705); } .tw-m-8 { margin: var(--size-8); } .tw-m-805 { margin: var(--size-805); } .tw-m-9 { margin: var(--size-9); } .tw-m-905 { margin: var(--size-905); } .tw-m-10 { margin: var(--size-10); } .tw-m-101 { margin: var(--size-101); } .tw-m-11 { margin: var(--size-11); } .tw-m-110 { margin: var(--size-110); } .tw-m-12 { margin: var(--size-12); } .tw-m-122 { margin: var(--size-122); } .tw-m-13 { margin: var(--size-13); } .tw-m-133 { margin: var(--size-133); } .tw-m-14 { margin: var(--size-14); } .tw-m-140 { margin: var(--size-140); } .tw-m-15 { margin: var(--size-15); } .tw-m-155 { margin: var(--size-155); } .tw-m-16 { margin: var(--size-16); } .tw-m-166 { margin: var(--size-166); } .tw-m-17 { margin: var(--size-17); } .tw-m-170 { margin: var(--size-170); } .tw-m-18 { margin: var(--size-18); } .tw-m-118 { margin: var(--size-118); } .tw-m-19 { margin: var(--size-19); } .tw-m-190 { margin: var(--size-190); } .tw-m-20 { margin: var(--size-20); } .tw-m-21 { margin: var(--size-21); } .tw-m-210 { margin: var(--size-210); } .tw-m-22 { margin: var(--size-22); } .tw-m-23 { margin: var(--size-23); } .tw-m-24 { margin: var(--size-24); } .tw-m-25 { margin: var(--size-25); } .tw-m-26 { margin: var(--size-26); } .tw-m-27 { margin: var(--size-27); } .tw-m-28 { margin: var(--size-28); } .tw-m-280 { margin: var(--size-280); } .tw-m-29 { margin: var(--size-29); } .tw-m-30 { margin: var(--size-30); } .tw-m-31 { margin: var(--size-31); } .tw-m-32 { margin: var(--size-32); } .tw-m-33 { margin: var(--size-33); } .tw-m-34 { margin: var(--size-34); } .tw-m-38 { margin: var(--size-38); } .tw-m-39 { margin: var(--size-39); } .tw-m-40 { margin: var(--size-40); } .tw-m-43 { margin: var(--size-43); } .tw-m-48 { margin: var(--size-48); } .tw-m-56 { margin: var(--size-56); } .tw-mx-05 { margin-inline: var(--size-05); } .tw-mx-1 { margin-inline: var(--size-1); } .tw-mx-105 { margin-inline: var(--size-105); } .tw-mx-2 { margin-inline: var(--size-2); } .tw-mx-205 { margin-inline: var(--size-205); } .tw-mx-3 { margin-inline: var(--size-3); } .tw-mx-305 { margin-inline: var(--size-305); } .tw-mx-4 { margin-inline: var(--size-4); } .tw-mx-405 { margin-inline: var(--size-405); } .tw-mx-5 { margin-inline: var(--size-5); } .tw-mx-505 { margin-inline: var(--size-505); } .tw-mx-6 { margin-inline: var(--size-6); } .tw-mx-605 { margin-inline: var(--size-605); } .tw-mx-7 { margin-inline: var(--size-7); } .tw-mx-705 { margin-inline: var(--size-705); } .tw-mx-8 { margin-inline: var(--size-8); } .tw-mx-805 { margin-inline: var(--size-805); } .tw-mx-9 { margin-inline: var(--size-9); } .tw-mx-905 { margin-inline: var(--size-905); } .tw-mx-10 { margin-inline: var(--size-10); } .tw-mx-101 { margin-inline: var(--size-101); } .tw-mx-11 { margin-inline: var(--size-11); } .tw-mx-110 { margin-inline: var(--size-110); } .tw-mx-12 { margin-inline: var(--size-12); } .tw-mx-122 { margin-inline: var(--size-122); } .tw-mx-13 { margin-inline: var(--size-13); } .tw-mx-133 { margin-inline: var(--size-133); } .tw-mx-14 { margin-inline: var(--size-14); } .tw-mx-140 { margin-inline: var(--size-140); } .tw-mx-15 { margin-inline: var(--size-15); } .tw-mx-155 { margin-inline: var(--size-155); } .tw-mx-16 { margin-inline: var(--size-16); } .tw-mx-166 { margin-inline: var(--size-166); } .tw-mx-17 { margin-inline: var(--size-17); } .tw-mx-170 { margin-inline: var(--size-170); } .tw-mx-18 { margin-inline: var(--size-18); } .tw-mx-118 { margin-inline: var(--size-118); } .tw-mx-19 { margin-inline: var(--size-19); } .tw-mx-190 { margin-inline: var(--size-190); } .tw-mx-20 { margin-inline: var(--size-20); } .tw-mx-21 { margin-inline: var(--size-21); } .tw-mx-210 { margin-inline: var(--size-210); } .tw-mx-22 { margin-inline: var(--size-22); } .tw-mx-23 { margin-inline: var(--size-23); } .tw-mx-24 { margin-inline: var(--size-24); } .tw-mx-25 { margin-inline: var(--size-25); } .tw-mx-26 { margin-inline: var(--size-26); } .tw-mx-27 { margin-inline: var(--size-27); } .tw-mx-28 { margin-inline: var(--size-28); } .tw-mx-280 { margin-inline: var(--size-280); } .tw-mx-29 { margin-inline: var(--size-29); } .tw-mx-30 { margin-inline: var(--size-30); } .tw-mx-31 { margin-inline: var(--size-31); } .tw-mx-32 { margin-inline: var(--size-32); } .tw-mx-33 { margin-inline: var(--size-33); } .tw-mx-34 { margin-inline: var(--size-34); } .tw-mx-38 { margin-inline: var(--size-38); } .tw-mx-39 { margin-inline: var(--size-39); } .tw-mx-40 { margin-inline: var(--size-40); } .tw-mx-43 { margin-inline: var(--size-43); } .tw-mx-48 { margin-inline: var(--size-48); } .tw-mx-56 { margin-inline: var(--size-56); } .tw-my-05 { margin-block: var(--size-05); } .tw-my-1 { margin-block: var(--size-1); } .tw-my-105 { margin-block: var(--size-105); } .tw-my-2 { margin-block: var(--size-2); } .tw-my-205 { margin-block: var(--size-205); } .tw-my-3 { margin-block: var(--size-3); } .tw-my-305 { margin-block: var(--size-305); } .tw-my-4 { margin-block: var(--size-4); } .tw-my-405 { margin-block: var(--size-405); } .tw-my-5 { margin-block: var(--size-5); } .tw-my-505 { margin-block: var(--size-505); } .tw-my-6 { margin-block: var(--size-6); } .tw-my-605 { margin-block: var(--size-605); } .tw-my-7 { margin-block: var(--size-7); } .tw-my-705 { margin-block: var(--size-705); } .tw-my-8 { margin-block: var(--size-8); } .tw-my-805 { margin-block: var(--size-805); } .tw-my-9 { margin-block: var(--size-9); } .tw-my-905 { margin-block: var(--size-905); } .tw-my-10 { margin-block: var(--size-10); } .tw-my-101 { margin-block: var(--size-101); } .tw-my-11 { margin-block: var(--size-11); } .tw-my-110 { margin-block: var(--size-110); } .tw-my-12 { margin-block: var(--size-12); } .tw-my-122 { margin-block: var(--size-122); } .tw-my-13 { margin-block: var(--size-13); } .tw-my-133 { margin-block: var(--size-133); } .tw-my-14 { margin-block: var(--size-14); } .tw-my-140 { margin-block: var(--size-140); } .tw-my-15 { margin-block: var(--size-15); } .tw-my-155 { margin-block: var(--size-155); } .tw-my-16 { margin-block: var(--size-16); } .tw-my-166 { margin-block: var(--size-166); } .tw-my-17 { margin-block: var(--size-17); } .tw-my-170 { margin-block: var(--size-170); } .tw-my-18 { margin-block: var(--size-18); } .tw-my-118 { margin-block: var(--size-118); } .tw-my-19 { margin-block: var(--size-19); } .tw-my-190 { margin-block: var(--size-190); } .tw-my-20 { margin-block: var(--size-20); } .tw-my-21 { margin-block: var(--size-21); } .tw-my-210 { margin-block: var(--size-210); } .tw-my-22 { margin-block: var(--size-22); } .tw-my-23 { margin-block: var(--size-23); } .tw-my-24 { margin-block: var(--size-24); } .tw-my-25 { margin-block: var(--size-25); } .tw-my-26 { margin-block: var(--size-26); } .tw-my-27 { margin-block: var(--size-27); } .tw-my-28 { margin-block: var(--size-28); } .tw-my-280 { margin-block: var(--size-280); } .tw-my-29 { margin-block: var(--size-29); } .tw-my-30 { margin-block: var(--size-30); } .tw-my-31 { margin-block: var(--size-31); } .tw-my-32 { margin-block: var(--size-32); } .tw-my-33 { margin-block: var(--size-33); } .tw-my-34 { margin-block: var(--size-34); } .tw-my-38 { margin-block: var(--size-38); } .tw-my-39 { margin-block: var(--size-39); } .tw-my-40 { margin-block: var(--size-40); } .tw-my-43 { margin-block: var(--size-43); } .tw-my-48 { margin-block: var(--size-48); } .tw-my-56 { margin-block: var(--size-56); } .tw-ms-05 { margin-inline-start: var(--size-05); } .tw-ms-1 { margin-inline-start: var(--size-1); } .tw-ms-105 { margin-inline-start: var(--size-105); } .tw-ms-2 { margin-inline-start: var(--size-2); } .tw-ms-205 { margin-inline-start: var(--size-205); } .tw-ms-3 { margin-inline-start: var(--size-3); } .tw-ms-305 { margin-inline-start: var(--size-305); } .tw-ms-4 { margin-inline-start: var(--size-4); } .tw-ms-405 { margin-inline-start: var(--size-405); } .tw-ms-5 { margin-inline-start: var(--size-5); } .tw-ms-505 { margin-inline-start: var(--size-505); } .tw-ms-6 { margin-inline-start: var(--size-6); } .tw-ms-605 { margin-inline-start: var(--size-605); } .tw-ms-7 { margin-inline-start: var(--size-7); } .tw-ms-705 { margin-inline-start: var(--size-705); } .tw-ms-8 { margin-inline-start: var(--size-8); } .tw-ms-805 { margin-inline-start: var(--size-805); } .tw-ms-9 { margin-inline-start: var(--size-9); } .tw-ms-905 { margin-inline-start: var(--size-905); } .tw-ms-10 { margin-inline-start: var(--size-10); } .tw-ms-101 { margin-inline-start: var(--size-101); } .tw-ms-11 { margin-inline-start: var(--size-11); } .tw-ms-110 { margin-inline-start: var(--size-110); } .tw-ms-12 { margin-inline-start: var(--size-12); } .tw-ms-122 { margin-inline-start: var(--size-122); } .tw-ms-13 { margin-inline-start: var(--size-13); } .tw-ms-133 { margin-inline-start: var(--size-133); } .tw-ms-14 { margin-inline-start: var(--size-14); } .tw-ms-140 { margin-inline-start: var(--size-140); } .tw-ms-15 { margin-inline-start: var(--size-15); } .tw-ms-155 { margin-inline-start: var(--size-155); } .tw-ms-16 { margin-inline-start: var(--size-16); } .tw-ms-166 { margin-inline-start: var(--size-166); } .tw-ms-17 { margin-inline-start: var(--size-17); } .tw-ms-170 { margin-inline-start: var(--size-170); } .tw-ms-18 { margin-inline-start: var(--size-18); } .tw-ms-118 { margin-inline-start: var(--size-118); } .tw-ms-19 { margin-inline-start: var(--size-19); } .tw-ms-190 { margin-inline-start: var(--size-190); } .tw-ms-20 { margin-inline-start: var(--size-20); } .tw-ms-21 { margin-inline-start: var(--size-21); } .tw-ms-210 { margin-inline-start: var(--size-210); } .tw-ms-22 { margin-inline-start: var(--size-22); } .tw-ms-23 { margin-inline-start: var(--size-23); } .tw-ms-24 { margin-inline-start: var(--size-24); } .tw-ms-25 { margin-inline-start: var(--size-25); } .tw-ms-26 { margin-inline-start: var(--size-26); } .tw-ms-27 { margin-inline-start: var(--size-27); } .tw-ms-28 { margin-inline-start: var(--size-28); } .tw-ms-280 { margin-inline-start: var(--size-280); } .tw-ms-29 { margin-inline-start: var(--size-29); } .tw-ms-30 { margin-inline-start: var(--size-30); } .tw-ms-31 { margin-inline-start: var(--size-31); } .tw-ms-32 { margin-inline-start: var(--size-32); } .tw-ms-33 { margin-inline-start: var(--size-33); } .tw-ms-34 { margin-inline-start: var(--size-34); } .tw-ms-38 { margin-inline-start: var(--size-38); } .tw-ms-39 { margin-inline-start: var(--size-39); } .tw-ms-40 { margin-inline-start: var(--size-40); } .tw-ms-43 { margin-inline-start: var(--size-43); } .tw-ms-48 { margin-inline-start: var(--size-48); } .tw-ms-56 { margin-inline-start: var(--size-56); } .tw-me-05 { margin-inline-end: var(--size-05); } .tw-me-1 { margin-inline-end: var(--size-1); } .tw-me-105 { margin-inline-end: var(--size-105); } .tw-me-2 { margin-inline-end: var(--size-2); } .tw-me-205 { margin-inline-end: var(--size-205); } .tw-me-3 { margin-inline-end: var(--size-3); } .tw-me-305 { margin-inline-end: var(--size-305); } .tw-me-4 { margin-inline-end: var(--size-4); } .tw-me-405 { margin-inline-end: var(--size-405); } .tw-me-5 { margin-inline-end: var(--size-5); } .tw-me-505 { margin-inline-end: var(--size-505); } .tw-me-6 { margin-inline-end: var(--size-6); } .tw-me-605 { margin-inline-end: var(--size-605); } .tw-me-7 { margin-inline-end: var(--size-7); } .tw-me-705 { margin-inline-end: var(--size-705); } .tw-me-8 { margin-inline-end: var(--size-8); } .tw-me-805 { margin-inline-end: var(--size-805); } .tw-me-9 { margin-inline-end: var(--size-9); } .tw-me-905 { margin-inline-end: var(--size-905); } .tw-me-10 { margin-inline-end: var(--size-10); } .tw-me-101 { margin-inline-end: var(--size-101); } .tw-me-11 { margin-inline-end: var(--size-11); } .tw-me-110 { margin-inline-end: var(--size-110); } .tw-me-12 { margin-inline-end: var(--size-12); } .tw-me-122 { margin-inline-end: var(--size-122); } .tw-me-13 { margin-inline-end: var(--size-13); } .tw-me-133 { margin-inline-end: var(--size-133); } .tw-me-14 { margin-inline-end: var(--size-14); } .tw-me-140 { margin-inline-end: var(--size-140); } .tw-me-15 { margin-inline-end: var(--size-15); } .tw-me-155 { margin-inline-end: var(--size-155); } .tw-me-16 { margin-inline-end: var(--size-16); } .tw-me-166 { margin-inline-end: var(--size-166); } .tw-me-17 { margin-inline-end: var(--size-17); } .tw-me-170 { margin-inline-end: var(--size-170); } .tw-me-18 { margin-inline-end: var(--size-18); } .tw-me-118 { margin-inline-end: var(--size-118); } .tw-me-19 { margin-inline-end: var(--size-19); } .tw-me-190 { margin-inline-end: var(--size-190); } .tw-me-20 { margin-inline-end: var(--size-20); } .tw-me-21 { margin-inline-end: var(--size-21); } .tw-me-210 { margin-inline-end: var(--size-210); } .tw-me-22 { margin-inline-end: var(--size-22); } .tw-me-23 { margin-inline-end: var(--size-23); } .tw-me-24 { margin-inline-end: var(--size-24); } .tw-me-25 { margin-inline-end: var(--size-25); } .tw-me-26 { margin-inline-end: var(--size-26); } .tw-me-27 { margin-inline-end: var(--size-27); } .tw-me-28 { margin-inline-end: var(--size-28); } .tw-me-280 { margin-inline-end: var(--size-280); } .tw-me-29 { margin-inline-end: var(--size-29); } .tw-me-30 { margin-inline-end: var(--size-30); } .tw-me-31 { margin-inline-end: var(--size-31); } .tw-me-32 { margin-inline-end: var(--size-32); } .tw-me-33 { margin-inline-end: var(--size-33); } .tw-me-34 { margin-inline-end: var(--size-34); } .tw-me-38 { margin-inline-end: var(--size-38); } .tw-me-39 { margin-inline-end: var(--size-39); } .tw-me-40 { margin-inline-end: var(--size-40); } .tw-me-43 { margin-inline-end: var(--size-43); } .tw-me-48 { margin-inline-end: var(--size-48); } .tw-me-56 { margin-inline-end: var(--size-56); } .tw-mt-05 { margin-block-start: var(--size-05); } .tw-mt-1 { margin-block-start: var(--size-1); } .tw-mt-105 { margin-block-start: var(--size-105); } .tw-mt-2 { margin-block-start: var(--size-2); } .tw-mt-205 { margin-block-start: var(--size-205); } .tw-mt-3 { margin-block-start: var(--size-3); } .tw-mt-305 { margin-block-start: var(--size-305); } .tw-mt-4 { margin-block-start: var(--size-4); } .tw-mt-405 { margin-block-start: var(--size-405); } .tw-mt-5 { margin-block-start: var(--size-5); } .tw-mt-505 { margin-block-start: var(--size-505); } .tw-mt-6 { margin-block-start: var(--size-6); } .tw-mt-605 { margin-block-start: var(--size-605); } .tw-mt-7 { margin-block-start: var(--size-7); } .tw-mt-705 { margin-block-start: var(--size-705); } .tw-mt-8 { margin-block-start: var(--size-8); } .tw-mt-805 { margin-block-start: var(--size-805); } .tw-mt-9 { margin-block-start: var(--size-9); } .tw-mt-905 { margin-block-start: var(--size-905); } .tw-mt-10 { margin-block-start: var(--size-10); } .tw-mt-101 { margin-block-start: var(--size-101); } .tw-mt-11 { margin-block-start: var(--size-11); } .tw-mt-110 { margin-block-start: var(--size-110); } .tw-mt-12 { margin-block-start: var(--size-12); } .tw-mt-122 { margin-block-start: var(--size-122); } .tw-mt-13 { margin-block-start: var(--size-13); } .tw-mt-133 { margin-block-start: var(--size-133); } .tw-mt-14 { margin-block-start: var(--size-14); } .tw-mt-140 { margin-block-start: var(--size-140); } .tw-mt-15 { margin-block-start: var(--size-15); } .tw-mt-155 { margin-block-start: var(--size-155); } .tw-mt-16 { margin-block-start: var(--size-16); } .tw-mt-166 { margin-block-start: var(--size-166); } .tw-mt-17 { margin-block-start: var(--size-17); } .tw-mt-170 { margin-block-start: var(--size-170); } .tw-mt-18 { margin-block-start: var(--size-18); } .tw-mt-118 { margin-block-start: var(--size-118); } .tw-mt-19 { margin-block-start: var(--size-19); } .tw-mt-190 { margin-block-start: var(--size-190); } .tw-mt-20 { margin-block-start: var(--size-20); } .tw-mt-21 { margin-block-start: var(--size-21); } .tw-mt-210 { margin-block-start: var(--size-210); } .tw-mt-22 { margin-block-start: var(--size-22); } .tw-mt-23 { margin-block-start: var(--size-23); } .tw-mt-24 { margin-block-start: var(--size-24); } .tw-mt-25 { margin-block-start: var(--size-25); } .tw-mt-26 { margin-block-start: var(--size-26); } .tw-mt-27 { margin-block-start: var(--size-27); } .tw-mt-28 { margin-block-start: var(--size-28); } .tw-mt-280 { margin-block-start: var(--size-280); } .tw-mt-29 { margin-block-start: var(--size-29); } .tw-mt-30 { margin-block-start: var(--size-30); } .tw-mt-31 { margin-block-start: var(--size-31); } .tw-mt-32 { margin-block-start: var(--size-32); } .tw-mt-33 { margin-block-start: var(--size-33); } .tw-mt-34 { margin-block-start: var(--size-34); } .tw-mt-38 { margin-block-start: var(--size-38); } .tw-mt-39 { margin-block-start: var(--size-39); } .tw-mt-40 { margin-block-start: var(--size-40); } .tw-mt-43 { margin-block-start: var(--size-43); } .tw-mt-48 { margin-block-start: var(--size-48); } .tw-mt-56 { margin-block-start: var(--size-56); } .tw-mb-05 { margin-block-end: var(--size-05); } .tw-mb-1 { margin-block-end: var(--size-1); } .tw-mb-105 { margin-block-end: var(--size-105); } .tw-mb-2 { margin-block-end: var(--size-2); } .tw-mb-205 { margin-block-end: var(--size-205); } .tw-mb-3 { margin-block-end: var(--size-3); } .tw-mb-305 { margin-block-end: var(--size-305); } .tw-mb-4 { margin-block-end: var(--size-4); } .tw-mb-405 { margin-block-end: var(--size-405); } .tw-mb-5 { margin-block-end: var(--size-5); } .tw-mb-505 { margin-block-end: var(--size-505); } .tw-mb-6 { margin-block-end: var(--size-6); } .tw-mb-605 { margin-block-end: var(--size-605); } .tw-mb-7 { margin-block-end: var(--size-7); } .tw-mb-705 { margin-block-end: var(--size-705); } .tw-mb-8 { margin-block-end: var(--size-8); } .tw-mb-805 { margin-block-end: var(--size-805); } .tw-mb-9 { margin-block-end: var(--size-9); } .tw-mb-905 { margin-block-end: var(--size-905); } .tw-mb-10 { margin-block-end: var(--size-10); } .tw-mb-101 { margin-block-end: var(--size-101); } .tw-mb-11 { margin-block-end: var(--size-11); } .tw-mb-110 { margin-block-end: var(--size-110); } .tw-mb-12 { margin-block-end: var(--size-12); } .tw-mb-122 { margin-block-end: var(--size-122); } .tw-mb-13 { margin-block-end: var(--size-13); } .tw-mb-133 { margin-block-end: var(--size-133); } .tw-mb-14 { margin-block-end: var(--size-14); } .tw-mb-140 { margin-block-end: var(--size-140); } .tw-mb-15 { margin-block-end: var(--size-15); } .tw-mb-155 { margin-block-end: var(--size-155); } .tw-mb-16 { margin-block-end: var(--size-16); } .tw-mb-166 { margin-block-end: var(--size-166); } .tw-mb-17 { margin-block-end: var(--size-17); } .tw-mb-170 { margin-block-end: var(--size-170); } .tw-mb-18 { margin-block-end: var(--size-18); } .tw-mb-118 { margin-block-end: var(--size-118); } .tw-mb-19 { margin-block-end: var(--size-19); } .tw-mb-190 { margin-block-end: var(--size-190); } .tw-mb-20 { margin-block-end: var(--size-20); } .tw-mb-21 { margin-block-end: var(--size-21); } .tw-mb-210 { margin-block-end: var(--size-210); } .tw-mb-22 { margin-block-end: var(--size-22); } .tw-mb-23 { margin-block-end: var(--size-23); } .tw-mb-24 { margin-block-end: var(--size-24); } .tw-mb-25 { margin-block-end: var(--size-25); } .tw-mb-26 { margin-block-end: var(--size-26); } .tw-mb-27 { margin-block-end: var(--size-27); } .tw-mb-28 { margin-block-end: var(--size-28); } .tw-mb-280 { margin-block-end: var(--size-280); } .tw-mb-29 { margin-block-end: var(--size-29); } .tw-mb-30 { margin-block-end: var(--size-30); } .tw-mb-31 { margin-block-end: var(--size-31); } .tw-mb-32 { margin-block-end: var(--size-32); } .tw-mb-33 { margin-block-end: var(--size-33); } .tw-mb-34 { margin-block-end: var(--size-34); } .tw-mb-38 { margin-block-end: var(--size-38); } .tw-mb-39 { margin-block-end: var(--size-39); } .tw-mb-40 { margin-block-end: var(--size-40); } .tw-mb-43 { margin-block-end: var(--size-43); } .tw-mb-48 { margin-block-end: var(--size-48); } .tw-mb-56 { margin-block-end: var(--size-56); } .tw-ms-auto { margin-inline-start: auto; } .tw-me-auto { margin-inline-end: auto; } .tw--ms-16-px { margin-inline-start: -16px; } .my-120 { margin-block-start: 60px; margin-block-end: 60px; } @media (min-width: 576px) { .my-120 { margin-block-start: 80px; margin-block-end: 80px; } } @media (min-width: 992px) { .my-120 { margin-block-start: 120px; margin-block-end: 120px; } } .mt-120 { margin-block-start: 60px; } @media (min-width: 576px) { .mt-120 { margin-block-start: 80px; } } @media (min-width: 992px) { .mt-120 { margin-block-start: 120px; } } .mb-120 { margin-block-end: 60px; } @media (min-width: 576px) { .mb-120 { margin-block-end: 80px; } } @media (min-width: 992px) { .mb-120 { margin-block-end: 120px; } } .mt-60 { margin-block-start: 30px; } @media (min-width: 576px) { .mt-60 { margin-block-start: 40px; } } @media (min-width: 992px) { .mt-60 { margin-block-start: 60px; } } .mb-60 { margin-block-end: 30px; } @media (min-width: 576px) { .mb-60 { margin-block-end: 40px; } } @media (min-width: 992px) { .mb-60 { margin-block-end: 60px; } } /* ================================= Margin Css End =========================== */ /* Max Height Css Class Start */ .tw-max-h-screen { max-height: 100vh; } /* Max Height Css Class End */ /* Max width Css Class Start */ .max-w-80-px { max-width: 80px; } .max-w-200-px { max-width: 200px; } .max-w-240-px { max-width: 240px; } .max-w-400-px { max-width: 400px; } .max-w-1140-px { max-width: 1140px; } .max-w-1290-px { max-width: 1290px; } /* Max width Css Class End */ /* Overlay Start */ .overlay { position: fixed; width: 100%; height: 100%; content: ""; inset-inline-start: 0; inset-block-start: 0; background-color: rgba(0, 0, 0, 0.7411764706); z-index: 99; transition: 0.2s linear; visibility: hidden; opacity: 0; cursor: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAVBAMAAABbObilAAAAMFBMVEVMaXH////////////////////////////////////////////////////////////6w4mEAAAAD3RSTlMAlAX+BKLcA5+b6hJ7foD4ZP1OAAAAkUlEQVR4XkWPoQ3CUBQAL4SktoKAbCUjgAKLJZ2ABYosngTJCHSD6joUI6BZgqSoB/+Shqde7sS9x3OGk81fdO+texMtRVTia+TsQtHEUJLdohJfgNNPJHyEJPZTsWLoxShqsWITazEwqePAn69Sw2TUxk1+euPis3EwaXy8RMHSZBIlRcKKnC5hRctjMf57/wJbBlAIs9k1BAAAAABJRU5ErkJggg==), progress; } .overlay.show-overlay { visibility: visible; opacity: 1; } .side-overlay { position: fixed; width: 100%; height: 100%; content: ""; inset-inline-start: 0; inset-block-start: 0; background-color: rgba(0, 0, 0, 0.7411764706); z-index: 999; transition: 0.2s linear; visibility: hidden; opacity: 0; cursor: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAVBAMAAABbObilAAAAMFBMVEVMaXH////////////////////////////////////////////////////////////6w4mEAAAAD3RSTlMAlAX+BKLcA5+b6hJ7foD4ZP1OAAAAkUlEQVR4XkWPoQ3CUBQAL4SktoKAbCUjgAKLJZ2ABYosngTJCHSD6joUI6BZgqSoB/+Shqde7sS9x3OGk81fdO+texMtRVTia+TsQtHEUJLdohJfgNNPJHyEJPZTsWLoxShqsWITazEwqePAn69Sw2TUxk1+euPis3EwaXy8RMHSZBIlRcKKnC5hRctjMf57/wJbBlAIs9k1BAAAAABJRU5ErkJggg==), progress; } .side-overlay.show { visibility: visible; opacity: 1; } /* Overlay End */ /* ================================= Padding Css Start =========================== */ .tw-p-05 { padding: var(--size-05); } .tw-p-1 { padding: var(--size-1); } .tw-p-105 { padding: var(--size-105); } .tw-p-2 { padding: var(--size-2); } .tw-p-205 { padding: var(--size-205); } .tw-p-3 { padding: var(--size-3); } .tw-p-305 { padding: var(--size-305); } .tw-p-4 { padding: var(--size-4); } .tw-p-405 { padding: var(--size-405); } .tw-p-5 { padding: var(--size-5); } .tw-p-505 { padding: var(--size-505); } .tw-p-6 { padding: var(--size-6); } .tw-p-605 { padding: var(--size-605); } .tw-p-7 { padding: var(--size-7); } .tw-p-705 { padding: var(--size-705); } .tw-p-8 { padding: var(--size-8); } .tw-p-805 { padding: var(--size-805); } .tw-p-9 { padding: var(--size-9); } .tw-p-905 { padding: var(--size-905); } .tw-p-10 { padding: var(--size-10); } .tw-p-101 { padding: var(--size-101); } .tw-p-11 { padding: var(--size-11); } .tw-p-110 { padding: var(--size-110); } .tw-p-12 { padding: var(--size-12); } .tw-p-122 { padding: var(--size-122); } .tw-p-13 { padding: var(--size-13); } .tw-p-133 { padding: var(--size-133); } .tw-p-14 { padding: var(--size-14); } .tw-p-140 { padding: var(--size-140); } .tw-p-15 { padding: var(--size-15); } .tw-p-155 { padding: var(--size-155); } .tw-p-16 { padding: var(--size-16); } .tw-p-166 { padding: var(--size-166); } .tw-p-17 { padding: var(--size-17); } .tw-p-170 { padding: var(--size-170); } .tw-p-18 { padding: var(--size-18); } .tw-p-118 { padding: var(--size-118); } .tw-p-19 { padding: var(--size-19); } .tw-p-190 { padding: var(--size-190); } .tw-p-20 { padding: var(--size-20); } .tw-p-21 { padding: var(--size-21); } .tw-p-210 { padding: var(--size-210); } .tw-p-22 { padding: var(--size-22); } .tw-p-23 { padding: var(--size-23); } .tw-p-24 { padding: var(--size-24); } .tw-p-25 { padding: var(--size-25); } .tw-p-26 { padding: var(--size-26); } .tw-p-27 { padding: var(--size-27); } .tw-p-28 { padding: var(--size-28); } .tw-p-280 { padding: var(--size-280); } .tw-p-29 { padding: var(--size-29); } .tw-p-30 { padding: var(--size-30); } .tw-p-31 { padding: var(--size-31); } .tw-p-32 { padding: var(--size-32); } .tw-p-33 { padding: var(--size-33); } .tw-p-34 { padding: var(--size-34); } .tw-p-38 { padding: var(--size-38); } .tw-p-39 { padding: var(--size-39); } .tw-p-40 { padding: var(--size-40); } .tw-p-43 { padding: var(--size-43); } .tw-p-48 { padding: var(--size-48); } .tw-p-56 { padding: var(--size-56); } .tw-px-05 { padding-inline: var(--size-05); } .tw-px-1 { padding-inline: var(--size-1); } .tw-px-105 { padding-inline: var(--size-105); } .tw-px-2 { padding-inline: var(--size-2); } .tw-px-205 { padding-inline: var(--size-205); } .tw-px-3 { padding-inline: var(--size-3); } .tw-px-305 { padding-inline: var(--size-305); } .tw-px-4 { padding-inline: var(--size-4); } .tw-px-405 { padding-inline: var(--size-405); } .tw-px-5 { padding-inline: var(--size-5); } .tw-px-505 { padding-inline: var(--size-505); } .tw-px-6 { padding-inline: var(--size-6); } .tw-px-605 { padding-inline: var(--size-605); } .tw-px-7 { padding-inline: var(--size-7); } .tw-px-705 { padding-inline: var(--size-705); } .tw-px-8 { padding-inline: var(--size-8); } .tw-px-805 { padding-inline: var(--size-805); } .tw-px-9 { padding-inline: var(--size-9); } .tw-px-905 { padding-inline: var(--size-905); } .tw-px-10 { padding-inline: var(--size-10); } .tw-px-101 { padding-inline: var(--size-101); } .tw-px-11 { padding-inline: var(--size-11); } .tw-px-110 { padding-inline: var(--size-110); } .tw-px-12 { padding-inline: var(--size-12); } .tw-px-122 { padding-inline: var(--size-122); } .tw-px-13 { padding-inline: var(--size-13); } .tw-px-133 { padding-inline: var(--size-133); } .tw-px-14 { padding-inline: var(--size-14); } .tw-px-140 { padding-inline: var(--size-140); } .tw-px-15 { padding-inline: var(--size-15); } .tw-px-155 { padding-inline: var(--size-155); } .tw-px-16 { padding-inline: var(--size-16); } .tw-px-166 { padding-inline: var(--size-166); } .tw-px-17 { padding-inline: var(--size-17); } .tw-px-170 { padding-inline: var(--size-170); } .tw-px-18 { padding-inline: var(--size-18); } .tw-px-118 { padding-inline: var(--size-118); } .tw-px-19 { padding-inline: var(--size-19); } .tw-px-190 { padding-inline: var(--size-190); } .tw-px-20 { padding-inline: var(--size-20); } .tw-px-21 { padding-inline: var(--size-21); } .tw-px-210 { padding-inline: var(--size-210); } .tw-px-22 { padding-inline: var(--size-22); } .tw-px-23 { padding-inline: var(--size-23); } .tw-px-24 { padding-inline: var(--size-24); } .tw-px-25 { padding-inline: var(--size-25); } .tw-px-26 { padding-inline: var(--size-26); } .tw-px-27 { padding-inline: var(--size-27); } .tw-px-28 { padding-inline: var(--size-28); } .tw-px-280 { padding-inline: var(--size-280); } .tw-px-29 { padding-inline: var(--size-29); } .tw-px-30 { padding-inline: var(--size-30); } .tw-px-31 { padding-inline: var(--size-31); } .tw-px-32 { padding-inline: var(--size-32); } .tw-px-33 { padding-inline: var(--size-33); } .tw-px-34 { padding-inline: var(--size-34); } .tw-px-38 { padding-inline: var(--size-38); } .tw-px-39 { padding-inline: var(--size-39); } .tw-px-40 { padding-inline: var(--size-40); } .tw-px-43 { padding-inline: var(--size-43); } .tw-px-48 { padding-inline: var(--size-48); } .tw-px-56 { padding-inline: var(--size-56); } .tw-py-05 { padding-block: var(--size-05); } .tw-py-1 { padding-block: var(--size-1); } .tw-py-105 { padding-block: var(--size-105); } .tw-py-2 { padding-block: var(--size-2); } .tw-py-205 { padding-block: var(--size-205); } .tw-py-3 { padding-block: var(--size-3); } .tw-py-305 { padding-block: var(--size-305); } .tw-py-4 { padding-block: var(--size-4); } .tw-py-405 { padding-block: var(--size-405); } .tw-py-5 { padding-block: var(--size-5); } .tw-py-505 { padding-block: var(--size-505); } .tw-py-6 { padding-block: var(--size-6); } .tw-py-605 { padding-block: var(--size-605); } .tw-py-7 { padding-block: var(--size-7); } .tw-py-705 { padding-block: var(--size-705); } .tw-py-8 { padding-block: var(--size-8); } .tw-py-805 { padding-block: var(--size-805); } .tw-py-9 { padding-block: var(--size-9); } .tw-py-905 { padding-block: var(--size-905); } .tw-py-10 { padding-block: var(--size-10); } .tw-py-101 { padding-block: var(--size-101); } .tw-py-11 { padding-block: var(--size-11); } .tw-py-110 { padding-block: var(--size-110); } .tw-py-12 { padding-block: var(--size-12); } .tw-py-122 { padding-block: var(--size-122); } .tw-py-13 { padding-block: var(--size-13); } .tw-py-133 { padding-block: var(--size-133); } .tw-py-14 { padding-block: var(--size-14); } .tw-py-140 { padding-block: var(--size-140); } .tw-py-15 { padding-block: var(--size-15); } .tw-py-155 { padding-block: var(--size-155); } .tw-py-16 { padding-block: var(--size-16); } .tw-py-166 { padding-block: var(--size-166); } .tw-py-17 { padding-block: var(--size-17); } .tw-py-170 { padding-block: var(--size-170); } .tw-py-18 { padding-block: var(--size-18); } .tw-py-118 { padding-block: var(--size-118); } .tw-py-19 { padding-block: var(--size-19); } .tw-py-190 { padding-block: var(--size-190); } .tw-py-20 { padding-block: var(--size-20); } .tw-py-21 { padding-block: var(--size-21); } .tw-py-210 { padding-block: var(--size-210); } .tw-py-22 { padding-block: var(--size-22); } .tw-py-23 { padding-block: var(--size-23); } .tw-py-24 { padding-block: var(--size-24); } .tw-py-25 { padding-block: var(--size-25); } .tw-py-26 { padding-block: var(--size-26); } .tw-py-27 { padding-block: var(--size-27); } .tw-py-28 { padding-block: var(--size-28); } .tw-py-280 { padding-block: var(--size-280); } .tw-py-29 { padding-block: var(--size-29); } .tw-py-30 { padding-block: var(--size-30); } .tw-py-31 { padding-block: var(--size-31); } .tw-py-32 { padding-block: var(--size-32); } .tw-py-33 { padding-block: var(--size-33); } .tw-py-34 { padding-block: var(--size-34); } .tw-py-38 { padding-block: var(--size-38); } .tw-py-39 { padding-block: var(--size-39); } .tw-py-40 { padding-block: var(--size-40); } .tw-py-43 { padding-block: var(--size-43); } .tw-py-48 { padding-block: var(--size-48); } .tw-py-56 { padding-block: var(--size-56); } .tw-ps-05 { padding-inline-start: var(--size-05); } .tw-ps-1 { padding-inline-start: var(--size-1); } .tw-ps-105 { padding-inline-start: var(--size-105); } .tw-ps-2 { padding-inline-start: var(--size-2); } .tw-ps-205 { padding-inline-start: var(--size-205); } .tw-ps-3 { padding-inline-start: var(--size-3); } .tw-ps-305 { padding-inline-start: var(--size-305); } .tw-ps-4 { padding-inline-start: var(--size-4); } .tw-ps-405 { padding-inline-start: var(--size-405); } .tw-ps-5 { padding-inline-start: var(--size-5); } .tw-ps-505 { padding-inline-start: var(--size-505); } .tw-ps-6 { padding-inline-start: var(--size-6); } .tw-ps-605 { padding-inline-start: var(--size-605); } .tw-ps-7 { padding-inline-start: var(--size-7); } .tw-ps-705 { padding-inline-start: var(--size-705); } .tw-ps-8 { padding-inline-start: var(--size-8); } .tw-ps-805 { padding-inline-start: var(--size-805); } .tw-ps-9 { padding-inline-start: var(--size-9); } .tw-ps-905 { padding-inline-start: var(--size-905); } .tw-ps-10 { padding-inline-start: var(--size-10); } .tw-ps-101 { padding-inline-start: var(--size-101); } .tw-ps-11 { padding-inline-start: var(--size-11); } .tw-ps-110 { padding-inline-start: var(--size-110); } .tw-ps-12 { padding-inline-start: var(--size-12); } .tw-ps-122 { padding-inline-start: var(--size-122); } .tw-ps-13 { padding-inline-start: var(--size-13); } .tw-ps-133 { padding-inline-start: var(--size-133); } .tw-ps-14 { padding-inline-start: var(--size-14); } .tw-ps-140 { padding-inline-start: var(--size-140); } .tw-ps-15 { padding-inline-start: var(--size-15); } .tw-ps-155 { padding-inline-start: var(--size-155); } .tw-ps-16 { padding-inline-start: var(--size-16); } .tw-ps-166 { padding-inline-start: var(--size-166); } .tw-ps-17 { padding-inline-start: var(--size-17); } .tw-ps-170 { padding-inline-start: var(--size-170); } .tw-ps-18 { padding-inline-start: var(--size-18); } .tw-ps-118 { padding-inline-start: var(--size-118); } .tw-ps-19 { padding-inline-start: var(--size-19); } .tw-ps-190 { padding-inline-start: var(--size-190); } .tw-ps-20 { padding-inline-start: var(--size-20); } .tw-ps-21 { padding-inline-start: var(--size-21); } .tw-ps-210 { padding-inline-start: var(--size-210); } .tw-ps-22 { padding-inline-start: var(--size-22); } .tw-ps-23 { padding-inline-start: var(--size-23); } .tw-ps-24 { padding-inline-start: var(--size-24); } .tw-ps-25 { padding-inline-start: var(--size-25); } .tw-ps-26 { padding-inline-start: var(--size-26); } .tw-ps-27 { padding-inline-start: var(--size-27); } .tw-ps-28 { padding-inline-start: var(--size-28); } .tw-ps-280 { padding-inline-start: var(--size-280); } .tw-ps-29 { padding-inline-start: var(--size-29); } .tw-ps-30 { padding-inline-start: var(--size-30); } .tw-ps-31 { padding-inline-start: var(--size-31); } .tw-ps-32 { padding-inline-start: var(--size-32); } .tw-ps-33 { padding-inline-start: var(--size-33); } .tw-ps-34 { padding-inline-start: var(--size-34); } .tw-ps-38 { padding-inline-start: var(--size-38); } .tw-ps-39 { padding-inline-start: var(--size-39); } .tw-ps-40 { padding-inline-start: var(--size-40); } .tw-ps-43 { padding-inline-start: var(--size-43); } .tw-ps-48 { padding-inline-start: var(--size-48); } .tw-ps-56 { padding-inline-start: var(--size-56); } .tw-pe-05 { padding-inline-end: var(--size-05); } .tw-pe-1 { padding-inline-end: var(--size-1); } .tw-pe-105 { padding-inline-end: var(--size-105); } .tw-pe-2 { padding-inline-end: var(--size-2); } .tw-pe-205 { padding-inline-end: var(--size-205); } .tw-pe-3 { padding-inline-end: var(--size-3); } .tw-pe-305 { padding-inline-end: var(--size-305); } .tw-pe-4 { padding-inline-end: var(--size-4); } .tw-pe-405 { padding-inline-end: var(--size-405); } .tw-pe-5 { padding-inline-end: var(--size-5); } .tw-pe-505 { padding-inline-end: var(--size-505); } .tw-pe-6 { padding-inline-end: var(--size-6); } .tw-pe-605 { padding-inline-end: var(--size-605); } .tw-pe-7 { padding-inline-end: var(--size-7); } .tw-pe-705 { padding-inline-end: var(--size-705); } .tw-pe-8 { padding-inline-end: var(--size-8); } .tw-pe-805 { padding-inline-end: var(--size-805); } .tw-pe-9 { padding-inline-end: var(--size-9); } .tw-pe-905 { padding-inline-end: var(--size-905); } .tw-pe-10 { padding-inline-end: var(--size-10); } .tw-pe-101 { padding-inline-end: var(--size-101); } .tw-pe-11 { padding-inline-end: var(--size-11); } .tw-pe-110 { padding-inline-end: var(--size-110); } .tw-pe-12 { padding-inline-end: var(--size-12); } .tw-pe-122 { padding-inline-end: var(--size-122); } .tw-pe-13 { padding-inline-end: var(--size-13); } .tw-pe-133 { padding-inline-end: var(--size-133); } .tw-pe-14 { padding-inline-end: var(--size-14); } .tw-pe-140 { padding-inline-end: var(--size-140); } .tw-pe-15 { padding-inline-end: var(--size-15); } .tw-pe-155 { padding-inline-end: var(--size-155); } .tw-pe-16 { padding-inline-end: var(--size-16); } .tw-pe-166 { padding-inline-end: var(--size-166); } .tw-pe-17 { padding-inline-end: var(--size-17); } .tw-pe-170 { padding-inline-end: var(--size-170); } .tw-pe-18 { padding-inline-end: var(--size-18); } .tw-pe-118 { padding-inline-end: var(--size-118); } .tw-pe-19 { padding-inline-end: var(--size-19); } .tw-pe-190 { padding-inline-end: var(--size-190); } .tw-pe-20 { padding-inline-end: var(--size-20); } .tw-pe-21 { padding-inline-end: var(--size-21); } .tw-pe-210 { padding-inline-end: var(--size-210); } .tw-pe-22 { padding-inline-end: var(--size-22); } .tw-pe-23 { padding-inline-end: var(--size-23); } .tw-pe-24 { padding-inline-end: var(--size-24); } .tw-pe-25 { padding-inline-end: var(--size-25); } .tw-pe-26 { padding-inline-end: var(--size-26); } .tw-pe-27 { padding-inline-end: var(--size-27); } .tw-pe-28 { padding-inline-end: var(--size-28); } .tw-pe-280 { padding-inline-end: var(--size-280); } .tw-pe-29 { padding-inline-end: var(--size-29); } .tw-pe-30 { padding-inline-end: var(--size-30); } .tw-pe-31 { padding-inline-end: var(--size-31); } .tw-pe-32 { padding-inline-end: var(--size-32); } .tw-pe-33 { padding-inline-end: var(--size-33); } .tw-pe-34 { padding-inline-end: var(--size-34); } .tw-pe-38 { padding-inline-end: var(--size-38); } .tw-pe-39 { padding-inline-end: var(--size-39); } .tw-pe-40 { padding-inline-end: var(--size-40); } .tw-pe-43 { padding-inline-end: var(--size-43); } .tw-pe-48 { padding-inline-end: var(--size-48); } .tw-pe-56 { padding-inline-end: var(--size-56); } .tw-pt-05 { padding-block-start: var(--size-05); } .tw-pt-1 { padding-block-start: var(--size-1); } .tw-pt-105 { padding-block-start: var(--size-105); } .tw-pt-2 { padding-block-start: var(--size-2); } .tw-pt-205 { padding-block-start: var(--size-205); } .tw-pt-3 { padding-block-start: var(--size-3); } .tw-pt-305 { padding-block-start: var(--size-305); } .tw-pt-4 { padding-block-start: var(--size-4); } .tw-pt-405 { padding-block-start: var(--size-405); } .tw-pt-5 { padding-block-start: var(--size-5); } .tw-pt-505 { padding-block-start: var(--size-505); } .tw-pt-6 { padding-block-start: var(--size-6); } .tw-pt-605 { padding-block-start: var(--size-605); } .tw-pt-7 { padding-block-start: var(--size-7); } .tw-pt-705 { padding-block-start: var(--size-705); } .tw-pt-8 { padding-block-start: var(--size-8); } .tw-pt-805 { padding-block-start: var(--size-805); } .tw-pt-9 { padding-block-start: var(--size-9); } .tw-pt-905 { padding-block-start: var(--size-905); } .tw-pt-10 { padding-block-start: var(--size-10); } .tw-pt-101 { padding-block-start: var(--size-101); } .tw-pt-11 { padding-block-start: var(--size-11); } .tw-pt-110 { padding-block-start: var(--size-110); } .tw-pt-12 { padding-block-start: var(--size-12); } .tw-pt-122 { padding-block-start: var(--size-122); } .tw-pt-13 { padding-block-start: var(--size-13); } .tw-pt-133 { padding-block-start: var(--size-133); } .tw-pt-14 { padding-block-start: var(--size-14); } .tw-pt-140 { padding-block-start: var(--size-140); } .tw-pt-15 { padding-block-start: var(--size-15); } .tw-pt-155 { padding-block-start: var(--size-155); } .tw-pt-16 { padding-block-start: var(--size-16); } .tw-pt-166 { padding-block-start: var(--size-166); } .tw-pt-17 { padding-block-start: var(--size-17); } .tw-pt-170 { padding-block-start: var(--size-170); } .tw-pt-18 { padding-block-start: var(--size-18); } .tw-pt-118 { padding-block-start: var(--size-118); } .tw-pt-19 { padding-block-start: var(--size-19); } .tw-pt-190 { padding-block-start: var(--size-190); } .tw-pt-20 { padding-block-start: var(--size-20); } .tw-pt-21 { padding-block-start: var(--size-21); } .tw-pt-210 { padding-block-start: var(--size-210); } .tw-pt-22 { padding-block-start: var(--size-22); } .tw-pt-23 { padding-block-start: var(--size-23); } .tw-pt-24 { padding-block-start: var(--size-24); } .tw-pt-25 { padding-block-start: var(--size-25); } .tw-pt-26 { padding-block-start: var(--size-26); } .tw-pt-27 { padding-block-start: var(--size-27); } .tw-pt-28 { padding-block-start: var(--size-28); } .tw-pt-280 { padding-block-start: var(--size-280); } .tw-pt-29 { padding-block-start: var(--size-29); } .tw-pt-30 { padding-block-start: var(--size-30); } .tw-pt-31 { padding-block-start: var(--size-31); } .tw-pt-32 { padding-block-start: var(--size-32); } .tw-pt-33 { padding-block-start: var(--size-33); } .tw-pt-34 { padding-block-start: var(--size-34); } .tw-pt-38 { padding-block-start: var(--size-38); } .tw-pt-39 { padding-block-start: var(--size-39); } .tw-pt-40 { padding-block-start: var(--size-40); } .tw-pt-43 { padding-block-start: var(--size-43); } .tw-pt-48 { padding-block-start: var(--size-48); } .tw-pt-56 { padding-block-start: var(--size-56); } .tw-pb-05 { padding-block-end: var(--size-05); } .tw-pb-1 { padding-block-end: var(--size-1); } .tw-pb-105 { padding-block-end: var(--size-105); } .tw-pb-2 { padding-block-end: var(--size-2); } .tw-pb-205 { padding-block-end: var(--size-205); } .tw-pb-3 { padding-block-end: var(--size-3); } .tw-pb-305 { padding-block-end: var(--size-305); } .tw-pb-4 { padding-block-end: var(--size-4); } .tw-pb-405 { padding-block-end: var(--size-405); } .tw-pb-5 { padding-block-end: var(--size-5); } .tw-pb-505 { padding-block-end: var(--size-505); } .tw-pb-6 { padding-block-end: var(--size-6); } .tw-pb-605 { padding-block-end: var(--size-605); } .tw-pb-7 { padding-block-end: var(--size-7); } .tw-pb-705 { padding-block-end: var(--size-705); } .tw-pb-8 { padding-block-end: var(--size-8); } .tw-pb-805 { padding-block-end: var(--size-805); } .tw-pb-9 { padding-block-end: var(--size-9); } .tw-pb-905 { padding-block-end: var(--size-905); } .tw-pb-10 { padding-block-end: var(--size-10); } .tw-pb-101 { padding-block-end: var(--size-101); } .tw-pb-11 { padding-block-end: var(--size-11); } .tw-pb-110 { padding-block-end: var(--size-110); } .tw-pb-12 { padding-block-end: var(--size-12); } .tw-pb-122 { padding-block-end: var(--size-122); } .tw-pb-13 { padding-block-end: var(--size-13); } .tw-pb-133 { padding-block-end: var(--size-133); } .tw-pb-14 { padding-block-end: var(--size-14); } .tw-pb-140 { padding-block-end: var(--size-140); } .tw-pb-15 { padding-block-end: var(--size-15); } .tw-pb-155 { padding-block-end: var(--size-155); } .tw-pb-16 { padding-block-end: var(--size-16); } .tw-pb-166 { padding-block-end: var(--size-166); } .tw-pb-17 { padding-block-end: var(--size-17); } .tw-pb-170 { padding-block-end: var(--size-170); } .tw-pb-18 { padding-block-end: var(--size-18); } .tw-pb-118 { padding-block-end: var(--size-118); } .tw-pb-19 { padding-block-end: var(--size-19); } .tw-pb-190 { padding-block-end: var(--size-190); } .tw-pb-20 { padding-block-end: var(--size-20); } .tw-pb-21 { padding-block-end: var(--size-21); } .tw-pb-210 { padding-block-end: var(--size-210); } .tw-pb-22 { padding-block-end: var(--size-22); } .tw-pb-23 { padding-block-end: var(--size-23); } .tw-pb-24 { padding-block-end: var(--size-24); } .tw-pb-25 { padding-block-end: var(--size-25); } .tw-pb-26 { padding-block-end: var(--size-26); } .tw-pb-27 { padding-block-end: var(--size-27); } .tw-pb-28 { padding-block-end: var(--size-28); } .tw-pb-280 { padding-block-end: var(--size-280); } .tw-pb-29 { padding-block-end: var(--size-29); } .tw-pb-30 { padding-block-end: var(--size-30); } .tw-pb-31 { padding-block-end: var(--size-31); } .tw-pb-32 { padding-block-end: var(--size-32); } .tw-pb-33 { padding-block-end: var(--size-33); } .tw-pb-34 { padding-block-end: var(--size-34); } .tw-pb-38 { padding-block-end: var(--size-38); } .tw-pb-39 { padding-block-end: var(--size-39); } .tw-pb-40 { padding-block-end: var(--size-40); } .tw-pb-43 { padding-block-end: var(--size-43); } .tw-pb-48 { padding-block-end: var(--size-48); } .tw-pb-56 { padding-block-end: var(--size-56); } .tw-p-36-px { padding: clamp(1rem, -6.1013rem + 9.4763vw, 2.25rem); } .tw-p-48-px { padding: clamp(1.5rem, -12.1677rem + 32.9177vw, 3rem); } .tw-p-60-px { padding: clamp(1.5rem, -12.1677rem + 32.9177vw, 3.75rem); } .py-120 { padding-block-start: 60px; padding-block-end: 60px; } @media (min-width: 576px) { .py-120 { padding-block-start: 60px; padding-block-end: 60px; } } @media (min-width: 992px) { .py-120 { padding-block-start: 120px; padding-block-end: 120px; } } .pt-120 { padding-block-start: 60px; } @media (min-width: 576px) { .pt-120 { padding-block-start: 80px; } } @media (min-width: 992px) { .pt-120 { padding-block-start: 120px; } } .pb-120 { padding-block-end: 60px; } @media (min-width: 576px) { .pb-120 { padding-block-end: 80px; } } @media (min-width: 992px) { .pb-120 { padding-block-end: 120px; } } .py-110 { padding-block-start: 55px; padding-block-end: 55px; } @media (min-width: 576px) { .py-110 { padding-block-start: 80px; padding-block-end: 80px; } } @media (min-width: 992px) { .py-110 { padding-block-start: 120px; padding-block-end: 120px; } } .pt-110 { padding-block-start: 55px; } @media (min-width: 576px) { .pt-110 { padding-block-start: 80px; } } @media (min-width: 992px) { .pt-110 { padding-block-start: 120px; } } .pb-110 { padding-block-end: 55px; } @media (min-width: 576px) { .pb-110 { padding-block-end: 80px; } } @media (min-width: 992px) { .pb-110 { padding-block-end: 120px; } } .py-60 { padding-block-start: 30px; padding-block-end: 30px; } @media (min-width: 576px) { .py-60 { padding-block-start: 40px; padding-block-end: 40px; } } @media (min-width: 992px) { .py-60 { padding-block-start: 60px; padding-block-end: 60px; } } .pt-60 { padding-block-start: 30px; } @media (min-width: 576px) { .pt-60 { padding-block-start: 40px; } } @media (min-width: 992px) { .pt-60 { padding-block-start: 60px; } } .pb-60 { padding-block-end: 30px; } @media (min-width: 576px) { .pb-60 { padding-block-end: 40px; } } @media (min-width: 992px) { .pb-60 { padding-block-end: 60px; } } /* ================================= Padding Css End =========================== */ /* Placeholder Classes Start */ .tw-placeholder-text-neutral-100::placeholder { color: var(--neutral-100); } .tw-placeholder-text-neutral-200::placeholder { color: var(--neutral-200); } .tw-placeholder-text-neutral-300::placeholder { color: var(--neutral-300); } .tw-placeholder-text-neutral-400::placeholder { color: var(--neutral-400); } .tw-placeholder-text-neutral-500::placeholder { color: var(--neutral-500); } .tw-placeholder-text-neutral-600::placeholder { color: var(--neutral-600); } .tw-placeholder-text-neutral-700::placeholder { color: var(--neutral-700); } .tw-placeholder-text-neutral-800::placeholder { color: var(--neutral-800); } .tw-placeholder-text-neutral-900::placeholder { color: var(--neutral-900); } .focus-tw-placeholder-text-hidden:focus::placeholder { opacity: 0; } .tw-placeholder-transition-2::placeholder { transition: 0.2s linear; } /* Placeholder Classes End */ /* Border Radius Css Start */ .tw-rounded { border-radius: 0.25rem; /* 4px */ } .tw-rounded-none { border-radius: 0px; } .tw-rounded-sm { border-radius: 0.125rem; /* 2px */ } .tw-rounded-md { border-radius: 0.375rem; /* 6px */ } .tw-rounded-lg { border-radius: 0.5rem; /* 8px */ } .tw-rounded-xl { border-radius: 0.75rem; /* 12px */ } .tw-rounded-2xl { border-radius: 1rem; /* 16px */ } .tw-rounded-3xl { border-radius: 1.5rem; /* 24px */ } .tw-rounded-4xl { border-radius: 3.1rem; /* 48px */ } /* Border Radius Css End */ /* Rotate Css Start */ .tw-hover-rotate-360:hover { transform: rotate(260deg); } /* Rotate Css End */ /* Hover Scale Css start */ .tw-scale-04 { transform: scale(0.4); } .tw-scale-08 { transform: scale(0.8); } .hover-scale-09:hover { transform: scale(0.9); } .hover-scale-094:hover { transform: scale(0.94); } .hover-scale-098:hover { transform: scale(0.98); } .hover-scale-102:hover { transform: scale(1.02); } .hover-scale-104:hover { transform: scale(1.04); } .hover-scale-106:hover { transform: scale(1.06); } .hover-scale-108:hover { transform: scale(1.08); } .hover-scale-2:hover { transform: scale(1.2); } .hover-scale-20:hover { transform: scale(2); } .hover-scale-30:hover { transform: scale(3); } .hover-scale-14:hover { transform: scale(1.4); } /* Hover Scale Css End */ /* Active Scale Css End */ .active-scale-09:active { transform: scale(0.9); } .active-scale-094:active { transform: scale(0.94); } .active-scale-098:active { transform: scale(0.98); } .active-scale-102:active { transform: scale(1.02); } /* Active Scale Css End */ /* Hide Scroll bar Css For Custom Modal */ .scroll-hide { position: absolute; overflow-y: hidden; padding-inline-end: 17px; inset-block-start: 0; inset-inline-start: 0; width: 100%; } @media screen and (max-width: 991px) { .scroll-hide { padding-inline-end: 0; } } .scroll-hide-sm { position: absolute; overflow-y: hidden; inset-block-start: 0; inset-inline-start: 0; width: calc(100% - 0px); } /* Hide Scroll bar Css For Custom Modal End */ .scroll-sm::-webkit-scrollbar { width: 6px; } .scroll-sm::-webkit-scrollbar-track { background: hsl(var(--white)); } .scroll-sm::-webkit-scrollbar-thumb { background: #e4e4e4; background: hsl(var(--white)); border-radius: 50px; } @media (max-width: 992px) { .scroll-sm::-webkit-scrollbar-thumb { background: #e4e4e4; } } .scroll-sm::-webkit-scrollbar-thumb:hover { background: #c1c1c1 !important; } .scroll-sm:hover::-webkit-scrollbar-thumb { background: #e4e4e4; } .scroll-sm-horizontal::-webkit-scrollbar { height: 6px; } /* Box shadow start */ .common-shadow { box-shadow: 0 6px 30px 0px rgba(0, 0, 0, 0.0392156863); } /* Box shadow End */ /* transition Css Class start */ .tw-transition { transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } .tw-transition-3 { transition: 0.3s; } .tw-transition-4 { transition: 0.4s; } .tw-transition-5 { transition: 0.5s; } .tw-transition-6 { transition: 0.6s; } .tw-transition-all { transition-property: all; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: 150ms; } /* transition Css Class End */ .tw-duration-75 { transition-duration: 75ms; } .tw-duration-100 { transition-duration: 100ms; } .tw-duration-150 { transition-duration: 150ms; } .tw-duration-200 { transition-duration: 200ms; } .tw-duration-300 { transition-duration: 300ms; } .tw-duration-500 { transition-duration: 500ms; } /*================================== Translate Css Start ==================================*/ /* Translate X */ .tw-translate-x-50 { transform: var(--translate-x-50); } .tw--translate-x-full { transform: translateX(-100%); } .tw--translate-middle { transform: var(--translate-x-50) var(--translate-y-50); } /* Translate Y */ .tw--translate-y-50 { transform: var(--translate-y-50); } .active--translate-y-scale-9:active { transform: translateY(-4px) scale(0.94); transition: 0.06s; } .hover--translate-y-05:hover { transform: translateY(-2px); } .hover--translate-y-1:hover { transform: translateY(-4px); } .hover--translate-y-2:hover { transform: translateY(-8px); } .active--translate-y-05:active { transform: translateY(-2px); } .active--translate-y-1:active { transform: translateY(-4px); } /* Translate X */ .hover--translate-x-05:hover { transform: translateX(-2px); } .hover--translate-x-1:hover { transform: translateX(-4px); } .hover--translate-x-2:hover { transform: translateX(-8px); } /*================================== Translate Css End ==================================*/ /* Transform Css Start */ .origin-left { transform-origin: left; } .object-top { object-position: top; } /* Transform Css End */ /* Text Decoration Start */ .hover-underline:hover { text-decoration: underline; } .hover-underline-none:hover { text-decoration: none; } /* Text Decoration End */ /* width Css Class start */ .tw-w-05 { width: 0.125rem; } .tw-w-1 { width: 0.25rem; } .tw-w-105 { width: 0.375rem; } .tw-w-2 { width: 0.5rem; } .tw-w-205 { width: 0.625rem; } .tw-w-3 { width: 0.75rem; } .tw-w-305 { width: 0.875rem; } .tw-w-4 { width: 1rem; } .tw-w-405 { width: 1.125rem; } .tw-w-5 { width: 1.25rem; } .tw-w-505 { width: 1.375rem; } .tw-w-6 { width: 1.5rem; } .tw-w-605 { width: 1.625rem; } .tw-w-7 { width: 1.75rem; } .tw-w-705 { width: 1.875rem; } .tw-w-8 { width: 2rem; } .tw-w-805 { width: 2.125rem; } .tw-w-9 { width: 2.25rem; } .tw-w-905 { width: 2.375rem; } .tw-w-10 { width: 2.5rem; } .tw-w-101 { width: 2.625rem; } .tw-w-11 { width: 2.75rem; } .tw-w-110 { width: 2.875rem; } .tw-w-12 { width: 3rem; } .tw-w-122 { width: 3.125rem; } .tw-w-13 { width: 3.25rem; } .tw-w-133 { width: 3.375rem; } .tw-w-14 { width: 3.5rem; } .tw-w-140 { width: 3.625rem; } .tw-w-15 { width: 3.75rem; } .tw-w-155 { width: 3.875rem; } .tw-w-16 { width: 4rem; } .tw-w-166 { width: 4.125rem; } .tw-w-17 { width: 4.25rem; } .tw-w-170 { width: 4.375rem; } .tw-w-18 { width: 4.5rem; } .tw-w-118 { width: 4.625rem; } .tw-w-19 { width: 4.75rem; } .tw-w-190 { width: 4.875rem; } .tw-w-20 { width: 5rem; } .tw-w-21 { width: 5.5rem; } .tw-w-210 { width: 5.625rem; } .tw-w-22 { width: 5.75rem; } .tw-w-23 { width: 6rem; } .tw-w-24 { width: 6.25rem; } .tw-w-25 { width: 6.5rem; } .tw-w-26 { width: 6.75rem; } .tw-w-27 { width: 7rem; } .tw-w-28 { width: 7.25rem; } .tw-w-280 { width: 7.375rem; } .tw-w-29 { width: 7.5rem; } .tw-w-30 { width: 7.75rem; } .tw-w-31 { width: 8.5rem; } .tw-w-32 { width: 8.75rem; } .tw-w-33 { width: 9rem; } .tw-w-34 { width: 9.25rem; } .tw-w-38 { width: 9.5rem; } .tw-w-39 { width: 9.75rem; } .tw-w-40 { width: 10rem; } .tw-w-43 { width: 10.75rem; } .tw-w-48 { width: 12rem; } .tw-w-56 { width: 14rem; } .tw-mw-05 { max-width: 0.125rem; } .tw-mw-1 { max-width: 0.25rem; } .tw-mw-105 { max-width: 0.375rem; } .tw-mw-2 { max-width: 0.5rem; } .tw-mw-205 { max-width: 0.625rem; } .tw-mw-3 { max-width: 0.75rem; } .tw-mw-305 { max-width: 0.875rem; } .tw-mw-4 { max-width: 1rem; } .tw-mw-405 { max-width: 1.125rem; } .tw-mw-5 { max-width: 1.25rem; } .tw-mw-505 { max-width: 1.375rem; } .tw-mw-6 { max-width: 1.5rem; } .tw-mw-605 { max-width: 1.625rem; } .tw-mw-7 { max-width: 1.75rem; } .tw-mw-705 { max-width: 1.875rem; } .tw-mw-8 { max-width: 2rem; } .tw-mw-805 { max-width: 2.125rem; } .tw-mw-9 { max-width: 2.25rem; } .tw-mw-905 { max-width: 2.375rem; } .tw-mw-10 { max-width: 2.5rem; } .tw-mw-101 { max-width: 2.625rem; } .tw-mw-11 { max-width: 2.75rem; } .tw-mw-110 { max-width: 2.875rem; } .tw-mw-12 { max-width: 3rem; } .tw-mw-122 { max-width: 3.125rem; } .tw-mw-13 { max-width: 3.25rem; } .tw-mw-133 { max-width: 3.375rem; } .tw-mw-14 { max-width: 3.5rem; } .tw-mw-140 { max-width: 3.625rem; } .tw-mw-15 { max-width: 3.75rem; } .tw-mw-155 { max-width: 3.875rem; } .tw-mw-16 { max-width: 4rem; } .tw-mw-166 { max-width: 4.125rem; } .tw-mw-17 { max-width: 4.25rem; } .tw-mw-170 { max-width: 4.375rem; } .tw-mw-18 { max-width: 4.5rem; } .tw-mw-118 { max-width: 4.625rem; } .tw-mw-19 { max-width: 4.75rem; } .tw-mw-190 { max-width: 4.875rem; } .tw-mw-20 { max-width: 5rem; } .tw-mw-21 { max-width: 5.5rem; } .tw-mw-210 { max-width: 5.625rem; } .tw-mw-22 { max-width: 5.75rem; } .tw-mw-23 { max-width: 6rem; } .tw-mw-24 { max-width: 6.25rem; } .tw-mw-25 { max-width: 6.5rem; } .tw-mw-26 { max-width: 6.75rem; } .tw-mw-27 { max-width: 7rem; } .tw-mw-28 { max-width: 7.25rem; } .tw-mw-280 { max-width: 7.375rem; } .tw-mw-29 { max-width: 7.5rem; } .tw-mw-30 { max-width: 7.75rem; } .tw-mw-31 { max-width: 8.5rem; } .tw-mw-32 { max-width: 8.75rem; } .tw-mw-33 { max-width: 9rem; } .tw-mw-34 { max-width: 9.25rem; } .tw-mw-38 { max-width: 9.5rem; } .tw-mw-39 { max-width: 9.75rem; } .tw-mw-40 { max-width: 10rem; } .tw-mw-43 { max-width: 10.75rem; } .tw-mw-48 { max-width: 12rem; } .tw-mw-56 { max-width: 14rem; } .min-w-max { min-width: max-content; } .tw-w-px { width: 1px; } .tw-w-207-px { width: 207px; } .tw-w-232-px { width: 232.667px; } .tw-w-300-px { width: 300px; } .tw-w-244-px { width: 244px; } .tw-w-300-px { width: 300px; } .tw-w-320-px { width: 320px; } .tw-w-330-px { width: 330px; } .tw-w-350-px { width: 350px; } .tw-w-410-px { width: 410px; } .tw-w-435-px { width: 435px; } .tw-w-458-px { width: 458px; } .tw-w-470-px { width: 470px; } .tw-w-480-px { width: 480px; } .tw-w-510-px { width: 510px; } .tw-w-520-px { width: 520px; } .tw-w-528-px { width: 528px; } .tw-w-550-px { width: 550px; } .tw-w-580-px { width: 580px; } .tw-w-660-px { width: 660px; } .tw-w-680-px { width: 680px; } .tw-w-704-px { width: 704px; } .tw-w-835-px { width: 835px; } .tw-w-1594-px { width: 1594px; } .tw-w-w-max { width: max-content; } /* width Css Class End */ /* Z index css start */ .tw-z-99 { z-index: 99; } .tw-z-991 { z-index: 991; } .tw-z-999 { z-index: 999; } .z-4 { z-index: 4 !important; } .z-5 { z-index: 5 !important; } /* Z index css End */ /* ======================== Animation Css Start ==================================== */ /* Raw animations start here */ .animation-item:hover .animate__bounce { animation: bounce 1.5s; } .animation-item:hover .animate__wobble { animation: wobble 1.5s ease-in-out; } .animation-item:hover .animate__heartBeat { animation: heartbeat 1.5s ease-in-out; } .animation-item:hover .animate__flipInY { animation: flipInY 1.5s ease-in-out; } .animation-item:hover .animate__swing { animation: swing 1.5s ease-in-out; } @keyframes bounce { 0%, 20%, 53%, 100% { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform: translateZ(0); transform: translateZ(0); } 40%, 43% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -30px, 0) scaleY(1.1); transform: translate3d(0, -30px, 0) scaleY(1.1); } 70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -15px, 0) scaleY(1.05); transform: translate3d(0, -15px, 0) scaleY(1.05); } 80% { -webkit-transform: translateZ(0) scaleY(0.95); transform: translateZ(0) scaleY(0.95); -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 90% { -webkit-transform: translate3d(0, -4px, 0) scaleY(1.02); transform: translate3d(0, -4px, 0) scaleY(1.02); } } @keyframes wobble { 0% { -webkit-transform: translateZ(0); transform: translateZ(0); } 15% { -webkit-transform: translate3d(-25%, 0, 0) rotate(-5deg); transform: translate3d(-25%, 0, 0) rotate(-5deg); } 30% { -webkit-transform: translate3d(20%, 0, 0) rotate(3deg); transform: translate3d(20%, 0, 0) rotate(3deg); } 45% { -webkit-transform: translate3d(-15%, 0, 0) rotate(-3deg); transform: translate3d(-15%, 0, 0) rotate(-3deg); } 60% { -webkit-transform: translate3d(10%, 0, 0) rotate(2deg); transform: translate3d(10%, 0, 0) rotate(2deg); } 75% { -webkit-transform: translate3d(-5%, 0, 0) rotate(-1deg); transform: translate3d(-5%, 0, 0) rotate(-1deg); } 100% { -webkit-transform: translateZ(0); transform: translateZ(0); } } @keyframes heartbeat { 0% { -webkit-transform: scale(1); transform: scale(1); } 14% { -webkit-transform: scale(1.3); transform: scale(1.3); } 28% { -webkit-transform: scale(1); transform: scale(1); } 42% { -webkit-transform: scale(1.3); transform: scale(1.3); } 70% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes flipInY { 0% { -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); } 40% { -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; -webkit-transform: perspective(400px) rotateY(-20deg); transform: perspective(400px) rotateY(-20deg); } 60% { opacity: 1; -webkit-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg); } 80% { -webkit-transform: perspective(400px) rotateY(-5deg); transform: perspective(400px) rotateY(-5deg); } 100% { -webkit-transform: perspective(400px); transform: perspective(400px); } } @keyframes swing { 20% { -webkit-transform: rotate(15deg); transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } 100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } } .animation-scalation { animation: scalation 8s linear infinite; } .animation-upDown { animation: animationUpDown 8s linear infinite; } .animation-rotate-scale { animation: scaleRotate 4.5s ease-in-out infinite; } @keyframes scaleRotate { 0% { transform: scale(1) rotate(0deg); } 25% { transform: scale(1.2); } 50% { transform: scale(1.2) rotate(180deg); } 75% { transform: scale(1.2) rotate(360deg); } 100% { transform: scale(1) rotate(360deg); } } @keyframes scalation { 0% { transform: scale(1); } 50% { transform: scale(0.5); } 100% { transform: scale(1); } } @keyframes animationUpDown { 0% { transform: translateY(0px); } 50% { transform: translateY(-60px); } 100% { transform: translateY(0px); } } .animation-delay-1 { animation-delay: 1s !important; } .animation-delay-2 { animation-delay: 2s; } .animation-delay-3 { animation-delay: 3s; } @keyframes rotateImg { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @keyframes borderanimate2 { 0% { transform: translate(-50%, -50%) scale(0.8); } 60% { opacity: 1; } 100% { transform: translate(-50%, -50%) scale(2.5); opacity: 0; } } @keyframes bounce-y { 0% { -webkit-transform: translateY(-40px); -moz-transform: translateY(-40px); -ms-transform: translateY(-40px); -o-transform: translateY(-40px); transform: translateY(-40px); } 100% { -webkit-transform: translateY(30px); -moz-transform: translateY(30px); -ms-transform: translateY(30px); -o-transform: translateY(30px); transform: translateY(30px); } } @keyframes moving { 0% { transform: translatey(0px); } 20% { transform: translateX(-30px); } 50% { transform: translatey(-20px); } 100% { transform: translatey(0px); } } @keyframes bounce-x { 0% { transform: translateX(0); } 50% { transform: translateX(50px); } 100% { transform: translateX(0); } } /*img-animation**********************/ .tw-animation-img-right { animation: img-anim-right 1.3s forwards cubic-bezier(0.645, 0.045, 0.355, 1) 0.4s; opacity: 0; } @keyframes img-anim-right { 0% { transform: translateX(5%); clip-path: inset(0 0 0 100%); opacity: 0; } 100% { transform: translateX(0); clip-path: inset(0 0 0 0); opacity: 1; } } .tw-animation-img-left { animation: img-anim-left 1.3s forwards cubic-bezier(0.645, 0.045, 0.355, 1) 0.4s; opacity: 0; } @keyframes img-anim-left { 0% { transform: translateX(-5%); clip-path: inset(0 100% 0 0); opacity: 0; } 100% { transform: translateX(0); clip-path: inset(0 0 0 0); opacity: 1; } } .tw-animation-img-top { animation: img-anim-top 1.5s forwards cubic-bezier(0.645, 0.045, 0.355, 1); opacity: 0; } @keyframes img-anim-top { 0% { transform: translateY(-5%); clip-path: inset(0 0 100% 0); opacity: 0; } 100% { transform: translateY(0); clip-path: inset(0 0 0 0); opacity: 1; } } .tw-animation-img-bottom { animation: img-anim-bottom 1.5s forwards cubic-bezier(0.645, 0.045, 0.355, 1); opacity: 0; } @keyframes img-anim-bottom { 0% { transform: translateY(105%); clip-path: inset(0 0 100% 0); opacity: 0; } 100% { transform: translateY(0); clip-path: inset(0 0 0 0); opacity: 1; } } /* ======================== Animation Css End ==================================== */ .tw-container-1380-px { max-width: 1380px; } .tw-container-1460-px { max-width: 1460px; } .tw-container-1480-px { max-width: 1480px; } .tw-container-1500-px { max-width: 1500px; } .tw-container-1530-px { max-width: 1530px; } .tw-container-1570-px { max-width: 1570px; } .tw-container-1580-px { max-width: 1580px; } .tw-container-1730-px { max-width: 1730px; } .tw-container-1750-px { max-width: 1750px; } .tw-container-1870-px { max-width: 1870px; } .text-stroke-white { -webkit-text-fill-color: transparent; -webkit-text-stroke: 1px #fff; } .text-stroke-white-3 { -webkit-text-fill-color: transparent; -webkit-text-stroke: 3px #fff; } .text-stroke-black { -webkit-text-fill-color: transparent; -webkit-text-stroke: 1px hsl(var(--heading-color)); } .text-stroke-neutral-900 { -webkit-text-fill-color: transparent; -webkit-text-stroke: 1px var(--neutral-900); } .text-stroke-main-600 { -webkit-text-fill-color: transparent; -webkit-text-stroke: 1px var(--main-eight-600); } .text-stroke-main-three-600 { -webkit-text-fill-color: transparent; -webkit-text-stroke: 1px var(--main-three-600); } /* ================================= preload Css Start =========================== */ .loading-screen { -webkit-box-align: center; -ms-flex-align: center; align-items: center; cursor: default; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: hsl(var(--white)); z-index: 1000; } .loading-screen .bar { position: absolute; height: 100%; width: 50%; background-color: transparent; } .loading-screen .top-bar { top: 0; left: 0; right: auto; bottom: auto; } .loading-screen .down-bar { bottom: 0; top: auto; right: 0; left: auto; } .loading-screen .animation-preloader { z-index: 1000; width: 70%; margin: auto; } .loading-screen .animation-preloader .spinner { -webkit-animation: spinner-run 8s infinite linear; animation: spinner-run 8s infinite linear; margin-bottom: 0%; } .loading-screen .animation-preloader .spinner img { width: 260px; height: 340px; object-fit: cover; } .loading-screen .animation-preloader .txt-loading { font: bold 4rem "Work Sans", sans-serif; text-align: center; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } @media screen and (max-width: 767px) { .loading-screen .animation-preloader .txt-loading { font: bold 3.4rem "Work Sans", sans-serif; } } @media screen and (max-width: 575px) { .loading-screen .animation-preloader .txt-loading { font: bold 2.5rem "Work Sans", sans-serif; } } @media screen and (max-width: 424px) { .loading-screen .animation-preloader .txt-loading { font: bold 2.2rem "Work Sans", sans-serif; } } .loading-screen .animation-preloader .txt-loading .letters-loading { color: hsl(var(--heading-color)); position: relative; } .loading-screen .animation-preloader .txt-loading .letters-loading:before { -webkit-animation: letters-loading 4s infinite; animation: letters-loading 4s infinite; color: var(--main-eight-600); content: attr(data-text-preloader); left: 0; opacity: 0; font-family: "Parkinsans", sans-serif; position: absolute; top: -3px; -webkit-transform: rotateY(-90deg); transform: rotateY(-90deg); } .loading-screen .animation-preloader .txt-loading .letters-loading:nth-child(2):before { -webkit-animation-delay: 0.2s; animation-delay: 0.2s; } .loading-screen .animation-preloader .txt-loading .letters-loading:nth-child(3):before { -webkit-animation-delay: 0.4s; animation-delay: 0.4s; } .loading-screen .animation-preloader .txt-loading .letters-loading:nth-child(4):before { -webkit-animation-delay: 0.6s; animation-delay: 0.6s; } .loading-screen .animation-preloader .txt-loading .letters-loading:nth-child(5):before { -webkit-animation-delay: 0.8s; animation-delay: 0.8s; } .loading-screen .animation-preloader .txt-loading .letters-loading:nth-child(6):before { -webkit-animation-delay: 1s; animation-delay: 1s; } .loading-screen .animation-preloader .txt-loading .letters-loading:nth-child(7):before { -webkit-animation-delay: 1.2s; animation-delay: 1.2s; } .loading-screen .animation-preloader .txt-loading .letters-loading:nth-child(8):before { -webkit-animation-delay: 1.3s; animation-delay: 1.3s; } .loading-screen .animation-preloader .txt-loading .letters-loading:nth-child(9):before { -webkit-animation-delay: 1.4s; animation-delay: 1.4s; } .loading-screen .animation-preloader .txt-loading .letters-loading:nth-child(10):before { -webkit-animation-delay: 1.5s; animation-delay: 1.5s; } @-webkit-keyframes spinner-run { 0% { -webkit-transform: translateX(0px); transform: translateX(0px); } 100% { -webkit-transform: translateX(80%); transform: translateX(80%); } } @keyframes spinner-run { 0% { -webkit-transform: translateX(0px); transform: translateX(0px); } 100% { -webkit-transform: translateX(80%); transform: translateX(80%); } } @-webkit-keyframes letters-loading { 0%, 75%, 100% { opacity: 0; -webkit-transform: rotateY(-90deg); transform: rotateY(-90deg); } 25%, 50% { opacity: 1; -webkit-transform: rotateY(0deg); transform: rotateY(0deg); } } @keyframes letters-loading { 0%, 75%, 100% { opacity: 0; -webkit-transform: rotateY(-90deg); transform: rotateY(-90deg); } 25%, 50% { opacity: 1; -webkit-transform: rotateY(0deg); transform: rotateY(0deg); } } /* ================================= preload Css End =========================== */ .header-top-bg { border-radius: 0 0 25px 25px; } .header-top-paragraph { font-size: 15px; color: rgba(255, 255, 255, 0.77); } .header-top-address { font-size: 15px; letter-spacing: 0.01em; color: rgba(255, 255, 255, 0.85); } .header-top-two-bg { border-radius: 0 0 10px 10px; } /* ============= Header Start Here ======================= */ @media screen and (max-width: 1199px) { .header { padding-block: 10px; } } .header.fixed-header { position: sticky; inset-inline-start: 0; inset-block-start: 0; inset-inline-end: 0; width: 100%; z-index: 9; backdrop-filter: blur(24px); animation: slideDown 0.35s ease-out; box-shadow: 0 5px 16px rgba(0, 0, 0, 0.1); background: hsl(var(--white)); } @media screen and (max-width: 991px) { .header.fixed-header { inset-block-start: -1px; } } @media screen and (max-width: 1399px) { .header-search { display: none; } } @media screen and (max-width: 575px) { .header-button { display: none; } } @media screen and (max-width: 767px) { .header-call-item { display: none !important; } } @keyframes slideDown { from { transform: translateY(-100%); } to { transform: translateY(0); } } /* Header Menu and Submenu Css Start */ .nav-menu__item.activePage > a { color: var(--main-eight-600) !important; } .nav-menu__item.activePage > a::before { color: var(--main-eight-600); } .nav-menu__item:hover > a { color: hsl(var(--heading-color)); } @media (min-width: 992px) { .nav-menu__item:hover > a { color: var(--main-eight-600); } } .has-submenu.active > a, .has-submenu.active > a::before { color: var(--main-eight-600); } .has-submenu.active > a::before { transform: translateY(-50%) rotate(180deg) !important; } .has-submenu:hover .nav-submenu { visibility: visible; opacity: 1; transform: scaleY(1); } @media (min-width: 992px) { .has-submenu:hover > a::before { color: var(--main-eight-600); transform: translateY(-50%) rotate(180deg); } } .has-submenu > a { position: relative; } .has-submenu > a::before { position: absolute; content: "\e136"; inset-inline-end: 0; inset-block-start: 52%; transform: translateY(-50%); font-family: "Phosphor"; font-weight: 400; color: hsl(var(--heading-color)); transition: 0.2s linear; font-size: 15px; } /* Submenu Start */ .nav-submenu { box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1019607843), 0 4px 6px -4px rgba(0, 0, 0, 0.1019607843); min-width: 230px; visibility: hidden; opacity: 0; transform: scaleY(0); transition: 0.4s ease; transform-origin: top center; } .nav-submenu__item.activePage .nav-submenu__link { color: var(--main-eight-600) !important; } .nav-submenu__item:hover a { color: hsl(var(--heading-color)); } .toggle-mobileMenu span img { filter: brightness(0) invert(0); } .nav-submenu .nav-submenu__item .nav-submenu__link::before { content: ""; position: absolute; width: 0px; height: 2px; background: var(--main-eight-600); left: -2px; bottom: 18px; transition: all 0.4s ease-in-out; } .nav-submenu .nav-submenu__item .nav-submenu__link:hover { color: var(--main-eight-600); margin-inline-start: 10px; } .nav-submenu .nav-submenu__item .nav-submenu__link:hover::before { width: 10px; } .nav-submenu .nav-submenu__item.activePage .nav-submenu__link { margin-inline-start: 10px; } .nav-submenu .nav-submenu__item.activePage .nav-submenu__link::before { width: 10px; } .header-two { border-bottom: 1px solid rgba(29, 31, 21, 0.1); } .header-two-cart button:hover span .header-cart-icon { display: none; } .header-two-cart button:hover span .header-cart-icon-white { display: block !important; } @media screen and (max-width: 575px) { .header-two-button { display: none; } } .header-two-button .tw-primary-btn .btn_inner { padding: 13px 65px 13px 37px; } @media screen and (max-width: 1199px) { .header-five { padding-inline: 20px; padding-block: 16px; display: none; } } .header-five-wrapper { display: flex; align-items: center; } @media screen and (max-width: 1699px) { .header-five-wrapper { justify-content: space-between; } } .header-five-wrap { border: 1px solid rgba(24, 24, 24, 0.1); padding-block: 24px; border-top: none; } @media screen and (max-width: 1699px) { .header-five-width { width: 450px; } } @media screen and (max-width: 1499px) { .header-five-width { width: 380px; } } @media screen and (max-width: 1399px) { .header-five-width { width: 430px; } } @media screen and (max-width: 1199px) { .header-five-width { width: inherit; } } @media screen and (max-width: 1499px) { .header-five-width img { max-width: 190px; } } @media screen and (max-width: 1499px) { .header-five-width .tw-primary-btn .btn_inner { padding: 14px 55px 14px 18px; } } .header-five-nav { border-left: 1px solid rgba(24, 24, 24, 0.1); border-right: 1px solid rgba(24, 24, 24, 0.1); } @media screen and (max-width: 1199px) { .header-five-nav { border-left: none; border-right: none; } } @media screen and (max-width: 1199px) { .header-five-button { display: none; } } .header-five-sticky { display: none; } @media screen and (max-width: 1199px) { .header-five-sticky { display: block; } } @media screen and (max-width: 1199px) { .header-six { padding-inline: 0; padding-block: 0; } } .header-six-wrapper { align-items: inherit !important; } .header-six-left { width: 415px; } @media screen and (max-width: 1199px) { .header-six-left { width: 290px; } } @media screen and (max-width: 767px) { .header-six-left { padding-block: 20px; } } .header-six-left::before { content: ""; position: absolute; width: 100%; height: 100%; inset-block-start: 0; inset-inline-start: 0; background: var(--main-six-600); z-index: -1; clip-path: polygon(0 0, 100% 0, 90% 100%, 0% 100%); } .header-six-wrap { padding-block: 0; border-left: none; } .header-six-nav { border-left: none; border-right: none; } .header-six-cart { padding-inline-start: 46px; padding-block: 23px; } .header-six-cart::before { content: ""; position: absolute; width: 1px; height: 100%; inset-block-start: 50%; inset-inline-start: 0; background: rgba(35, 31, 32, 0.1); transform: translateY(-50%); rotate: 15deg; } .header-six-social li.text-heading { padding-inline-end: 20px; padding-block: 12px; margin-inline-end: 11px; } .header-six-social li.text-heading::before { content: ""; position: absolute; width: 1px; height: 100%; inset-block-start: 50%; inset-inline-end: 0; background: rgba(35, 31, 32, 0.1); transform: translateY(-50%); rotate: 15deg; } .header-seven.fixed-header { background: #051c35; } .header-seven .header-menu .has-submenu > a::before { color: hsl(var(--white)); } .header-seven .header-menu .has-submenu > a:hover::before { color: var(--main-eight-600); } .header-seven-mobileMenu span img { filter: brightness(0) invert(1); } .header.fixed-header.header-five-sticky { display: block; } .header-ip-area { border-bottom: none; } .header-ten-top { padding-block: 12px; border-bottom: 1px solid #afb4b5; } @media screen and (max-width: 1199px) { .header-ten-top { display: none; } } .header-ten-top::before { content: ""; position: absolute; width: 1px; height: 100%; inset-block-start: 0; inset-inline-start: 13%; background: #afb4b5; z-index: -1; } @media screen and (max-width: 1499px) { .header-ten-top::before { inset-inline-start: 16%; } } @media screen and (max-width: 1399px) { .header-ten-top::before { inset-inline-start: 18%; } } .header-ten-top::after { content: ""; position: absolute; width: 1px; height: 100%; inset-block-start: 0; inset-inline-end: 10%; background: #afb4b5; z-index: -1; } @media screen and (max-width: 1699px) { .header-ten-top::after { inset-inline-end: 11%; } } @media screen and (max-width: 1499px) { .header-ten-top::after { inset-inline-end: 14%; } } @media screen and (max-width: 1399px) { .header-ten-top::after { inset-inline-end: 16%; } } @media screen and (max-width: 1699px) { .header-ten-top-start { gap: var(--size-8); } } @media screen and (max-width: 1499px) { .header-ten-top-info { display: none !important; } } .header-ten-top-nice-select { font-weight: 600; font-size: 15px; color: #041427; padding-inline-end: 40px; border: none; border-radius: 0; } .header-ten-top-nice-select::after { border-bottom: 1px solid hsl(var(--heading-color)); border-right: 1px solid hsl(var(--heading-color)); height: 8px; top: 55%; width: 8px; transform: rotate(45deg) translateY(-50%); } .header-transparent { position: absolute; width: 100%; inset-block-start: 0; inset-inline-start: 0; margin: auto; z-index: 99; background: transparent; } .header-transparent.fixed-header { position: fixed !important; } .header-eight.fixed-header { position: fixed !important; } /* Submenu End */ /* Header Menu and Submenu Css End */ /* ================================= Header Css End =========================== */ .footer { background: #040542; padding-block: 100px 0px; } .footer-col-1 { margin-inline-end: 80px; } @media screen and (max-width: 1399px) { .footer-col-1 { margin-inline-end: 35px; } } @media screen and (max-width: 1199px) { .footer-col-1 { margin-inline-end: 0; margin-block-end: 30px; } } .footer-col-2 { margin-inline-start: -13px; } @media screen and (max-width: 1199px) { .footer-col-2 { margin-inline-start: 0; margin-block-end: 30px; } } .footer-col-3 { margin-inline-start: -40px; } @media screen and (max-width: 1199px) { .footer-col-3 { margin-inline-start: 0; margin-block-end: 30px; } } .footer-address ul li { color: rgba(255, 255, 255, 0.77); } .footer-address ul li a { color: rgba(255, 255, 255, 0.77); } .footer-form input::placeholder { color: hsl(var(--white)); } @media screen and (max-width: 767px) { .footer-copyright-wrapper { justify-content: center !important; } } .footer-border-bottom { border-bottom: 1px solid rgba(255, 255, 255, 0.08); } .footer-shape-1 { animation: bounce-y 4s forwards infinite alternate; } .footer-shape-2 { animation: bounce-x 3.5s infinite; } .footer-two-area { background: rgba(1, 100, 225, 0.06); } .footer-two-area::before { content: ""; position: absolute; width: 500px; height: 500px; inset-block-start: 0; inset-inline-start: 0; border-radius: 50%; background: #f4efcf; filter: blur(801px); z-index: -1; } .footer-two-border { border-bottom: 1px solid rgba(4, 27, 52, 0.1); } .footer-two-border::before { content: ""; position: absolute; width: 1px; height: 100%; inset-block-end: 0; inset-inline-start: 50%; transform: translateX(-50%); background: rgba(4, 27, 52, 0.1); } @media screen and (max-width: 1199px) { .footer-two-border::before { display: none; } } @media screen and (max-width: 1199px) { .footer-two-col-1 { margin-block-end: 30px; } } @media screen and (max-width: 1199px) { .footer-two-col-2 { margin-block-end: 30px; margin-inline-start: 0; } } .footer-two-col-3 { margin-inline-start: 65px; } @media screen and (max-width: 1199px) { .footer-two-col-3 { margin-inline-start: 0; } } @media screen and (max-width: 767px) { .footer-two-col-3 { margin-block-end: 30px; } } @media screen and (max-width: 1199px) { .footer-two-col-4 { margin-inline-start: 0; } } @media screen and (max-width: 767px) { .footer-two-col-4 { margin-block-end: 30px; } } .footer-two-form input { border: 1px solid #d0d4c9 !important; padding-inline-end: 200px; } .footer-two-social li a { border: 1px solid rgba(4, 27, 52, 0.1); } .footer-two-info { border-top: 1px solid rgba(4, 27, 52, 0.1); margin-block-start: 60px; padding-block-start: 30px; } @media screen and (max-width: 991px) { .footer-two-info { margin-block-start: 40px; padding-block-start: 10px; flex-wrap: wrap; row-gap: 10px; padding-block-end: 10px; margin-inline-start: 0; } } @media screen and (max-width: 991px) { .footer-two-form { margin-inline-end: 0; } } .footer-two-shape-1 { inset-block-start: 70px; animation: bounce-y 5s forwards infinite alternate; } @media screen and (max-width: 991px) { .footer-two-shape-1 { display: none; } } .footer-three-area { background: #041b34; } .footer-three-border-start::before { content: ""; position: absolute; width: 1px; height: 100%; inset-block-start: 0; inset-inline-start: 37%; background: rgba(255, 255, 255, 0.2); } @media screen and (max-width: 1699px) { .footer-three-border-start::before { inset-inline-start: 34%; } } @media screen and (max-width: 1499px) { .footer-three-border-start::before { inset-inline-start: 32%; } } @media screen and (max-width: 1199px) { .footer-three-border-start::before { display: none; } } .footer-three-border-end { border-bottom: 1px solid rgba(255, 255, 255, 0.2); } @media screen and (max-width: 1199px) { .footer-three-col-1 { margin-inline-start: 0; margin-block-end: 30px; } } @media screen and (max-width: 1199px) { .footer-three-col-2 { margin-inline-start: 0; margin-block-end: 30px; } } @media screen and (max-width: 1199px) { .footer-three-col-3 { margin-inline-start: 0; } } @media screen and (max-width: 575px) { .footer-three-col-3 { margin-inline-start: 0; margin-block-end: 30px; } } @media screen and (max-width: 1199px) { .footer-three-col-4 { margin-inline-start: 0; } } @media screen and (max-width: 575px) { .footer-three-col-4 { margin-inline-start: 0; margin-block-end: 30px; } } .footer-three-message span { border: 1px solid rgba(255, 255, 255, 0.21); } .footer-three-border { border-bottom: 1px solid rgba(255, 255, 255, 0.2); } .footer-three-input { border: 1px solid rgba(255, 255, 255, 0.3); } @media screen and (max-width: 991px) { .footer-three-copyright-wrapper { justify-content: center !important; } } @media screen and (max-width: 1199px) { .footer-four-col-1 { margin-block-end: 40px; } } @media screen and (max-width: 767px) { .footer-four-col-1 { margin-inline-start: 0; } } .footer-four-col-2 { margin-inline-start: 64px; } @media screen and (max-width: 1199px) { .footer-four-col-2 { margin-block-end: 40px; } } @media screen and (max-width: 767px) { .footer-four-col-2 { margin-inline-start: 0; } } .footer-four-col-3 { margin-inline-start: 42px; } @media screen and (max-width: 1199px) { .footer-four-col-3 { margin-block-end: 40px; } } @media screen and (max-width: 767px) { .footer-four-col-3 { margin-inline-start: 0; } } .footer-four-col-4 { margin-inline-start: -5px; } @media screen and (max-width: 1199px) { .footer-four-col-4 { margin-inline-start: 65px; margin-block-end: 40px; } } @media screen and (max-width: 767px) { .footer-four-col-4 { margin-inline-start: 0; } } .footer-four-gallery ul { display: flex; flex-wrap: wrap; gap: 10px; } .footer-four-form input { padding-inline-end: 166px; } .footer-six-col-1 { padding-block-start: 120px; } @media screen and (max-width: 1199px) { .footer-six-col-2 { margin-inline-start: 26px; } } @media screen and (max-width: 991px) { .footer-six-col-2 { margin-inline-start: 0; } } @media screen and (max-width: 1199px) { .footer-six-col-3 { margin-inline-start: 26px; margin-block: 30px; } } @media screen and (max-width: 991px) { .footer-six-col-3 { margin-inline-start: 0; } } .footer-six-copyright { border-top: 1px solid rgba(255, 255, 255, 0.2); padding-block: 54px; } .footer-six-top-right { border-bottom: 1px solid rgba(255, 255, 255, 0.2); padding-block-end: 50px; } .footer-six-top-right::before { content: ""; position: absolute; width: 1px; height: 54%; inset-block-end: 0; inset-inline-start: 36%; background: rgba(255, 255, 255, 0.2); transform: translateX(-50%); } @media screen and (max-width: 1199px) { .footer-six-top-right::before { display: none; } } @media screen and (max-width: 1199px) { .footer-six-top-subcribe { margin-inline-start: 0; } } .footer-six-bottom-right { padding-block-start: 50px; } .footer-six-border { border-left: 1px solid rgba(255, 255, 255, 0.2); height: 100%; padding-block-start: 120px; } @media screen and (max-width: 991px) { .footer-six-border { border-left: none; } } .footer-six-form input { padding-inline-end: 140px; } .footer-seven-area { background: #000B1A; } @media screen and (max-width: 575px) { .footer-seven-shape-1 { display: none; } } @media screen and (max-width: 575px) { .footer-seven-shape-2 { display: none; } } @media screen and (max-width: 575px) { .footer-seven-shape-3 { display: none; } } @media screen and (max-width: 575px) { .footer-seven-shape-4 { display: none; } } .footer-eight-area { background: #00174f; border-radius: 20px; } .footer-eight-top-form { background: rgba(255, 255, 255, 0.2); border: 1px solid rgba(255, 255, 255, 0.46); border-radius: 78px; } .footer-eight-top-form input { border-radius: 78px; background: transparent; border: none; } .footer-eight-top-form input::placeholder { color: hsl(var(--white)) !important; } .footer-eight-top-form input:focus { background: transparent; } @media screen and (max-width: 1199px) { .footer-eight-col-1 { margin-block-end: 40px; } } @media screen and (max-width: 1399px) { .footer-eight-col-2 { margin-inline-start: 0; } } @media screen and (max-width: 1199px) { .footer-eight-col-2 { margin-block-end: 40px; } } @media screen and (max-width: 1199px) { .footer-eight-col-3 { margin-inline-start: 0; } } @media screen and (max-width: 767px) { .footer-eight-col-3 { margin-block-end: 40px; } } @media screen and (max-width: 1199px) { .footer-eight-col-4 { margin-inline-start: 0; } } @media screen and (max-width: 767px) { .footer-eight-col-4 { margin-block-end: 40px; } } .footer-eight-form input { width: 287px; } @media screen and (max-width: 991px) { .footer-eight-copyright-wrapper { justify-content: space-between !important; } } @media screen and (max-width: 767px) { .footer-eight-copyright-wrapper { justify-content: center !important; } } /* Mega menu css start */ .mega-menu { position: absolute; inset-block-start: 100%; background-color: #fff; width: 100%; inset-inline-start: 0; z-index: 99; box-shadow: rgba(0, 0, 0, 0.2) 0px 20px 30px; max-height: 740px; overflow-y: auto; overflow-x: hidden; } @media (max-width: 991px) { .mega-menu { margin-block: 16px !important; margin-inline-start: 0 !important; padding-inline-end: 4px !important; } } .mega-menu-item__buttons { transition: all 0.5s; } .mega-menu-item__overlay { background-color: rgba(0, 0, 0, 0.5490196078); transition: all 0.25s; } .mega-menu-item__buttons { margin-top: -60px; transform: scale(0.8); } .mega-menu-item:hover .mega-menu-item__buttons { transition-delay: 0.1s; margin-top: 0px; transform: scale(1); } .mega-menu .mega-menu-item a { color: hsl(var(--heading-color)) !important; } .mega-menu .mega-menu-item a:hover { color: var(--main-eight-600) !important; } /* Mega menu css end */ /* Mobile Menu Sidebar Start */ .mobile-menu.active { transform: translateX(0%); } .nav-menu--mobile .nav-menu__item > a::before { transform: translateY(-50%) rotate(0deg); color: hsl(var(--white)); } .nav-menu--mobile .nav-menu__item > a:hover::before { color: var(--main-eight-600); } .nav-menu--mobile .nav-menu__link { border-bottom: 1px solid var(--neutral-200) !important; position: relative; padding: 12px 0; padding-inline-end: 16px; color: hsl(var(--white)); } .nav-menu--mobile .nav-submenu { position: static !important; visibility: visible; opacity: 1; box-shadow: none; width: 100%; margin-block-start: 0; padding: 0; margin-inline-start: 16px; display: none; transition: 0s; background: none !important; } .nav-menu--mobile .nav-submenu__link { width: 100%; padding: 10px 0; border-bottom: 1px solid var(--neutral-200) !important; color: hsl(var(--white)); border-radius: 0; padding-inline-start: 20px; } .nav-menu--mobile .nav-submenu__link:hover { background: hsl(var(--heading-color)) !important; color: hsl(var(--main-eight-600)); } .nav-menu--mobile .nav-submenu__item:hover { background-color: transparent; color: var(--main-eight-600); } .nav-menu--mobile .nav-submenu__item::before { display: none; } .nav-menu .mega-menu { margin-inline-start: 0; } .nav-menu .mega-menu-item a { color: hsl(var(--white)); } /* Mobile Menu Sidebar Start */ /* ===================== Scroll to Top Start ================================= */ .back-to-top-wrapper { position: fixed; inset-inline-end: 40px; inset-block-end: 0; height: 44px; width: 44px; cursor: pointer; display: block; border-radius: 50%; z-index: 99; opacity: 0; visibility: hidden; transition: all 0.3s 0s ease-out; } .back-to-top-wrapper.back-to-top-btn-show { visibility: visible; opacity: 1; inset-block-end: 40px; } .back-to-top-btn { width: 44px; height: 44px; line-height: 1; display: inline-flex; align-items: center; justify-content: center; background: var(--main-eight-600); box-shadow: 0px 8px 16px rgba(3, 4, 28, 0.3); color: hsl(var(--white)); border-radius: 50%; transition: all 0.3s 0s ease-out; } .back-to-top-btn svg { transform: translateY(-2px); font-weight: 600; } .back-to-top-btn:hover { transform: translateY(-4px); } /* ===================== Scroll to Top End ================================= */ /* Custom Cursor Css Start */ .cursor, .dot { width: 32px; height: 32px; border: 1px solid hsl(var(--white)); border-radius: 50%; position: fixed; top: 0; left: 0; pointer-events: none; z-index: 9999999; transform: translate(-50%, -50%); visibility: hidden; font-size: 8px; display: flex; justify-content: center; align-items: center; color: #fff; mix-blend-mode: difference; } .dot { width: 4px; height: 4px; background-color: hsl(var(--white)); mix-blend-mode: difference; } /* Custom Cursor Css End */ .search_popup { position: fixed; top: 0; left: 0; width: 100%; background-color: hsl(var(--black)); z-index: 100; padding-top: 70px; padding-bottom: 100px; opacity: 0; backdrop-filter: blur(10px); transform: translateY(calc(-100% - 80px)); transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out; transition-delay: 0.5s; z-index: 9999; } .search_popup.search-opened { opacity: 1; transform: translateY(0); transition-delay: 0s; } .search_popup.search-opened .search_form .search_input { transform: translateY(0px); opacity: 1; transition-delay: 0.3s; } .search_popup.search-opened .search_form .search_input::after { width: 100%; transition-delay: 0.5s; } .search_wrapper .search_top { margin-bottom: 80px; } .search_wrapper .search_top .search_logo { max-width: 210px; } .search_wrapper .search_top .search_logo a { display: block; } .search_wrapper .search_top .search_logo a img { filter: brightness(0) invert(1); } .search_wrapper .search_top .search_close .search_close_btn { font-size: 25px; color: hsl(var(--white)); transition: all 0.3s ease-in-out 0s; } .search_wrapper .search_top .search_close .search_close_btn svg { width: 30px; height: 30px; } .search_wrapper .search_top .search_close .search_close_btn:hover { color: var(--main-two-600); transform: rotate(90deg); } .search_wrapper .search_form .search_input { position: relative; height: 80px; transform: translateY(-40px); transition: all 0.3s ease-in-out; transition-delay: 0.5s; opacity: 0; } .search_wrapper .search_form .search_input::after { position: absolute; content: ""; left: 0; bottom: 0; width: 0%; height: 1px; background-color: rgba(255, 255, 255, 0.3); transition-delay: 0.3s; transition: all 0.3s ease-in-out; } .search_wrapper .search_form .search_input input { width: 100%; height: 100% !important; background-color: transparent !important; border: 0 !important; border-bottom-width: 0px; border-bottom-style: none; border-bottom-color: currentcolor; outline: 0; font-size: 20px; border-bottom: 1px solid hsl(var(--white)) !important; padding: 0 !important; padding-right: 0px; padding-right: 30px !important; color: hsl(var(--white)) !important; } .search_wrapper .search_form .search_input input::placeholder { font-size: 24px; color: var(--tj-color-common-white) !important; } .search_wrapper .search_form .search_input input ~ .search-focus-border { position: absolute; bottom: 0; left: auto; right: 0; width: 0; height: 1px; background-color: var(--tj-color-common-black); transition: all 0.5s; } .search_wrapper .search_form .search_input input:focus ~ .search-focus-border { width: 100%; left: 0; right: auto; transition: all 0.5s; } .search_wrapper .search_form .search_input button { position: absolute; top: 50%; right: 0; transform: translateY(-50%); font-size: 18px; color: hsl(var(--white)); } .search-popup-overlay { position: fixed; left: 0; top: 0; width: 100%; height: 100%; backdrop-filter: blur(10px); z-index: 99; opacity: 0.7; cursor: zoom-out; transform: translateY(calc(-100% - 80px)); transition: all 0.5s ease-in-out 0s; transition-delay: 0.3s; } .search-popup-overlay.search-popup-overlay-open { transform: translateY(0); } .progress-container, .progress { background-color: #dce0ee; border-radius: 5px; position: relative; height: 7px; width: 100%; } .progress { width: 0; height: 7px; top: 50%; left: 0; transition: 0.8s linear; transform: translateY(-50%); background-color: var(--main-eight-600); } .progress.active { width: 0 !important; } .percentage { font-weight: 700; background-color: var(--main-eight-600); border-radius: 5px; box-shadow: 0 4px 5px rgba(0, 0, 0, 0.2); color: #fff; font-size: 12px; padding: 4px; position: absolute; bottom: 20px; inset-inline-start: 0; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 40px; text-align: center; -webkit-transition: 0.8s linear; transition: 0.8s linear; } .percentage::after { background-color: var(--main-eight-600); content: ""; position: absolute; bottom: -5px; left: 50%; -webkit-transform: translateX(-50%) rotate(45deg); transform: translateX(-50%) rotate(45deg); height: 10px; width: 10px; z-index: -1; } .progress.active, .percentage.active { inset-inline-start: 0 !important; } body.tw-magic-cursor #magic-cursor { display: block; } #magic-cursor { position: absolute; display: none; width: 10px; height: 10px; pointer-events: none; z-index: 99999; opacity: 0; } #ball { position: fixed; display: flex; align-items: center; pointer-events: none; background-color: hsl(var(--white)) !important; border-radius: 50%; justify-content: center; mix-blend-mode: difference; color: transparent; } /* Ball view ============= */ #ball .ball-view { position: absolute; opacity: 0; visibility: hidden; padding: 0 5px; line-height: 1.1; text-align: center; transform: scale(0); font-weight: 400; font-size: 14px; text-transform: capitalize; color: hsl(var(--black)); } /* Ball drag ============= */ #ball .ball-drag { position: absolute; display: block; width: 100%; padding: 0 5px; font-size: 15px; font-weight: 600; color: #000; line-height: 1.2; text-align: center; transition: all 0.3s; } #ball .ball-drag::before, #ball .ball-drag::after { position: absolute; top: 50%; margin-top: -5px; font-size: 19px; color: var(--tw-common-white); height: 10px; line-height: 10px; font-family: "Font Awesome 6 Pro"; font-weight: var(--tw-fw-black); display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; } #ball .ball-drag::before { content: "\f104"; /* Font Awesome */ left: 0; transform: translate3d(-30px, 0, 0); transition: all 0.25s; } #ball .ball-drag::after { content: "\f105"; /* Font Awesome */ right: 0; transform: translate3d(30px, 0, 0); transition: all 0.25s; } #ball.with-blur { -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } /* Ball close ============== */ #ball.ball-close-enabled { opacity: 1 !important; } #ball .ball-close { position: absolute; padding: 0 5px; font-size: 14px; font-weight: var(--tw-fw-sbold); color: #000; line-height: 1; text-align: center; } .tw-magnetic-wrap { display: flex; justify-content: center; align-items: center; } .widget-pagination ul { display: flex; gap: 10px; align-items: center; } .widget-pagination ul li { cursor: pointer; transition: 0.4s; border-radius: 50% !important; } .widget-pagination ul li i { font-size: 18px; } .widget-pagination ul li a { width: 56px; height: 56px; line-height: 1; display: inline-flex; justify-content: center; align-items: center; border: 1px solid hsl(var(--white)); background: transparent; color: hsl(var(--white)); border-radius: 50% !important; } .widget-pagination ul li a:hover { background: var(--main-eight-600); color: hsl(var(--heading-color)); border: 1px solid var(--main-eight-600); } .body-overlay { position: fixed; top: 0; left: 0; z-index: 9999; width: 100%; height: 100%; background: rgb(24, 24, 24); visibility: hidden; opacity: 0; transition: 0.45s ease-in-out; } .body-overlay.apply { opacity: 0.7; visibility: visible; } .body-overlay:hover { cursor: url(../images/shapes/cross-out.png), pointer; } .twoffcanvas { right: -100%; width: 420px; box-shadow: rgba(0, 0, 0, 0.4) 0px 8px 24px; z-index: 999999; scrollbar-width: none; opacity: 0; visibility: hidden; transition: 0.45s ease-in-out; overflow-y: scroll; } .twoffcanvas.opened { opacity: 1; visibility: visible; } .twoffcanvas.opened { right: 0; -webkit-transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86); -moz-transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86); transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86); transition-duration: 0.6s; } .twoffcanvas__title p { color: rgba(255, 255, 255, 0.8); } .twoffcanvas__input { margin-bottom: 100px; } .twoffcanvas__input input { background: transparent; border: transparent; height: 60px; width: 100%; padding-left: 20px; padding-right: 80px; color: hsl(var(--white)); border: 1px solid #EAEAEF; } .twoffcanvas__input input:focus { border: 1px solid var(--main-eight-600); } .twoffcanvas__input input::placeholder { color: hsl(var(--white)); } .twoffcanvas__input button { height: 100%; width: 60px; background-color: var(--main-eight-600); color: hsl(var(--heading-color)); position: absolute; top: 50%; right: 0; transform: translateY(-50%); border: 1px solid var(--main-eight-600); font-size: 28px; } .twoffcanvas__contact-info ul li a { background-image: linear-gradient(to right, currentColor 0, currentColor 100%); background-position: 0 100%; background-repeat: no-repeat; background-size: 0 1px; transition: all 0.3s, background-size 0.8s; } .twoffcanvas__contact-info ul li a:hover { background-size: 100% 1px; } .twoffcanvas__logo { max-width: 180px; width: 100%; } .twoffcanvas__close-btn button { position: absolute; right: 40px; top: 50px; transition: 1s; -webkit-transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86); -moz-transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86); transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86); transition-duration: 0.3s; height: 40px; width: 40px; line-height: 45px; background-color: var(--main-eight-600); color: hsl(var(--heading-color)); } .twoffcanvas__close-btn button:hover i { transform: rotate(360deg); } .twoffcanvas__close-btn button i { transition: 0.9s; } /* ================================== rtl css start ================================== */ .text-start { text-align: start !important; } .form-check { padding-left: 0; } .form-check { padding-inline-start: 1.5em; } .form-check .form-check-input { margin-left: 0; } [dir=rtl] .tw-translate-x-50 { transform: translateX(50%); } [dir=rtl] .select-domain { margin-inline-end: 0; } [dir=rtl] .pricing-plan .form-check { padding-left: 0 !important; } [dir=rtl] .common-check-two .form-check-input::before { transform: translate(50%, -50%); } [dir=rtl] .distraction-icon.seven { transform: translate(50%, -50%); } [dir=rtl] .translate-middle-x { transform: translateX(50%) !important; } [dir=rtl] .translate-x-100-16 { transform: translateX(calc(100% - 105px)); } [dir=rtl] .toast-message { transform: translateX(-110%); } [dir=rtl] .toast-message.active { transform: translateX(0) !important; } [dir=rtl] .arrow-long { transform: scaleX(-1); } [dir=rtl] .common-check .form-check-input::before { transform: translate(50%, -50%); } [dir=rtl] .form-check .form-check-input { margin-right: -1.5em; } [dir=rtl] .top-features-slider { direction: rtl; } [dir=rtl] .left-right-gradient::before { background: linear-gradient(-90deg, #fff, transparent); } [dir=rtl] .left-right-gradient::after { background: linear-gradient(-90deg, transparent, #ffffff); } [dir=rtl] .tw--translate-x-full { transform: translateX(100%); } [dir=rtl] .image-animation:after { transform: translate(50%, -50%) rotate(-45deg); } [dir=rtl] .ph-bold.ph-caret-right:before { content: "\e138"; } [dir=rtl] .ph-bold.ph-arrow-up-right:before { content: "\e090"; } [dir=rtl] .ph.ph-caret-right:before { content: "\e138"; } [dir=rtl] .ph.ph-caret-left:before { content: "\e13a"; } [dir=rtl] .ph.ph-arrow-right:before { content: "\e058"; } [dir=rtl] .ph-bold.ph-caret-left:before { content: "\e13a"; } [dir=rtl] .ph-bold.ph-caret-left:before { content: "\e13a"; } /* ================================== rtl css End ================================== */ .faq-two-area { background: rgba(1, 100, 225, 0.06); } @media screen and (max-width: 1199px) { .faq-two-thumb { margin-block-end: 30px; } } @media screen and (max-width: 1199px) { .faq-two-left { margin-block-end: 50px; } } @media screen and (max-width: 1199px) { .faq-two-wrapper { margin-inline-start: 0; } } .faq-two-accordion-item { background: hsl(var(--white)); padding-inline: 0 0; margin-bottom: 18px; border-radius: 30px !important; padding-block: 2px; border: none !important; } .faq-two-accordion-button { font-size: 20px; font-weight: 500; font-family: var(--body-font); background: transparent !important; padding-left: 0; padding-right: 0; border-radius: 30px 30px 0 0 !important; padding-inline: 30px 23px; border-bottom: 1px solid transparent !important; padding-block: 16px; } .faq-two-accordion-button::after { width: 30px; height: 30px; margin-left: auto; content: "+"; transition: var(--bs-accordion-btn-icon-transition); font-size: 20px; background-image: none; font-weight: 400; transition: 0.4s; position: absolute; right: 10px; top: 14px; display: inline-flex !important; justify-content: center; align-items: center; background: hsl(var(--white)); border: 1px solid rgba(4, 27, 52, 0.1); border-radius: 50%; } .faq-two-accordion-button:not(.collapsed) { color: var(--main-eight-600); background: transparent !important; box-shadow: none !important; margin-block-start: -2px; border-bottom: 1px solid rgba(102, 102, 102, 0.15) !important; } .faq-two-accordion-button:not(.collapsed)::after { background-image: none; content: "-"; background: var(--main-eight-600); transform: none; transition: 0.4s; color: hsl(var(--white)); } .faq-two-accordion-button:focus { box-shadow: none !important; border: none; } .faq-two-accordion-body { padding-inline: 30px 23px; padding-block: 26px 30px; } .faq-two-accordion-body p { font-size: 14px; color: #666; } .faq-ip-area .accordion-item { box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.1); } .faq-ip-area .faq-two-left-contact { box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.1); } .section-subtitle { margin-inline-start: -14px; } .section-subtitle span { transform: translate(10px, -3px); } @media screen and (max-width: 1399px) { .section-title { font-size: 2.5rem; } } @media screen and (max-width: 575px) { .section-title { font-size: 2.3rem; } } .section-three-subtitle { border: 1px solid rgba(4, 27, 52, 0.1); padding: 4px 20px 4px 40px; border-radius: 40px; } .section-three-subtitle::before { content: ""; position: absolute; width: 11px; height: 11px; inset-block-start: 50%; inset-inline-start: 20px; transform: translateY(-50%); background: var(--main-eight-600); border-radius: 50%; } @media screen and (max-width: 767px) { .section-three-title { font-size: 3rem; } } @media screen and (max-width: 575px) { .section-three-title { font-size: 2.7rem; } } @media screen and (max-width: 1199px) { .section-four-title { font-size: 3rem; } } @media screen and (max-width: 1399px) { .section-five-title { font-size: 2.5rem; } } @media screen and (max-width: 1199px) { .section-five-title { font-size: 2.1rem; } } .section-six-subtitle { border: 1px solid rgba(4, 27, 52, 0.1); padding: 6px 20px 6px 40px; } .section-six-subtitle::before { content: ""; position: absolute; width: 11px; height: 11px; inset-block-start: 50%; inset-inline-start: 20px; transform: translateY(-50%); background: var(--main-six-600); border-radius: 50%; } .section-six-subtitle.before-white::before { background: hsl(var(--white)); } .section-seven-subtitle::before { background: var(--main-four-600); } @media screen and (max-width: 1399px) { .section-seven-title { font-size: 2.8rem; } } @media screen and (max-width: 1199px) { .section-seven-title { font-size: 2.5rem; } } @media screen and (max-width: 575px) { .section-eight-wrapper { margin-inline-end: 0; } } .section-eight-title { font-size: 55px; line-height: 118%; letter-spacing: -0.03em; } @media screen and (max-width: 575px) { .section-eight-title { font-size: 40px; } } .text-invert > div { background-size: 200% 100%; background-position-x: 100%; color: transparent; background-clip: text; -webkit-background-clip: text; background-image: linear-gradient(to right, rgb(3, 37, 50) 50%, rgba(4, 27, 52, 0.25) 50%); } .breadcrumb-area { padding-block: 20px 20px; margin-inline: 40px; border-radius: 20px; } .breadcrumb-thumb { height: 100%; /* or any height you want */ } .breadcrumb-thumb img { height: 80%; width: 100%; object-fit: cover; /* keeps it looking nice */ } @media screen and (max-width: 767px) { .breadcrumb-area { margin-inline: 20px; } } @media screen and (max-width: 575px) { .breadcrumb-area { margin-inline: 10px; } } .breadcrumb-area::before { content: ""; position: absolute; width: 100%; height: 100%; inset-block-start: 0; inset-inline-start: 0; background: linear-gradient(180deg, #ebf7f6 0%, #ebf7f6 100%); z-index: -1; border-radius: 20px; } @media screen and (max-width: 575px) { .breadcrumb-title { font-size: 4rem; } } @media screen and (max-width: 575px) { .breadcrumb-title { font-size: 4rem; } } @media screen and (max-width: 1199px) { .banner-wrapper { flex-wrap: wrap; row-gap: 30px; justify-content: center !important; } } .banner-left { max-width: 1075px; width: 100%; } @media screen and (max-width: 1799px) { .banner-left { max-width: 1020px; } } @media screen and (max-width: 1699px) { .banner-left { max-width: 930px; } } @media screen and (max-width: 1499px) { .banner-left { max-width: 730px; } } @media screen and (max-width: 1399px) { .banner-left { max-width: 600px; } } @media screen and (max-width: 1199px) { .banner-left { max-width: 100%; } } @media screen and (max-width: 575px) { .banner-left { max-width: 100%; padding-block-start: var(--size-10); } } @media screen and (max-width: 1499px) { .banner-gaping { padding-inline: var(--size-13); } } @media screen and (max-width: 575px) { .banner-gaping { padding-inline: 10px; } } .banner-title { line-height: 116%; letter-spacing: -0.02em; } @media screen and (max-width: 1499px) { .banner-title { font-size: 4.3rem; } } @media screen and (max-width: 1399px) { .banner-title { font-size: 3rem; } } @media screen and (max-width: 1199px) { .banner-title { font-size: 4.8rem; } } @media screen and (max-width: 991px) { .banner-title { font-size: 3.2rem; } } @media screen and (max-width: 424px) { .banner-title { font-size: 3rem; } } .banner-circle { width: 161px; height: 161px; } .banner-circle-button { width: 125px; height: 125px; border: 1px solid rgba(93, 50, 34, 0.1); } .banner-rotate-content { animation: rotateImg 10s infinite linear; } @media screen and (max-width: 1199px) { .banner-thumb { text-align: end; } } @media screen and (max-width: 1399px) { .banner-thumb img { width: 550px; } } @media screen and (max-width: 1199px) { .banner-thumb img { width: 100%; } } @media screen and (max-width: 1199px) { .banner-counter-wrap { gap: var(--size-8); } } @media screen and (max-width: 1199px) { .banner-counter-title { font-size: 2.5rem; } } .banner-shape-hand { inset-block-end: 12%; animation: bounce-y 4s forwards infinite alternate; } @media screen and (max-width: 424px) { .banner-shape-hand { display: none; } } .banner-two-area { padding-block: 265px 300px; } @media screen and (max-width: 1199px) { .banner-two-area { padding-block: 140px 300px; } } .banner-two-area::before { content: ""; position: absolute; width: 800px; height: 800px; inset-block-start: 0; inset-inline-start: -129px; background: #fff7db; filter: blur(801px); border-radius: 100%; z-index: -1; } @media screen and (max-width: 1199px) { .banner-two-left { margin-block-end: 50px; } } .banner-two-subtitle span { margin-inline-end: -24px; transform: translateY(-5px); } .banner-two-title { line-height: 111%; } @media screen and (max-width: 1399px) { .banner-two-title { font-size: 4rem; } } @media screen and (max-width: 767px) { .banner-two-title { font-size: 3rem; } } @media screen and (max-width: 575px) { .banner-two-title { font-size: 2.8rem; } } @media screen and (max-width: 424px) { .banner-two-title { font-size: 2.6rem; } } .banner-two-thumb { inset-block-start: -10px; } @media screen and (max-width: 1499px) { .banner-two-thumb { inset-inline-end: -150px !important; } } @media screen and (max-width: 1399px) { .banner-two-thumb { inset-inline-end: -260px !important; inset-block-start: 60px; } } @media screen and (max-width: 1199px) { .banner-two-thumb { inset-inline-end: 0 !important; inset-block-start: 0; position: static !important; } } @media screen and (max-width: 1199px) { .banner-two-thumb img { width: 100%; } } .banner-two-shape-1 { inset-block-start: -150px; inset-inline-start: -187px; animation: rotateImg 35s infinite linear; } .banner-two-shape-2 { animation: bounce-y 3s forwards infinite alternate; } .banner-two-shape-3 { inset-block-start: 46%; animation: moving 8s linear infinite; inset-inline-start: 50%; } .banner-three-area { padding-block: 185px 180px; } @media screen and (max-width: 1199px) { .banner-three-area { padding-block: 100px 120px; } } .banner-three-area::before { content: ""; position: absolute; width: 100%; height: 100%; inset-block-start: 0; inset-inline-start: 0; background: linear-gradient(90deg, #041b34 0%, #041b34 21.54%, rgba(4, 27, 52, 0.93) 35.62%, rgba(4, 27, 52, 0.88) 46.26%, rgba(4, 27, 52, 0) 100%); z-index: -1; } @media screen and (max-width: 767px) { .banner-three-title { font-size: 3.3rem; } } .banner-three-wrapper { max-width: 870px; width: 100%; margin-inline-start: 196px; } @media screen and (max-width: 1699px) { .banner-three-wrapper { margin-inline-start: 100px; } } @media screen and (max-width: 1199px) { .banner-three-wrapper { margin-inline-start: 40px; } } @media screen and (max-width: 991px) { .banner-three-wrapper { margin-inline-start: 20px; } } .banner-three-social li a { background: rgba(255, 255, 255, 0.7); } .banner-three-social li span { transform: translateX(-12px); } @media screen and (max-width: 1199px) { .banner-three-right { display: none; } } .banner-four-area { background: #041b34; padding-block: 146px 130px; } @media screen and (max-width: 1399px) { .banner-four-area { padding-block: 100px 30px; } } .banner-four-area::before { content: ""; position: absolute; width: 500px; height: 500px; inset-block-start: 50%; inset-inline-start: 50%; background: #402d31; border-radius: 50%; inset-block-start: 50%; transform: translate(-50%, -50%); z-index: -1; filter: blur(577px); } .banner-four-contact { max-width: 554px; width: 100%; margin-inline-start: auto; } @media screen and (max-width: 1399px) { .banner-four-contact { padding-inline: var(--size-4); padding-block: var(--size-6); } } @media screen and (max-width: 1199px) { .banner-four-contact { padding-inline: var(--size-10); padding-block: var(--size-15); margin-inline-start: 0; margin-block-start: 40px; max-width: 100%; } } @media screen and (max-width: 575px) { .banner-four-contact { padding-inline: var(--size-6); } } @media screen and (max-width: 1499px) { .banner-four-title { font-size: 4.25rem; } } @media screen and (max-width: 1199px) { .banner-four-title { font-size: 6.25rem; } } @media screen and (max-width: 991px) { .banner-four-title { font-size: 5.25rem; } } @media screen and (max-width: 575px) { .banner-four-title { font-size: 3.25rem; } } .banner-five-area { padding-block: 190px 190px; } @media screen and (max-width: 1199px) { .banner-five-area { padding-block: 120px 190px; } } .banner-five-area::before { content: ""; position: absolute; width: 100%; height: 100%; inset-block-start: 0; inset-inline-start: 0; background: rgba(24, 24, 24, 0.8); z-index: -1; } @media screen and (max-width: 1399px) { .banner-five-title { font-size: 5rem; } } @media screen and (max-width: 1199px) { .banner-five-title { font-size: 3.7rem; } } @media screen and (max-width: 767px) { .banner-five-title { font-size: 3rem; } } .banner-five-title span { margin-inline-start: 230px; } @media screen and (max-width: 1199px) { .banner-five-title span { margin-inline-start: 0; } } .banner-five-bottom { margin-block-start: -40px; } @media screen and (max-width: 1199px) { .banner-five-bottom { margin-block-start: 0; } } @media screen and (max-width: 575px) { .banner-five-bottom { flex-wrap: wrap; } } @media screen and (max-width: 1199px) { .banner-five-bottom p { margin-inline-end: 0; } } .banner-five-wrap { display: inline-block; padding: 36px 10px 36px 40px; border-left: 9px solid hsl(var(--white)); } @media screen and (max-width: 1399px) { .banner-five-wrap { padding: 36px 10px 36px 19px; } } @media screen and (max-width: 1199px) { .banner-five-wrap { width: 360px; } } @media screen and (max-width: 991px) { .banner-five-wrap { width: 480px; } } @media screen and (max-width: 575px) { .banner-five-wrap { width: 240px; } } .banner-five-wrap::before { content: ""; position: absolute; width: 100%; height: 100%; inset-block-start: 0; inset-inline-start: 0; background: linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, 0) 100%); z-index: -1; opacity: 0.46; } .banner-six-content { padding-block: 185px 185px; padding-inline-start: 80px; padding-inline-end: 50px; } @media screen and (max-width: 1199px) { .banner-six-content { padding-block: 185px 80px; } } @media screen and (max-width: 991px) { .banner-six-content { padding-block: 120px 144px; padding-inline: 15px; } } @media screen and (max-width: 767px) { .banner-six-content { padding-block: 120px 78px; } } .banner-six-content::before { content: ""; position: absolute; width: 100%; height: 100%; inset-block-start: 0; inset-inline-start: 0; background: rgba(35, 31, 32, 0.7); z-index: -1; } @media screen and (max-width: 767px) { .banner-six-bottom { flex-wrap: wrap; } } @media screen and (max-width: 1499px) { .banner-six-title { font-size: 5.25rem; } } @media screen and (max-width: 1399px) { .banner-six-title { font-size: 4.85rem; } } @media screen and (max-width: 575px) { .banner-six-title { font-size: 3.5rem; } } @media screen and (max-width: 424px) { .banner-six-title { font-size: 3rem; } } .banner-six-subtitle { border: 1px solid rgba(255, 255, 255, 0.3); } .banner-six-paragraph { max-width: 670px; width: 100%; } @media screen and (max-width: 1199px) { .banner-six-thumb { position: absolute; inset-block-start: 0; inset-inline-start: 0; width: 100%; } } @media screen and (max-width: 1199px) { .banner-six-thumb img { width: 100%; } } .banner-seven-area { padding-block: 296px 196px; } @media screen and (max-width: 1199px) { .banner-seven-area { padding-block: 200px 120px; } } .banner-seven-area::before { content: ""; position: absolute; width: 100%; height: 100%; inset-block-start: 0; inset-inline-start: 0; background: linear-gradient(270deg, rgba(0, 11, 26, 0) 0%, rgba(0, 11, 26, 0.74) 50%, rgba(0, 11, 26, 0.79) 60%, rgba(0, 11, 26, 0.85) 70%, rgba(0, 11, 26, 0.91) 80%, rgba(0, 11, 26, 0.97) 90%, #000b1a 100%); z-index: -1; } .banner-seven-wrapper { max-width: 876px; width: 100%; } @media screen and (max-width: 991px) { .banner-seven-title { font-size: 4rem; } } @media screen and (max-width: 767px) { .banner-seven-title { font-size: 3rem; } } @media screen and (max-width: 575px) { .banner-seven-title { font-size: 2.5rem; } } @media screen and (max-width: 424px) { .banner-seven-title { font-size: 2rem; } } .banner-seven-subtitle::before { background: var(--main-four-600); } .banner-eight-area { padding: 150px 80px 118px; } @media screen and (max-width: 1499px) { .banner-eight-area { padding: 150px 0 118px; } } /*.banner-eight-area::before { content: ""; position: absolute; width: 100%; height: 100%; inset-block-start: 0; inset-inline-start: 0; background: linear-gradient(180deg, #afdcfd 0%, rgba(175, 220, 253, 0) 100%); z-index: -1; }*/ .banner-eight-area::before { content: ""; position: relative; inset: 0; background: url('/assets/images/banner-selfie-liquid-tiles.jpg') no-repeat center center; background-size: auto; background-position: center; background-repeat: no-repeat; z-index: -1; } @media screen and (max-width: 991px) { .banner-eight-wrapper { flex-wrap: wrap; } } .banner-eight-title { font-size: clamp(50px, 12vw, 244px); line-height: 1.1; color: white; letter-spacing: -0.05em; z-index: 1; white-space: nowrap; text-shadow: 2px 2px 8px rgb(139, 25, 215); padding-bottom: 50px; } @media screen and (max-width: 1919px) { .banner-eight-title { font-size: 230px; } } @media screen and (max-width: 1799px) { .banner-eight-title { font-size: 200px; } } @media screen and (max-width: 1499px) { .banner-eight-title { font-size: 170px; } } @media screen and (max-width: 1399px) { .banner-eight-title { font-size: 150px; } } @media screen and (max-width: 1199px) { .banner-eight-title { font-size: 130px; } } @media screen and (max-width: 991px) { .banner-eight-title { font-size: 107px; padding-block-end: 60px; } } @media screen and (max-width: 767px) { .banner-eight-title { font-size: 78px; } } @media screen and (max-width: 575px) { .banner-eight-title { font-size: 58px; } } @media screen and (max-width: 424px) { .banner-eight-title { font-size: 50px; } } @media screen and (max-width: 1499px) { .banner-eight-bottom-title { font-size: 4rem; } } @media screen and (max-width: 1199px) { .banner-eight-bottom-title { font-size: 3.5rem; } } @media screen and (max-width: 575px) { .banner-eight-bottom-title { font-size: 2.8rem; } } @media screen and (max-width: 424px) { .banner-eight-bottom-title { font-size: 2.5rem; } } .banner-eight-wrap { max-width: 440px; width: 440px; background-size: contain !important; height: inherit; } @media screen and (max-width: 575px) { .banner-eight-wrap { max-width: 390px; } } @media screen and (max-width: 424px) { .banner-eight-wrap { max-width: 350px; } } @media screen and (max-width: 1499px) { .banner-eight-man-thumb { width: 850px; } } @media screen and (max-width: 991px) { .banner-eight-man-thumb { display: none; } } .banner-nine-height { height: 850px; display: flex; align-items: center; justify-content: center; } @media screen and (max-width: 767px) { .banner-nine-height { height: 640px; } } .banner-nine-bg { position: absolute; top: 0; left: 0; height: 100%; width: 100%; background-repeat: no-repeat; background-size: cover; background-position: center center; -webkit-transform: scale(1); transform: scale(1); -webkit-transition: opacity 1500ms ease-in, -webkit-transform 7000ms ease; transition: opacity 1500ms ease-in, -webkit-transform 7000ms ease; transition: transform 9000ms ease, opacity 1500ms ease-in; transition: transform 9000ms ease, opacity 1500ms ease-in, -webkit-transform 9000ms ease; } .banner-nine-bg::before { content: ""; position: absolute; width: 100%; height: 100%; inset-inline-start: 0; inset-block-start: 0; background: linear-gradient(60deg, rgba(1, 11, 37, 0.63) 0%, rgba(1, 11, 37, 0) 100%); z-index: -1; } .banner-nine-content { position: relative; z-index: 2; } .banner-nine-title { line-height: 90%; letter-spacing: -0.02em; } @media screen and (max-width: 1399px) { .banner-nine-title { font-size: 8.25rem; } } @media screen and (max-width: 767px) { .banner-nine-title { font-size: 5.25rem; } } @media screen and (max-width: 575px) { .banner-nine-title { font-size: 4rem; } } .banner-nine-bubble-1 { transform: translateX(-282px); } .banner-nine-bubble-2 { transform: translate(-50%, 280px); inset-inline-start: 50%; } .banner-nine-arrow-box { position: absolute; inset-inline-end: 60px; inset-block-start: 50%; transform: translateY(-50%); z-index: 3; display: flex; flex-direction: column; gap: 10px; } @media screen and (max-width: 575px) { .banner-nine-arrow-box { inset-inline-end: 20px; inset-block-start: 40%; } } .banner-nine-arrow-box button { width: 60px; height: 60px; line-height: 1; display: inline-flex; justify-content: center; align-items: center; font-size: 24px; border-radius: 50%; transition: all 0.3s ease 0s; color: hsl(var(--heading-color)); background-color: hsl(var(--white)); } .banner-nine-arrow-box button:hover { background: var(--main-eight-600); color: hsl(var(--white)); } .banner-nine-dots { position: absolute; inset-block-end: 53px; inset-inline-end: 364px; z-index: 2; } @media screen and (max-width: 1199px) { .banner-nine-dots { inset-inline-end: auto; inset-inline-start: 50%; transform: translateX(-50%); } } .banner-nine-dots .swiper-pagination-bullet { width: 14px; height: 14px; display: inline-block; border-radius: 50%; opacity: 1; margin: 0px 6px; transition: 0.3s; border: 2px solid transparent; } .banner-nine-dots .swiper-pagination-bullet-active { background-color: hsl(var(--white)); } .banner-nine-dots.dots-color .swiper-pagination-bullet { background-color: hsl(var(--white)); } .banner-nine-dots.dots-color .swiper-pagination-bullet-active { background-color: transparent; border-color: hsl(var(--white)); transform: scale(1.4); border: 2px solid var(--main-eight-600); } .banner-nine-title-box { opacity: 0; z-index: 3; position: relative; transform: translateY(-150px); } .banner-nine-btn-box { transform: translateY(150px); opacity: 0; } @media screen and (max-width: 575px) { .banner-nine-btn-box { flex-wrap: wrap; justify-content: start !important; } } .banner-nine-wrapper .swiper-slide.swiper-slide-active .banner-nine-bg { -webkit-transform: scale(1.35); transform: scale(1.35); } .banner-nine-wrapper .swiper-slide.swiper-slide-active .banner-nine-title-box { opacity: 1; transform: translatey(0px); transition: all 2500ms ease; } .banner-nine-wrapper .swiper-slide.swiper-slide-active .banner-nine-btn-box { opacity: 1; transform: translatey(0px); transition: all 2500ms ease; } .banner-nine-wrapper .swiper-slide.swiper-slide-active .banner-nine-bubble-1 { transform: translateX(0); transition: all 2500ms ease; } .banner-nine-wrapper .swiper-slide.swiper-slide-active .banner-nine-bubble-2 { transform: translate(-50%, 0); transition: all 2500ms ease; } .banner-ten-area { background: linear-gradient(124deg, #0b163f 0%, #0d1c5d 45.43%, #301996 100%); padding-block: 127px; } @media screen and (max-width: 1399px) { .banner-ten-left { margin-inline-end: -50px; } } @media screen and (max-width: 1199px) { .banner-ten-left { margin-inline-end: 0; margin-block-end: 60px; } } @media screen and (max-width: 1199px) { .banner-ten-title { font-size: 5.875rem; } } @media screen and (max-width: 767px) { .banner-ten-title { font-size: 4.5rem; } } @media screen and (max-width: 575px) { .banner-ten-title { font-size: 3.4rem; } } @media screen and (max-width: 424px) { .banner-ten-title { font-size: 2.9rem; } } .banner-ten-thumb { max-width: 690px; width: 100%; margin-inline-start: auto; } @media screen and (max-width: 1399px) { .banner-ten-thumb { max-width: 580px; } } @media screen and (max-width: 1199px) { .banner-ten-thumb { margin-inline-start: 0; max-width: 100%; } } .banner-ten-circle { background: rgba(255, 255, 255, 0.31); } .banner-ten-rotate-content { filter: brightness(0) invert(1); } .banner-ten-paragraph { margin-inline-end: -20px; } @media screen and (max-width: 1199px) { .banner-ten-paragraph { max-width: 85%; } } .banner-eleven-area { padding-block: 200px; } @media screen and (max-width: 991px) { .banner-eleven-area { padding-block: 120px; } } .banner-eleven-area::before { content: ""; position: absolute; width: 100%; height: 100%; inset-block-start: 0; inset-inline-start: 0; background: linear-gradient(75deg, rgba(1, 11, 37, 0.63) 0%, rgba(1, 11, 37, 0) 100%); z-index: -1; } @media screen and (max-width: 1399px) { .banner-eleven-title { font-size: 4rem; } } @media screen and (max-width: 767px) { .banner-eleven-title { font-size: 3rem; } } @media screen and (max-width: 1199px) { .about-area { padding-block-end: 50px; } } @media screen and (max-width: 1199px) { .about-thumb { margin-bottom: 120px; } } .about-thumb-shape { inset-block-end: -9%; inset-inline-end: 0; } @media screen and (max-width: 1199px) { .about-wrapper { padding-inline-start: 0; margin-block-end: 60px; } } .about-circle { inset-block-start: 80px; position: absolute !important; inset-inline-end: 0; } .about-circle-button { border: 1px solid rgba(0, 25, 76, 0.19); width: 90px; height: 90px; } @media screen and (max-width: 575px) { .about-items-wrap { flex-wrap: wrap; row-gap: 20px; } } .about-item { background: hsl(var(--white)); box-shadow: 11px 15px 80px 48px rgba(10, 6, 68, 0.03); } @media screen and (max-width: 1399px) { .about-item { padding-inline: var(--size-5); } } .about-icon img { width: 55px; height: 55px; } @media screen and (max-width: 1399px) { .about-list { margin-block-end: var(--size-3); } } @media screen and (max-width: 1399px) { .about-list ul li { width: 100% !important; float: inherit !important; margin-block-end: var(--size-4); } } .about-two-title { font-size: 55px; line-height: 118%; } @media screen and (max-width: 1399px) { .about-two-title { font-size: 45px; } } @media screen and (max-width: 1199px) { .about-two-title { font-size: 55px; } } @media screen and (max-width: 991px) { .about-two-title { font-size: 45px; } } @media screen and (max-width: 767px) { .about-two-title { font-size: 30px; } } @media screen and (max-width: 767px) { .about-two-thumb.one { margin-block-end: 30px; } } .about-two-thumb.two { margin-block-start: -60px; } @media screen and (max-width: 1199px) { .about-two-thumb.two { margin-block-start: 30px; } } .about-two-text-shape { background: hsl(var(--white)); box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.07); max-width: 278px; border-radius: 12px; padding: 42px 46px; position: absolute; inset-block-start: 14%; inset-inline-start: 22%; animation: moving 8s linear infinite; } @media screen and (max-width: 1799px) { .about-two-text-shape { inset-inline-start: 10%; } } @media screen and (max-width: 1199px) { .about-two-text-shape { display: none; } } @media screen and (max-width: 767px) { .about-three-counter-wrap { flex-wrap: wrap; row-gap: 30px; } } @media screen and (max-width: 1199px) { .about-four-title { font-size: 2.5rem; } } @media screen and (max-width: 767px) { .about-four-thumb img { width: 100%; } } .about-four-wrap { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 20px; } @media screen and (max-width: 1199px) { .about-four-wrap { grid-template-columns: 1fr 1fr; } } @media screen and (max-width: 991px) { .about-four-wrap { grid-template-columns: 1fr; } } .about-four-img img { border: 3px solid rgba(255, 255, 255, 0.6); border-radius: 50%; } .about-five-wrapper { margin-inline-start: -20px; } @media screen and (max-width: 991px) { .about-five-wrapper { margin-inline-start: 0; margin-block-end: 30px; } } .about-five-info { max-width: 500px; width: 100%; background: hsl(var(--white)); box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.1); padding: 34px 20px 30px 30px; } .about-five-counter-title { border-right: 1px solid rgba(4, 27, 52, 0.15); margin-inline-end: 37px; padding-inline-end: 30px; } .about-five-right { max-width: 456px; width: 100%; margin-inline-start: auto; } @media screen and (max-width: 991px) { .about-five-right { margin-inline-start: 0; } } .about-five-shape-1 { inset-inline-end: -172px; } @media screen and (max-width: 1399px) { .about-five-shape-1 { display: none; } } @media screen and (max-width: 1399px) { .about-five-shape-2 { display: none; } } .about-six-title span { margin-block-start: -11px; } .about-six-content { max-width: 407px; width: 100%; } .about-six-left { border-right: 1px solid #d9d9d9; padding-inline-end: 100px; margin-inline-end: 100px; } @media screen and (max-width: 767px) { .about-six-left { border-right: none; padding-inline-end: 0; margin-inline-end: 0; } } @media screen and (max-width: 767px) { .about-six-wrap { flex-wrap: wrap; } } .about-seven-area { background: #f4f4f9; } .about-seven-area .section-six-wrapper { margin-block-end: 204px; } @media screen and (max-width: 991px) { .about-seven-area .section-six-wrapper { margin-block-end: 50px; } } .about-seven-left-thumb { margin-inline-start: -218px; transform: translateX(40px); } @media screen and (max-width: 1699px) { .about-seven-left-thumb { margin-inline-start: -160px; } } @media screen and (max-width: 1499px) { .about-seven-left-thumb { transform: translateX(140px); } } @media screen and (max-width: 991px) { .about-seven-left-thumb { transform: translateX(0); margin-inline-start: 0; margin-block-end: 40px; } } @media screen and (max-width: 991px) { .about-seven-left-thumb img { width: 100%; } } .about-seven-right-thumb { margin-inline-end: -105px; } @media screen and (max-width: 1499px) { .about-seven-right-thumb { margin-inline-end: -15px; } } @media screen and (max-width: 1199px) { .about-seven-right-thumb { position: absolute; right: 40px; bottom: 80px; z-index: -1; } } @media screen and (max-width: 1199px) { .about-seven-right-thumb { position: static; margin-inline-end: 0; } } @media screen and (max-width: 1199px) { .about-seven-right-thumb img { height: 400px; } } @media screen and (max-width: 991px) { .about-seven-right-thumb img { width: 100%; height: inherit; } } .about-seven-maquee { inset-inline-start: 0; inset-block-end: 19%; } .about-seven-maquee-title { color: rgba(0, 11, 26, 0.1) !important; } @media screen and (max-width: 1399px) { .about-seven-wrap { margin-inline-start: var(--size-34); } } @media screen and (max-width: 767px) { .about-seven-wrap { margin-inline-start: 0; width: 100%; } } @media screen and (max-width: 1199px) { .about-eight-thumb { margin-block-end: 40px; } } .about-eight-thumb-count { padding: 30px; } .about-eight-thumb-review { padding: 28px 38px; } .about-eight-tab .nav-link { background: #f0f0fc; color: hsl(var(--heading-color)); font-weight: 500; padding: 7px 28px; border-bottom: 1px solid #0164e1; border-radius: 6px; position: relative; z-index: 1; } .about-eight-tab .nav-link::before { content: ""; position: absolute; width: 0px; height: 0px; border-style: solid; border-width: 11px 11px 0 11px; border-color: #0165df transparent transparent transparent; transform: translateX(-50%) rotate(0deg); inset-inline-start: 50%; inset-block-end: -11px; opacity: 0; visibility: hidden; transition: 0.4s ease-in-out; } .about-eight-tab .nav-link:hover { background: var(--main-eight-600); color: hsl(var(--white)); border-color: var(--main-eight-600); } .about-eight-tab .nav-link:hover::before { opacity: 1; visibility: visible; } .about-eight-tab .nav-link.active { background: var(--main-eight-600); color: hsl(var(--white)); border-color: var(--main-eight-600); } .about-eight-tab .nav-link.active::before { opacity: 1; visibility: visible; } .about-eight-tab .tab-pane { line-height: 188%; margin-inline-end: 50px; animation: fadeInUp 0.6s ease-in-out 0s; } @media screen and (max-width: 1199px) { .about-nine-wrapper { margin-inline-start: 0; } } @media screen and (max-width: 991px) { .about-nine-wrapper { margin-block-end: 40px; } } .about-nine-thumb { margin-inline-start: -48px; } @media screen and (max-width: 1499px) { .about-nine-thumb { margin-inline-start: 0; } } @media screen and (max-width: 991px) { .about-nine-thumb { margin-block-end: 40px; } } @media screen and (max-width: 991px) { .about-nine-thumb img { width: 100%; } } .about-nine-border-btn .btn_inner::before { background-color: var(--main-eight-600); } .about-nine-border-btn:hover .btn_inner .btn_text { color: hsl(var(--white)) !important; } @media screen and (max-width: 1399px) { .about-nine-list ul { gap: 0; } } .about-nine-bottom { margin-inline-start: -48px; } @media screen and (max-width: 1499px) { .about-nine-bottom { margin-inline-start: 0; } } @media screen and (max-width: 575px) { .about-nine-button-wrap { flex-wrap: wrap; justify-content: start !important; } } .about-ten-wrapper { margin-inline-start: 80px; } @media screen and (max-width: 1399px) { .about-ten-wrapper { margin-inline-start: 0; } } @media screen and (max-width: 1199px) { .about-ten-thumb { margin-block-end: 40px; } } .about-ten-shape { inset-block-start: -174px; inset-inline-start: -64px; } @media screen and (max-width: 1199px) { .about-ten-progress-wrap { flex-wrap: wrap; gap: var(--size-7); } } .about-ten-progress-container { width: 310px; } @media screen and (max-width: 1199px) { .about-ten-progress-container { width: 100%; } } @media screen and (max-width: 1199px) { .about-ten-counter { margin-block-end: 30px; } } .about-eleven-content { padding: 34px 40px; } @media screen and (max-width: 1399px) { .about-eleven-wrap { flex-wrap: wrap; } } @media screen and (max-width: 1199px) { .about-eleven-thumb { margin-block-end: 30px; } } @media screen and (max-width: 1199px) { .about-eleven-thumb img { width: 100%; } } .service-area::before { content: ""; position: absolute; width: 1720px; height: 100%; inset-block-start: 0; inset-inline-start: 50%; background: #040542; z-index: -1; border-radius: 32px; transform: translateX(-50%); } @media screen and (max-width: 1199px) { .service-paragraph { margin-block-end: 40px; } } .service-wrapper { background: rgba(255, 255, 255, 0.06); } .service-wrap { background: linear-gradient(180deg, rgba(255, 255, 255, 0.1) 0%, rgba(248, 247, 240, 0) 100%); } .service-list ul li::before { content: ""; position: absolute; width: 5px; height: 5px; inset-block-start: 8px; inset-inline-start: 0; background: rgba(255, 255, 255, 0.1); border-radius: 50%; } .service-thumb-wrap { max-width: 350px; } .service-icon span img { filter: brightness(0) invert(1); } .service-two-area { background: rgba(1, 100, 225, 0.06); } .service-two-nav-tabs { --bs-nav-tabs-border-width: none; } @media screen and (max-width: 1199px) { .service-two-nav-tabs { gap: 30px; } } @media screen and (max-width: 1199px) { .service-two-nav-item { width: 48% !important; } } @media screen and (max-width: 991px) { .service-two-nav-item { width: 47% !important; margin-block-end: 0; } } @media screen and (max-width: 767px) { .service-two-nav-item { width: 100% !important; } } .service-two-nav-link { padding: 30px 20px; border: none !important; } .service-two-nav-link.active { background-color: var(--main-eight-600) !important; border-top-left-radius: 0.75rem; border-top-right-radius: 0.75rem; margin-block-end: 0; } .service-two-nav-link.active .service-two-left-icon span { background: hsl(var(--white)) !important; } .service-two-nav-link.active .service-two-left-title { color: hsl(var(--white)); } .service-two-nav-link.active .service-two-left-paragraph { color: hsl(var(--white)) !important; } .service-two-thumbs::before { content: ""; position: absolute; width: 100%; height: 100%; inset-block-end: 0; inset-inline-start: 0; background: linear-gradient(180deg, rgba(4, 27, 52, 0) 29.33%, #041b34 72.08%, #041b34 100%); border-radius: 10px; z-index: 1; } @media screen and (max-width: 575px) { .service-two-thumbs img { height: 380px; object-fit: cover; } } @media screen and (max-width: 1199px) { .service-two-wrapper { margin-inline-start: 0; margin-block-start: 50px; } } @media screen and (max-width: 991px) { .service-two-left-title { font-size: 1rem; } } .service-two-content { inset-block-end: 50px; inset-inline-start: 30px; max-width: 700px; z-index: 2; } .service-two-hand { inset-block-start: 30px; animation: bounce-y 4s forwards infinite alternate; } .service-three-area { background: rgba(1, 100, 225, 0.06); } .service-three-wrapper { border: 1px solid rgba(4, 27, 52, 0.1); } .service-three-wrapper::before { content: ""; position: absolute; width: 100%; height: 100%; inset-block-start: 0; inset-inline-start: 0; background: var(--main-eight-600); opacity: 0; visibility: hidden; transition: all 0.5s ease-in-out; z-index: -1; } .service-three-wrapper:hover { border-color: var(--main-eight-600); } .service-three-wrapper:hover::before { opacity: 1; visibility: visible; } .service-three-wrapper:hover .service-three-icon span { background: hsl(var(--white)); } .service-three-wrapper:hover .service-three-icon span img { filter: inherit; } .service-three-wrapper:hover .service-three-number span { color: hsl(var(--white)); } .service-three-wrapper:hover .service-three-title a { color: hsl(var(--white)); } .service-three-wrapper:hover .service-three-paragraph { color: hsl(var(--white)); } .service-three-wrapper:hover .service-three-button { border-color: hsl(var(--white)); } .service-three-wrapper:hover .service-three-btn { color: hsl(var(--white)); } .service-three-icon span { background: rgba(4, 27, 52, 0.04); transition: 0.3s; } .service-three-icon span img { filter: brightness(0) invert(0); transition: 0.3s; } .service-three-number span { -webkit-text-fill-color: transparent; -webkit-text-stroke: 1px #DBE1E8; } .service-three-button { border-top: 1px solid rgba(4, 27, 52, 0.1); padding-block-start: 20px; transition: 0.4s; } @media screen and (max-width: 991px) { .service-four-area .section-four-wrapper { margin-block-end: 30px; } } .service-four-bg::before { content: ""; position: absolute; width: 100%; height: 100%; inset-block-start: 0; inset-inline-start: 0; background: rgba(4, 27, 52, 0.92); z-index: -1; } .service-four-active { padding-block-end: 40px; } .service-four-wrapper { background: #f7f3f3; } .service-four-wrapper:hover .service-four-content { background: var(--main-four-600); } .service-four-wrapper:hover .service-four-icon span { background: hsl(var(--white)) !important; } .service-four-wrapper:hover .service-four-icon span img { filter: inherit; } .service-four-wrapper:hover .service-four-title { color: hsl(var(--white)); } .service-four-wrapper:hover .service-four-paragraph { color: hsl(var(--white)); } .service-four-wrapper:hover .tw-primary-btn { background: hsl(var(--heading-color)) !important; } .service-four-content { padding: 0 70px 47px 30px; } .service-four-icon { margin-block-start: -50px; } .service-four-icon span img { filter: brightness(0) invert(1); transition: 0.4s; } .service-four-arrow button { width: 46px; height: 46px; line-height: 1; display: inline-flex; justify-content: center; align-items: center; border-radius: 50%; background: hsl(var(--white)); margin-inline: 8px; } .service-four-arrow button:hover { background: var(--main-four-600) !important; color: hsl(var(--heading-color)); } .service-four-arrow button:last-child { margin-inline: 0; } .service-five-wrapper::before { content: ""; position: absolute; width: 100%; height: 100%; inset-block-start: 0; inset-inline-start: 0; background: var(--main-four-600) !important; transition: 0.6s ease-in-out; opacity: 0; visibility: hidden; z-index: -1; } .service-five-wrapper:hover::before { opacity: 1; visibility: visible; } .service-five-wrapper:hover .service-five-title { color: hsl(var(--white)); } .service-five-wrapper:hover .service-five-paragraph { color: hsl(var(--white)); } .service-five-wrapper:hover .service-five-text-stroke { -webkit-text-stroke: 1px rgb(255, 255, 255); } .service-five-wrapper:hover .service-five-btn { color: hsl(var(--white)); } .service-five-text-stroke { -webkit-text-fill-color: transparent; -webkit-text-stroke: 1px rgba(4, 27, 52, 0.1); } .service-six-list-thumb-wrap { width: 485px; height: 567px; margin-left: 0; transform: scale(1); } @media screen and (max-width: 1399px) { .service-six-list-thumb-wrap { width: 400px; } } @media screen and (max-width: 1199px) { .service-six-list-thumb-wrap { width: 100%; } } @media screen and (max-width: 991px) { .service-six-list-thumb-wrap { margin-block-end: 30px; } } .service-six-list-thumb-1, .service-six-list-thumb-2, .service-six-list-thumb-3, .service-six-list-thumb-4 { top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; visibility: hidden; position: absolute; border-radius: 20px; transition: 0.3s ease-in; } @media screen and (max-width: 1199px) { .service-six-list-wrap { margin-block-end: 60px; } } .service-six-list-item { padding: 0 0 28px; border-bottom: 1px solid rgba(0, 0, 0, 0.08); } @media screen and (max-width: 1399px) { .service-six-list-item { flex-wrap: wrap; } } .service-six-list-item::before { content: ""; position: absolute; width: 0; height: 1px; inset-block-end: 0; inset-inline-start: 0; background: var(--main-six-600); transition: 0.5s ease-in-out; } .service-six-list-item:last-child { margin-bottom: 0; } .service-six-list-item.active::before { width: 100%; } .service-six-list-item.active .service-six-list-title a { color: var(--main-six-600); } .service-six-list-item.active .service-six-list-btn { background: var(--main-six-600); border: 1px solid var(--main-six-600); color: hsl(var(--white)); } .service-six-list-btn { border: 1px solid rgba(35, 31, 32, 0.1); } .service-six-list-btn i { transform: rotate(-45deg); transition: 0.4s; } .service-six-shape { inset-block-end: 300px; inset-inline-start: 96px; animation: bounce-y 3s forwards infinite alternate; } @media screen and (max-width: 1199px) { .service-six-shape { display: none; } } #service-six-thumb.service-six-list-thumb-1 .service-six-list-thumb-1 { opacity: 1; visibility: visible; } #service-six-thumb.service-six-list-thumb-2 .service-six-list-thumb-2 { opacity: 1; visibility: visible; } #service-six-thumb.service-six-list-thumb-3 .service-six-list-thumb-3 { opacity: 1; visibility: visible; } #service-six-thumb.service-six-list-thumb-4 .service-six-list-thumb-4 { opacity: 1; visibility: visible; } #service-six-thumb.service-six-list-thumb-5 .service-six-list-thumb-5 { opacity: 1; visibility: visible; } #service-six-thumb.service-six-list-thumb-6 .service-six-list-thumb-6 { opacity: 1; visibility: visible; } .service-eight-area { background: linear-gradient(180deg, #afdcfd 0%, rgba(175, 220, 253, 0) 100%); } @media screen and (max-width: 991px) { .service-eight-top-paragraph { margin-inline-start: 0; margin-block-end: 50px; } } .service-eight-wrapper:hover .service-eight-thumb img { transform: scale(1.2); } .service-eight-wrapper:hover .service-eight-icon span { background: var(--main-eight-600) !important; } .service-eight-wrapper:hover .service-eight-icon span img { filter: brightness(0) invert(1); } .service-eight-button .tw-primary-btn .btn_inner::before { background-color: var(--main-eight-600); } .service-eight-button .tw-primary-btn:hover .btn_inner .btn_text span { color: hsl(var(--white)); } @media screen and (max-width: 1499px) { .service-nine-area { border-radius: 0; margin-inline: 0; } } .service-nine-wrapper { border: 1px solid rgba(255, 255, 255, 0.26); background: #1a74e4; } @media screen and (max-width: 1499px) { .service-nine-wrapper { padding-inline: var(--size-4); } } @media screen and (max-width: 1199px) { .service-nine-wrapper { margin-block-start: 0; } } .service-nine-button .tw-primary-btn { background: rgba(255, 255, 255, 0.16); } .service-ten-area::before { content: ""; position: absolute; width: 100%; height: 804px; inset-block-start: 0; inset-inline-start: 0; background: linear-gradient(124deg, #0b163f 0%, #0d1c5d 45.43%, #301996 100%); clip-path: polygon(0 1%, 100% 0, 100% 76%, 93% 100%, 8% 100%, 0 77%); z-index: -1; } .service-ten-wrapper { box-shadow: 7px 9px 84px 64px rgba(7, 34, 67, 0.03); padding: 13px; } .service-ten-wrapper:hover .service-ten-thumb a img { transform: scale(1.2); } @media screen and (max-width: 1199px) { .service-ten-thumb > img { width: 100%; } } .service-ten-content { padding-inline: 17px; } @media screen and (max-width: 1399px) { .service-ten-content { padding-inline: 0; } } @media screen and (max-width: 1199px) { .service-ten-content { padding-inline: 26px; } } .service-ten-shape-1 { inset-block-end: 155px; z-index: -2; } .service-ten-shape-2 { inset-block-end: 155px; z-index: -2; } .service-eleven-area { background: #b0ddfe; } .service-eleven-area::before { content: ""; position: absolute; width: 100%; height: 696px; inset-block-start: 0; inset-inline-start: 0; background: linear-gradient(124deg, #0b163f 0%, #0d1c5d 45.43%, #301996 100%); z-index: -1; } @media screen and (max-width: 1919px) { .service-eleven-bottom { padding-inline: 0; } } .service-ip-area .service-two-nav-item { box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.1); } .service-details-wrapper { box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.1); border-radius: 10px; } @media screen and (max-width: 1199px) { .service-details-wrapper { margin-block-end: 30px; } } .service-details-list li { list-style: disc; } .service-details-item { box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.1); } .service-details-icon span::before { content: ""; position: absolute; width: 75px; height: 75px; inset-block-start: 50%; inset-inline-start: 50%; transform: translate(-50%, -50%); background: rgba(60, 162, 0, 0.1); z-index: -1; border-radius: 50%; } .service-details-sideber-item { box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.1); } .service-details-sideber-thumb::before { content: ""; position: absolute; width: 100%; height: 100%; inset-block-start: 0; inset-inline-start: 0; background: linear-gradient(180deg, rgba(1, 100, 225, 0) 0%, #0164E1 100%); border-radius: 10px; } .service-details-sideber-list li a { background: #f5f6f1; } .expert-thumb { margin-inline-start: -40px; } .expert-thumb img { max-width: inherit; } .expert-item { max-width: 363px; width: 100%; } @media screen and (max-width: 1199px) { .expert-right { margin-inline-start: 0; } } .expert-shape-1 { inset-block-start: 11%; inset-inline-start: 7%; animation: moving 8s linear infinite; } @media screen and (max-width: 1199px) { .expert-shape-1 { display: none; } } .expert-shape-2 { inset-block-start: 11%; inset-inline-end: 1%; animation: bounce-y 4s forwards infinite alternate; } @media screen and (max-width: 1199px) { .expert-shape-2 { display: none; } } .expert-eight-area { background: #00174f; margin-inline: 10px; border-radius: 20px 20px 0 0; } .expert-eight-paragraph { color: rgba(255, 255, 255, 0.8); } @media screen and (max-width: 1399px) { .expert-eight-thumb { margin-inline-start: 0; } } @media screen and (max-width: 575px) { .expert-eight-thumb { display: none; } } @media screen and (max-width: 1199px) { .expert-nine-left { margin-inline-end: 0; } } .expert-nine-progress-container .percentage::after { background-color: var(--main-eight-600); } .expert-nine-paragraph { border-bottom: 1px solid rgba(0, 0, 0, 0.09); padding-block-end: 28px; margin-block-end: 28px; } .expert-eleven-area { background: #b0ddfe; } @media screen and (max-width: 1199px) { .counter-wrapper { flex-wrap: wrap; row-gap: 40px; width: 80%; } } @media screen and (max-width: 767px) { .counter-wrapper { width: 100%; } } .counter-title { color: rgba(4, 27, 52, 0.1); } .counter-paragraph { margin-block-start: -90px; } .counter-two-heading::before { content: ""; position: absolute; width: 100%; height: 1px; inset-block-start: 50%; inset-inline-start: 0; transform: translateY(-50%); background: rgba(4, 27, 52, 0.1); } @media screen and (max-width: 575px) { .counter-two-wrapper { justify-content: center !important; } } .counter-six-paragraph::before { content: ""; position: absolute; width: 10px; height: 10px; inset-block-start: 12px; inset-inline-start: 0; transform: translateY(-50%); background: var(--main-six-600); border-radius: 50%; } .counter-seven-area { background: #000b1a; padding-block-end: 371px; } .counter-eight-area { padding: 0 0 90px; } @media screen and (max-width: 1199px) { .counter-eight-area { padding: 0 0 50px; } } .counter-eight-wrapper { margin-inline-end: 100px; } @media screen and (max-width: 1499px) { .counter-eight-wrapper { margin-inline-end: 0; justify-content: center !important; } } @media screen and (max-width: 1199px) { .counter-eight-wrapper { flex-wrap: wrap; } } .counter-eight-content { background: #fafcff; border-bottom: 3px solid #0164e1; border-radius: 0 0 17px 17px; width: 423px; padding: 60px 40px; } .counter-eight-item { background: #fafcff; border-bottom: 3px solid #0164e1; border-radius: 0 0 17px 17px; width: 274px; padding: 60px 30px; } @media screen and (max-width: 1199px) { .counter-eight-item { border-radius: 17px; } } @media screen and (max-width: 767px) { .counter-ten-content { margin-block-end: 40px; } } .video-bg { background-position: center; background-size: cover; margin: 0 auto; height: 850px; width: calc(100% - 30px); } .video-button { inset-block-start: 41%; } @media screen and (max-width: 1199px) { .video-button { inset-block-start: 22%; } } @media screen and (max-width: 991px) { .video-button { inset-block-start: 18%; } } @media screen and (max-width: 767px) { .video-button { inset-block-start: 14%; } } @media screen and (max-width: 767px) { .video-btn { width: 5.25rem; height: 5.25rem; } } .video-btn::before { position: absolute; content: ""; left: 50%; top: 50%; width: 70%; height: 70%; background-color: rgba(1, 101, 223, 0.471); animation: borderanimate2 2s linear infinite; z-index: -1; border-radius: 50%; } .video-btn::after { position: absolute; content: ""; left: 50%; top: 50%; width: 90%; height: 90%; transform: scale(1.5); border: 1px solid rgba(1, 101, 223, 0.471); animation: borderanimate2 2s linear infinite; border-radius: 50%; } .video-eight-area { padding-block: 300px; border-radius: 0 0 20px 20px; } .video-eight-button::before { background-color: rgba(1, 101, 223, 0.471); } .video-eight-button::after { border: 1px solid rgba(1, 101, 223, 0.471); } @media screen and (max-width: 1199px) { .video-nine-area { margin-block-end: -470px; } } .video-nine-button .video-btn::before { background-color: rgba(1, 101, 223, 0.471); } .video-nine-button .video-btn::after { border: 1px solid rgba(1, 101, 223, 0.471); } @media screen and (max-width: 1199px) { .video-ten-area { margin-block-end: -460px; } } @media screen and (max-width: 1199px) { .video-eleven-area { margin-block-end: -524px; } } .video-eleven-btn::before { background-color: rgba(1, 101, 223, 0.471); } .video-eleven-btn::after { border: 1px solid rgba(1, 101, 223, 0.471); } .hover__reveal-item { position: relative; } .hover__reveal-item:hover .hover__reveal-bg { opacity: 1; } .hover__reveal-bg { position: absolute; top: 0; left: 0; width: 444px; height: 275px; opacity: 0; margin: -150px 0 0 -150px; overflow: hidden; pointer-events: none; background-position: center; background-size: cover; background-repeat: no-repeat; transition: opacity 0.3s, transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1); z-index: 5; border-radius: 8px; } @media screen and (max-width: 991px) { .hover__reveal-bg { width: 360px; height: 240px; } } @media screen and (max-width: 767px) { .hover__reveal-bg { width: 300px; height: 200px; } } .project-area { padding: 100px 0 140px; } @media screen and (max-width: 1199px) { .project-area { padding: 0 0 140px; margin-block-start: -336px; } } .project-item { position: relative; border-bottom: 1px solid #d4d4d4; } .project-item .hover-reveal-bg { background-size: inherit; background-position: center; background-repeat: no-repeat; } .project-item:hover .project-title { -webkit-text-fill-color: transparent; -webkit-text-stroke: 1px var(--main-eight-600); } .project-item:hover .project-action span { background: var(--main-two-600) !important; color: hsl(var(--heading-color)) !important; } .project-content { padding: 56px 0; transition: 0.3s; } @media screen and (max-width: 767px) { .project-content { flex-wrap: wrap; row-gap: 30px; } } .project-left { max-width: 440px; width: 100%; } @media screen and (max-width: 991px) { .project-tag { font-size: 1.875rem; } } .project-right { max-width: 696px; width: 100%; } @media screen and (max-width: 1399px) { .project-right { max-width: 580px; width: 100%; gap: var(--size-10); } } @media screen and (max-width: 1199px) { .project-right { max-width: 420px; } } @media screen and (max-width: 767px) { .project-right { max-width: 100%; } } .project-bg-shape { inset-block-start: -120px; } .project-shape-1 { inset-block-start: -80px; animation: bounce-y 4s forwards infinite alternate; } @media screen and (max-width: 1199px) { .project-shape-1 { display: none; } } .project-three-area { background: rgba(1, 100, 225, 0.06); } @media screen and (max-width: 991px) { .project-three-top-right { margin-block-end: 50px; } } .project-three-tag span { border: 1px solid rgba(4, 27, 52, 0.1); border-radius: 17px; padding: 5px 30px; } .project-three-wrapper { border: 1px solid rgba(4, 27, 52, 0.1); } .project-four-wrapper:hover .project-four-wrap { opacity: 1; visibility: visible; transform: translateY(0); } .project-four-wrap { inset-inline-start: 30px; inset-block-end: 30px; transform: translateY(170px); opacity: 0; visibility: hidden; transition: all 0.6s ease-in-out; } .project-four-subtitle { border-radius: 5px 22px 22px 0; } .project-four-content { border-radius: 0; border-radius: 0 40px 40px 10px; } .project-six-area { background: rgba(210, 28, 29, 0.03); } .project-six-button { margin-block-start: -140px; } .project-seven-wrapper.four { margin-block-start: -190px; } @media screen and (max-width: 1399px) { .project-seven-wrapper.four { margin-block-start: -170px; } } @media screen and (max-width: 1199px) { .project-seven-wrapper.four { margin-block-start: -140px; } } @media screen and (max-width: 991px) { .project-seven-wrapper.four { margin-block-start: 0; } } .project-seven-wrapper.six { margin-block-start: -190px; } @media screen and (max-width: 1399px) { .project-seven-wrapper.six { margin-block-start: -170px; } } @media screen and (max-width: 1199px) { .project-seven-wrapper.six { margin-block-start: -140px; } } @media screen and (max-width: 991px) { .project-seven-wrapper.six { margin-block-start: 0; } } @media screen and (max-width: 991px) { .project-seven-thumb { width: 100%; } } @media screen and (max-width: 991px) { .project-seven-thumb img { height: 345px; width: 100%; } } @media screen and (max-width: 1199px) { .project-seven-content h4 { font-size: 1.5rem; } } .project-eight-content { padding: 30px 80px 30px 35px; } .project-nine-content { max-width: 480px; width: 100%; } @media screen and (max-width: 991px) { .project-nine-content { position: static !important; } } @media screen and (max-width: 424px) { .project-nine-content { max-width: 100%; padding-inline-start: 0; } } .project-ten-area { background: linear-gradient(124deg, #0b163f 0%, #0d1c5d 45.43%, #301996 100%); padding-block-end: 300px; } .project-details-arrow { border: 1px solid rgba(4, 27, 52, 0.1); border-radius: 5px; padding: 20px; } @media screen and (max-width: 1199px) { .cta-area { padding-block: 120px; } } .cta-area::before { content: ""; position: absolute; width: 1750px; height: 612px; inset-block-end: 0; inset-inline-start: 50%; transform: translateX(-50%); background: #040542; z-index: -1; border-radius: 10px; } @media screen and (max-width: 1199px) { .cta-area::before { height: 100%; } } .cta-wrapper { padding-block-start: 0; padding-inline-start: 110px; } @media screen and (max-width: 1499px) { .cta-wrapper { padding-inline-start: 40px; } } .cta-review { margin-block-start: -75px; rotate: -90deg; margin-inline-start: -202px; } @media screen and (max-width: 991px) { .cta-review { margin-block-start: 40px; rotate: 0deg; margin-inline-start: 40px; } } .cta-button .tw-primary-btn .btn_inner::before { background-color: var(--main-eight-600); } .cta-button:hover .tw-primary-btn .btn_inner .btn_text { color: hsl(var(--white)) !important; } .cta-shape { animation: bounce-y 4s forwards infinite alternate; } .cta-two-area { padding-block: 332px 332px; } @media screen and (max-width: 1499px) { .cta-two-area { padding-block: 120px 120px; } } .cta-two-shape-1 { inset-block-start: 160px; inset-inline-start: 290px; } @media screen and (max-width: 1499px) { .cta-two-shape-1 { display: none; } } .cta-two-shape-2 { inset-block-start: 120px; inset-inline-start: 46%; } @media screen and (max-width: 1499px) { .cta-two-shape-2 { display: none; } } .cta-two-shape-3 { inset-block-start: 44px; inset-inline-end: 130px; } @media screen and (max-width: 1499px) { .cta-two-shape-3 { display: none; } } .cta-two-shape-4 { inset-block-end: 194px; inset-inline-start: 160px; } @media screen and (max-width: 1499px) { .cta-two-shape-4 { display: none; } } .cta-two-shape-5 { inset-block-end: 120px; inset-inline-start: 46%; } @media screen and (max-width: 1499px) { .cta-two-shape-5 { display: none; } } .cta-two-shape-6 { inset-block-end: 230px; inset-inline-end: 190px; } @media screen and (max-width: 1499px) { .cta-two-shape-6 { display: none; } } .cta-seven-area { margin-block-start: -260px; } @media screen and (max-width: 1399px) { .cta-seven-area .section-seven-title { font-size: 2.8rem; } } @media screen and (max-width: 1199px) { .cta-seven-area .section-seven-title { font-size: 2.3rem; } } .cta-seven-bg { background: hsl(var(--white)); box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.1); } @media screen and (max-width: 1399px) { .cta-seven-wrapper { padding-inline: var(--size-7); } } @media screen and (max-width: 1199px) { .cta-seven-wrapper { padding-inline: var(--size-5); } } @media screen and (max-width: 1199px) { .cta-seven-thumb img { width: 100%; } } .animated-title { font-size: 144px; line-height: 87%; letter-spacing: -0.03em; color: rgba(255, 255, 255, 0.25); white-space: nowrap; } @media screen and (max-width: 1399px) { .animated-title { font-size: 120px; } } @media screen and (max-width: 991px) { .animated-title { font-size: 76px; } } .testimonial-active { padding-block: 60px; } .testimonial-wrapper { background: #fdf9f9; } .testimonial-shape-1 { inset-block-start: 18%; inset-inline-end: 1%; animation: moving 8s linear infinite; } @media screen and (max-width: 991px) { .testimonial-shape-1 { display: none; } } .testimonial-two-wrapper { max-width: 1310px; width: 100%; height: 500px; } @media screen and (max-width: 1199px) { .testimonial-two-wrapper { display: flex; gap: 30px; flex-wrap: wrap; height: 100%; } } .testimonial-two-item.one { rotate: -10deg; position: absolute; inset-block-start: 0; inset-inline-start: 0; } .testimonial-two-item.two { rotate: 16deg; position: absolute; inset-block-start: -40px; inset-inline-start: 24%; } .testimonial-two-item.three { rotate: 26deg; position: absolute; inset-block-start: 0; inset-inline-end: 17%; } .testimonial-two-item.four { rotate: -20deg; position: absolute; inset-block-end: 90px; inset-inline-start: 14%; } .testimonial-two-item.five { position: absolute; inset-block-end: 60px; inset-inline-start: 35%; } .testimonial-two-item.six { rotate: 15deg; position: absolute; inset-block-end: 0; inset-inline-end: 9%; } .testimonial-two-shape-1 { inset-block-start: 40px; } @media screen and (max-width: 991px) { .testimonial-two-shape-1 { display: none; } } .testimonial-two-shape-2 { inset-block-start: 80px; } @media screen and (max-width: 991px) { .testimonial-two-shape-2 { display: none; } } .testimonial-two-shape-3 { inset-block-start: 76px; inset-inline-end: 30px; } @media screen and (max-width: 991px) { .testimonial-two-shape-3 { display: none; } } .testimonial-three-area { background: rgba(1, 100, 225, 0.06); } @media screen and (max-width: 991px) { .testimonial-three-area .section-three-wrapper { margin-block-end: var(--size-6); } } @media screen and (max-width: 1199px) { .testimonial-three-left { flex-direction: inherit !important; } } @media screen and (max-width: 991px) { .testimonial-three-left { flex-direction: column !important; } } .testimonial-three-wrapper { border: 1px solid rgba(4, 27, 52, 0.1); } .testimonial-three-img { box-shadow: 0 0 1px 0 rgba(4, 27, 52, 0.5); border-radius: 50%; padding: 5px; } .testimonial-three-arrow button { width: 40px; height: 40px; line-height: 1; display: inline-flex; justify-content: center; align-items: center; background: var(--main-two-600); color: var(--heading-color); border-radius: 50%; margin: 0 2px 0; transition: 0.4s; } .testimonial-three-arrow button:hover { background: var(--main-eight-600); color: hsl(var(--white)); } .testimonial-three-arrow button:first-child { margin-left: 0; } @media screen and (max-width: 1199px) { .testimonial-three-button-wrap { flex-wrap: wrap; width: 600px; align-items: center; } } @media screen and (max-width: 991px) { .testimonial-three-button-wrap { margin-block-end: 60px; } } @media screen and (max-width: 1199px) { .testimonial-three-google { display: none !important; } } .testimonial-four-border { border-bottom: 1px solid #e4e4e4; padding-block-end: 30px; margin-block-end: 30px; } .testimonial-four-counter { border-right: 1px solid #d9d9d9; padding-inline-end: 65px; } @media screen and (max-width: 575px) { .testimonial-four-counter { border-right: none; padding-inline-end: 0; } } @media screen and (max-width: 1199px) { .testimonial-four-counter h2 { font-size: 2.5rem; } } @media screen and (max-width: 1199px) { .testimonial-four-thumb { margin-block-end: 40px; } } @media screen and (max-width: 1199px) { .testimonial-four-thumb img { width: 100%; } } .testimonial-four-arrow button { width: 46px; height: 46px; line-height: 1; display: inline-flex; justify-content: center; align-items: center; border-radius: 50%; background: var(--main-four-600); color: hsl(var(--white)); margin-inline: 8px; } .testimonial-four-arrow button:last-child { margin-inline: 0; } .testimonial-five-active-one { padding-block: 10px; } .testimonial-five-active-two { padding-block: 10px; padding-inline-end: 5px; } @media screen and (max-width: 767px) { .testimonial-five-top-wrap { justify-content: start !important; } } @media screen and (max-width: 1399px) { .testimonial-five-thumb { display: none; } } @media screen and (max-width: 1199px) { .testimonial-five-thumb { display: block; } } @media screen and (max-width: 767px) { .testimonial-five-thumb { display: none; } } .testimonial-five-thumb img { max-width: 311px; width: 311px; height: 338px; object-fit: cover; } .testimonial-five-content { border: 1px solid #eb6029; border-left: none; padding: 35px 31px 35px 30px; border-radius: 0 1rem 1rem 0; } @media screen and (max-width: 1399px) { .testimonial-five-content { border-left: 1px solid #eb6029; border-radius: 1rem 1rem 1rem 1rem; } } @media screen and (max-width: 1199px) { .testimonial-five-content { border-left: none; border-radius: 0 1rem 1rem 0; } } @media screen and (max-width: 767px) { .testimonial-five-content { border-left: 1px solid #eb6029; border-radius: 1rem 1rem 1rem 1rem; } } .testimonial-five-arrow button { color: hsl(var(--white)); position: absolute; top: 50%; inset-inline-start: 14px; transform: translateY(-50%); } .testimonial-five-arrow button.slider-next { inset-inline-start: auto; inset-inline-end: 14px; } @media screen and (max-width: 1199px) { .testimonial-five-bottom-thumb img { width: 100%; height: 320px; } } .testimonial-five-dot { inset-block-start: 45%; inset-inline-start: 50%; transform: translate(-50%, -50%); } .testimonial-five-dot .swiper-pagination-bullet { width: 8px; height: 8px; background: hsl(var(--white)); opacity: 1; transition: 0.4s; border-radius: 50%; margin: 0 7px 0; position: relative; } .testimonial-five-dot .swiper-pagination-bullet::before { content: ""; position: absolute; width: 16px; height: 16px; inset-block-start: 50%; inset-inline-start: 50%; transform: translate(-50%, -50%); background: rgba(255, 255, 255, 0.3); border-radius: 50%; z-index: -1; opacity: 0; visibility: hidden; transition: 0.4s; } .testimonial-five-dot .swiper-pagination-bullet.swiper-pagination-bullet-active::before { opacity: 1 !important; visibility: visible !important; } .testimonial-five-dot .swiper-pagination-bullet button { display: none !important; } .testimonial-six-review { border: 1px solid rgba(35, 31, 32, 0.1); border-radius: 19px; padding: 7px 20px 6px; display: inline-flex; align-items: center; gap: 6px; } .testimonial-six-review i { color: #ffa500; } .testimonial-six-arrow button { width: 65px; height: 65px; line-height: 1; display: inline-flex; align-items: center; justify-content: center; border: 1px solid rgba(35, 31, 32, 0.1); border-radius: 50%; transition: 0.5s; } .testimonial-six-arrow button svg { transition: 0.5s; } .testimonial-six-arrow button:hover { background: var(--main-six-600); border-color: var(--main-six-600); } .testimonial-six-arrow button:hover svg { filter: brightness(0) invert(1); } .testimonial-six-shape-1 { inset-block-start: 200px; inset-inline-start: 0; } .testimonial-six-quate { position: absolute; inset-block-start: 50%; transform: translateY(-50%); inset-inline-start: 29%; z-index: 2; } @media screen and (max-width: 1399px) { .testimonial-six-quate { inset-inline-start: 15%; } } @media screen and (max-width: 767px) { .testimonial-six-quate { inset-inline-start: -5%; } } .testimonial-six-quate span { width: 155px; height: 155px; line-height: 1; display: inline-flex; justify-content: center; align-items: center; background: #fbe8e8; border-radius: 50%; border: 10px solid #ffffff; } .quotes-slide { width: 33%; padding: 3rem; background-color: hsl(var(--white)); box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.1); line-height: 1.75; font-family: "Roboto", sans-serif; transition: all 0.5s ease; outline: none; border-radius: 10px; } @media screen and (max-width: 1399px) { .quotes-slide { padding: 3rem 2rem; } } @media screen and (max-width: 1199px) { .quotes-slide { width: 48%; position: static !important; rotate: 0deg !important; padding: 3rem 3rem; } } @media screen and (max-width: 991px) { .quotes-slide { width: 47%; padding: 3rem 2rem; } } @media screen and (max-width: 767px) { .quotes-slide { width: 100%; padding: 3rem 2rem; } } .quotes-slide--active { transform: scale(1.2); z-index: 10; border: none; box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.1); color: #222222; } @media screen and (max-width: 1199px) { .quotes-slide--active { transform: scale(1); } } .testimonial-eight-area { background: #e9f6fe; } .testimonial-eight-img-active .slick-track { display: flex; justify-content: start; width: inherit !important; flex-wrap: wrap; } .testimonial-eight-img { max-width: 6rem !important; width: 6rem !important; } .testimonial-eight-img img { max-width: 6rem; width: 6rem; mix-blend-mode: luminosity; opacity: 0.5; border: 2px solid transparent; border-radius: 50%; transition: 0.4s ease-in-out; } .testimonial-eight-paragraph { line-height: 196%; letter-spacing: -0.03em; } .testimonial-eight-arrow button { display: inline-flex !important; background: hsl(var(--white)); box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.07); } .testimonial-eight-arrow button:hover { background: var(--main-eight-600); } .testimonial-eight-img-active .slick-slide.slick-current img { mix-blend-mode: unset; opacity: 1; border: 2px solid var(--main-eight-600); } .testimonial-eight-clints-img { box-shadow: 0 0 2px 0 rgb(1, 101, 223); } .testimonial-nine-area { background: linear-gradient(180deg, #afdcfd 0%, #fff 100%); border-radius: 20px 20px 0 0; } @media screen and (max-width: 1199px) { .testimonial-nine-area { padding-inline: 30px; } } .testimonial-nine-active .slick-slide { margin: 0 15px; } .testimonial-nine-active .slick-list { margin: 0 -15px; } .testimonial-nine-left { margin-inline-start: 146px; } @media screen and (max-width: 1799px) { .testimonial-nine-left { margin-inline-start: 90px; } } @media screen and (max-width: 1699px) { .testimonial-nine-left { margin-inline-start: 50px; } } @media screen and (max-width: 1499px) { .testimonial-nine-left { margin-inline-start: 0; } } @media screen and (max-width: 1199px) { .testimonial-nine-left { margin-block-end: 40px; } } .testimonial-nine-arrow button { width: 55px; height: 55px; line-height: 1; display: inline-flex; align-items: center; justify-content: center; border: 1px solid rgba(30, 32, 35, 0.12); border-radius: 50%; transition: 0.5s; font-size: 20px; } .testimonial-nine-arrow button svg { transition: 0.5s; } .testimonial-nine-arrow button:hover { background: var(--main-eight-600); border-color: var(--main-eight-600); color: hsl(var(--white)); } .testimonial-nine-arrow button:hover svg { filter: brightness(0) invert(1); } .testimonial-ten-area { margin-block-start: -121px; border-radius: 20px 20px 0 0; padding-block-start: 152px; } @media screen and (max-width: 1499px) { .testimonial-ten-area { border-radius: 0; margin-inline: 0; padding-inline: 15px; } } .testimonial-ten-active { margin-inline-end: -20px; } .testimonial-eleven-area { background: linear-gradient(180deg, #afdcfd 0%, rgba(175, 220, 253, 0) 100%); } .testimonial-eleven-arrow button { width: 40px; height: 40px; line-height: 1; display: inline-flex; justify-content: center; align-items: center; background: transparent; color: var(--heading-color); border-radius: 50%; margin: 0 2px 0; transition: 0.4s; font-size: 20px; border: 1px solid var(--main-eight-600); } .testimonial-eleven-arrow button:hover { background: var(--main-eight-600); color: hsl(var(--white)); border-color: var(--main-eight-600); } .testimonial-eight-area { position: relative; } .testimonial-eight-area .new-testimonial-image { position: absolute; bottom: 0; left: 100px; } @media screen and (max-width: 1699px) { .testimonial-eight-area .new-testimonial-image { left: 30px; } } @media screen and (max-width: 1199px) { .testimonial-eight-area .new-testimonial-image { display: none; } } .testimonial-eight-area .testimonial-eight-active { position: relative; } .testimonial-eight-area .testimonial-eight-active .testimonial-three-arrow { position: absolute; bottom: 40px; right: 40px; z-index: 999; } @media screen and (max-width: 475px) { .testimonial-eight-area .testimonial-eight-active .testimonial-three-arrow { position: static; margin-top: 30px; } } .fix { overflow: hidden; } .mt-30 { margin-top: 30px; } .mt-20 { margin-top: 20px; } .swiper { overflow: hidden; } @media screen and (max-width: 1199px) { .video-nine-bg .video-button { inset-block-start: 35%; } .video-nine-bg img { object-fit: cover; height: 500px; } } @media screen and (max-width: 1199px) { .video-area-newss { margin-bottom: 100px; } .video-area-newss .video-button { inset-block-start: 35%; } .video-area-newss img { object-fit: cover; height: 500px; } } @media screen and (max-width: 1199px) { .video-eleven-area .video-button { inset-block-start: 35%; } .video-eleven-area img { object-fit: cover; height: 500px; } } .brand-thumb { text-align: center; } .brand-thumb img { cursor: pointer; filter: brightness(0) invert(0); transition: 0.4s; } .brand-thumb img:hover { filter: inherit !important; } .brand-slider-active .swiper-slide-active .brand-thumb img { filter: inherit !important; } .brand-eight-thumb img { margin: 0px 38px; cursor: pointer; transition: 0.4s; filter: brightness(0) invert(0); } .brand-eight-thumb img:hover { filter: inherit; } .brand-eight-active .swiper-slide-active .brand-eight-thumb img { filter: inherit; } .brand-ten-area { padding-block: 102px 80px; } .brand-ten-thumb img { margin: 0px 38px; cursor: pointer; transition: 0.4s; filter: brightness(0) invert(1); } .brand-ten-thumb img:hover { filter: brightness(0) invert(0); } .brand-ten-active .swiper-slide-active .brand-ten-thumb img { filter: brightness(0) invert(0); } .brand-eleven-area { background: linear-gradient(180deg, #afdcfd 0%, rgba(175, 220, 253, 0) 100%); } @media screen and (max-width: 1499px) { .contact-area .section-title { font-size: 3rem; } } @media screen and (max-width: 1399px) { .contact-area .section-title { font-size: 2rem; } } @media screen and (max-width: 575px) { .contact-wrapper { padding: var(--size-5); } } @media screen and (max-width: 991px) { .contact-thumb { margin-block-end: 30px; } } @media screen and (max-width: 1199px) { .contact-form { margin-block-start: 30px; } } .contact-hand { margin-block-start: -100px; } .contact-form input::placeholder { color: hsl(var(--white)); } .contact-form textarea::placeholder { color: hsl(var(--white)); } .contact-two-area { background: rgba(1, 100, 225, 0.06); } @media screen and (max-width: 1199px) { .contact-two-left { margin-block-end: 30px; } } .contact-two-info { display: flex; justify-content: space-between; align-items: center; } .contact-two-info-shape img { width: 181px; height: 181px; max-width: 181px; } .contact-two-form input { border: 1px solid rgba(4, 27, 52, 0.1) !important; } .contact-two-form .nice-select { border: 1px solid rgba(4, 27, 52, 0.1) !important; } .contact-three-area { background: rgba(1, 100, 225, 0.06); } .contact-three-wrapper { border: 1px solid rgba(4, 27, 52, 0.1); } @media screen and (max-width: 1199px) { .contact-three-wrapper { margin-block-end: 30px; } } @media screen and (max-width: 1199px) { .contact-three-thumb { position: static !important; } } @media screen and (max-width: 1199px) { .contact-three-thumb img { width: 100%; } } .contact-six-form input { border: 1px solid rgba(255, 255, 255, 0.35) !important; outline: 0; color-scheme: dark; } .contact-six-form input::placeholder { color: hsl(var(--white)); } .contact-six-form input:focus { border: none; } .contact-six-form .nice-select { border: 1px solid rgba(255, 255, 255, 0.35) !important; } .contact-six-form .nice-select::after { border-bottom: 2px solid hsl(var(--white)); border-right: 2px solid hsl(var(--white)); } .contact-six-form .nice-select .list li { color: hsl(var(--heading-color)); } @media screen and (max-width: 1199px) { .contact-six-thumb { margin-block-end: 30px; } } .contact-six-btn .btn_inner::before { background-color: var(--main-six-600); } .contact-six-btn:hover .btn_inner .btn_text span { color: hsl(var(--white)) !important; } .contact-seven-item { border: 1px solid rgba(0, 11, 26, 0.08); } @media screen and (max-width: 1199px) { .contact-seven-wrap { width: 100%; } } @media screen and (max-width: 1399px) { .contact-eight-area .section-eight-title { font-size: 44px; } } .contact-eight-button .tw-primary-btn .btn_inner::before { background-color: var(--main-eight-600); } .contact-eight-button .tw-primary-btn:hover .btn_text { color: hsl(var(--white)) !important; } .contact-eleven-area { background: linear-gradient(180deg, #afdcfd 0%, rgba(175, 220, 253, 0) 100%); } .contact-ip-form { border: 1px solid rgba(0, 0, 0, 0.08); border-radius: 10px; padding: 42px 40px 48px; } @media screen and (max-width: 1199px) { .contact-ip-form { margin-block-end: 30px; } } .appointment-ip-wrapper { border: 1px solid rgba(4, 27, 52, 0.1); border-radius: 10px; padding: 50px; } .blog-wrapper:hover .blog-main-thumb img:nth-child(1) { transform: translatex(0) scalex(1); opacity: 1; filter: blur(0); } .blog-wrapper:hover .blog-main-thumb img:nth-child(2) { transform: translatex(-50%) scalex(2); opacity: 0; filter: blur(10px); } .blog-main-thumb img { background-size: cover; } .blog-main-thumb img:nth-child(1) { transform: translatex(50%) scalex(2); opacity: 0; filter: blur(10px); } .blog-main-thumb img:nth-child(2) { position: absolute; top: 0; left: 0; bottom: 0; right: 0; object-fit: cover; } .blog-card-image-link { background-color: rgba(28, 26, 29, 0.5); opacity: 0; transition: opacity 500ms ease, transform 500ms ease; } .blog-meta ul li.learning { background: rgba(1, 101, 223, 0.1); transition: 0.4s; } .blog-two-nav-tabs { background: hsl(var(--white)); box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.1); padding: 20px; --bs-nav-tabs-border-width: none; border-radius: 0.75rem; } @media screen and (max-width: 1199px) { .blog-two-nav-tabs { flex-direction: inherit !important; gap: 30px; margin-block-end: 50px; } } @media screen and (max-width: 1199px) { .blog-two-nav-item { width: 48%; margin-block-end: 0; } } @media screen and (max-width: 991px) { .blog-two-nav-item { width: 47%; } } @media screen and (max-width: 767px) { .blog-two-nav-item { width: 46%; } } @media screen and (max-width: 575px) { .blog-two-nav-item { width: 45%; } } .blog-two-nav-link { padding: 12px 20px; border: 1px solid rgba(4, 27, 52, 0.08) !important; } .blog-two-nav-link.active { background-color: var(--main-eight-600) !important; color: hsl(var(--white)) !important; border-top-left-radius: 0.75rem; border-top-right-radius: 0.75rem; margin-block-end: 0; } .blog-two-wrapper { background: hsl(var(--white)); box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.1); margin-block-end: 30px; } @media screen and (max-width: 1199px) { .blog-two-wrapper.main { margin-inline-start: 0; } } @media screen and (max-width: 1199px) { .blog-two-thumb img { width: 100%; } } @media screen and (max-width: 767px) { .blog-two-title { font-size: 22px; } } .blog-two-shape-1 { inset-block-start: 32%; animation: bounce-y 5s forwards infinite alternate; } @media screen and (max-width: 991px) { .blog-two-shape-1 { display: none; } } .blog-two-shape-3 { inset-block-start: 130px; inset-inline-end: 60px; animation: moving 8s linear infinite; } @media screen and (max-width: 991px) { .blog-two-shape-3 { display: none; } } .blog-three-wrapper { background: rgba(1, 100, 225, 0.06); border: 1px solid rgba(4, 27, 52, 0.1); } .blog-three-top { border-bottom: 1px solid rgba(4, 27, 52, 0.1); margin-block-end: 30px; } .blog-three-img img { border: 4px solid rgba(1, 100, 225, 0.4); } .blog-four-wrap { background: hsl(var(--white)); box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.1); position: relative; z-index: 1; max-width: 380px; width: 100%; margin-inline-start: auto; margin-block-start: -80px; } .blog-four-meta { background: hsl(var(--heading-color)); padding: 7px 12px; } .blog-six-area { background: rgba(210, 28, 29, 0.03); } @media screen and (max-width: 1199px) { .blog-six-wrapper.four { flex-wrap: wrap; row-gap: 0; } } @media screen and (max-width: 1399px) { .blog-six-wrapper.four .blog-six-thumb { max-width: 100%; width: 100%; } } .blog-six-wrapper.four .blog-six-thumb img { max-width: 424px; width: 424px !important; } @media screen and (max-width: 1399px) { .blog-six-wrapper.four .blog-six-thumb img { max-width: 100%; } } .blog-seven-area { background: #f4f4f9; } .blog-seven-wrapper { box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.1); } .blog-seven-paragraph { border-bottom: 1px solid rgba(0, 11, 26, 0.07); padding-block-end: 18px; } @media screen and (max-width: 1399px) { .blog-seven-wrap { flex-wrap: wrap; row-gap: 20px; } } .blog-seven-btn { background: rgba(255, 119, 0, 0.1); } .blog-eight-right-wrapper { background: #f7f7f7; padding: 30px 28px; } @media screen and (max-width: 1399px) { .blog-eight-right-wrapper { flex-wrap: wrap; } } @media screen and (max-width: 1399px) { .blog-eight-right-wrapper .blog-main-thumb { width: 100%; } } @media screen and (max-width: 1399px) { .blog-eight-right-wrapper .blog-main-thumb img { width: 100%; height: 308px; object-fit: cover; } } .blog-eight-right-content { max-width: 362px; width: 100%; } @media screen and (max-width: 1399px) { .blog-eight-right-content { max-width: 100%; } } @media screen and (max-width: 1199px) { .blog-eight-title { font-size: 2.4rem; } } @media screen and (max-width: 767px) { .blog-eight-title { font-size: 2rem; } } .blog-nine-wrapper:hover .blog-nine-content { transform: translateY(0%); } .blog-nine-wrapper:hover .blog-nine-thumb::before { background: var(--main-eight-600); } .blog-nine-thumb::before { content: ""; position: absolute; width: 100%; height: 100%; inset-block-start: 0; inset-inline-start: 0; background: rgba(38, 61, 108, 0.4); transition: 0.4s; } .blog-nine-date { width: 88px; height: 90px; line-height: 1; display: inline-flex; justify-content: center; align-items: center; flex-direction: column; backdrop-filter: blur(84px); background: rgba(255, 255, 255, 0.39); position: absolute; inset-block-start: 0; inset-inline-start: 0; margin: 16px; } .blog-nine-date h3 { letter-spacing: -0.01em; } .blog-nine-content { position: absolute; inset-inline-start: 0; inset-block-end: 0; padding: 16px; transform: translateY(63%); transition: 0.4s ease-in-out; } @media screen and (max-width: 1399px) { .blog-nine-content { margin-inline-end: 0; transform: translateY(60%); } } .blog-nine-border { display: inline-block; width: 100px; height: 3px; background: hsl(var(--white)); margin-block: 22px 14px; } .blog-nine-title { line-height: 136%; } .blog-nine-paragraph { margin-block-end: 100px; } @media screen and (max-width: 1399px) { .blog-nine-paragraph { margin-block-end: 45px; } } @media screen and (max-width: 991px) { .blog-nine-paragraph { margin-block-end: 0; } } @media screen and (max-width: 767px) { .blog-nine-paragraph { margin-block-end: 100px; } } @media screen and (max-width: 424px) { .blog-nine-paragraph { margin-block-end: 40px; } } .blog-eleven-wrapper { background: rgba(1, 100, 225, 0.04); } .blog-eleven-img img { border: 4px solid rgba(1, 100, 225, 0.2); } .blog-details-wrapper { box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.25); } @media screen and (max-width: 1199px) { .blog-details-wrapper { margin-block-end: 40px; } } .blog-details-contact-form input, .blog-details-contact-form textarea { color: hsl(var(--heading-color)); border: 1px solid rgba(128, 134, 140, 0.23) !important; } .blog-details-contact-form input::placeholder, .blog-details-contact-form textarea::placeholder { color: hsl(var(--heading-color)); } .custom-control.custom-checkbox { display: inline-flex; align-items: center; gap: 10px; } .custom-control.custom-checkbox input { display: none; } .custom-control.custom-checkbox input:checked ~ label::after { background-color: var(--main-eight-600); border-color: var(--main-eight-600); } .custom-control.custom-checkbox input:checked ~ label::before { visibility: visible; opacity: 1; } .custom-control.custom-checkbox label { position: relative; padding-left: 26px; z-index: 1; font-weight: 500; font-size: 14px; letter-spacing: -0.01em; color: #848f93; } .custom-control.custom-checkbox label::after { position: absolute; content: ""; top: 5px; left: 0; width: 16px; height: 16px; line-height: 16px; text-align: center; border: 1px solid rgba(6, 7, 40, 0.2); z-index: -1; transition: 0.3s; border-radius: 3px; } .custom-control.custom-checkbox label::before { content: "\e182"; position: absolute; top: 5px; left: 3px; font-size: 10px; text-align: center; visibility: hidden; opacity: 0; color: hsl(var(--white)); transition: 0.3s; font-family: "Phosphor"; } .blog-six-content .blog-meta ul li i { color: #1d72f2; } .blog-six-content .blog-six-title a:hover { color: #1d72f2 !important; } .hover-text-main-six-600:hover { color: #1d72f2 !important; } .brand-ten-active .swiper-slide-active .brand-ten-thumb img { filter: brightness(0) invert(1) !important; } .brand-ten-active .brand-ten-thumb:hover { filter: brightness(0) invert(1) !important; } .maquee-transition { transition-timing-function: linear; } .maquee-title { color: rgba(255, 255, 255, 0.25); font-size: 144px; line-height: 87%; letter-spacing: -0.03em; } @media screen and (max-width: 1399px) { .maquee-title { font-size: 100px; } } @media screen and (max-width: 991px) { .maquee-title { font-size: 80px; } } @media screen and (max-width: 767px) { .maquee-title { font-size: 60px; } } .maquee-two-area { background: rgba(1, 100, 225, 0.06); padding-block: 74px 70px; } .maquee-two-title { color: #041b34; } .maquee-ten-title { font-size: 120px; letter-spacing: -0.02em; color: rgba(1, 100, 225, 0.09); } .feature-two-area { margin-block-start: -104px; } .feature-two-wrapper { box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.07); } .feature-two-icon span { border: 1px dashed var(--main-eight-600); padding: 5px; } .feature-two-icon span::before { content: ""; position: absolute; width: 122%; height: 122%; inset-block-start: 50%; inset-inline-start: 50%; transform: translate(-50%, -50%); border: 1px dashed var(--main-eight-600); border-radius: 50%; } .feature-two-icon span img { filter: brightness(0) invert(1); } @media screen and (max-width: 1799px) { .feature-three-wrapper { flex-wrap: wrap; padding: var(--size-10); } } @media screen and (max-width: 1399px) { .feature-five-top { flex-wrap: wrap; } } .feature-five-wrapper { background: hsl(var(--white)); box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.1); padding: 0 30px 42px 40px; transition: all 0.4s ease-in-out; } @media screen and (max-width: 1399px) { .feature-five-wrapper { padding: 0 30px 42px 30px; } } .feature-five-wrapper::before { content: ""; position: absolute; width: 100%; height: 100%; inset-block-start: 0; inset-inline-start: 0; background: var(--main-four-600); opacity: 0; visibility: hidden; z-index: -1; transition: 0.6s ease-in-out; border-radius: 0.75rem; } .feature-five-wrapper:hover::before { opacity: 1; visibility: visible; } .feature-five-wrapper:hover .feature-five-icon span { background: hsl(var(--white)) !important; } .feature-five-wrapper:hover .feature-five-icon span img { filter: inherit !important; } .feature-five-wrapper:hover .feature-five-title { color: hsl(var(--white)); } .feature-five-wrapper:hover .feature-five-paragraph { color: hsl(var(--white)); } .feature-five-icon span { border-radius: 0 0 50px 50px; } .feature-five-icon span img { filter: brightness(0) invert(1); transition: 0.3s; } .feature-five-shape-1 { inset-block-end: 0; inset-inline-start: 0; } .feature-five-shape-2 { inset-block-start: 50%; transform: translateY(-50%); inset-inline-end: 0; } .feature-eight-area { background: #e9f6fe; } @media screen and (max-width: 1199px) { .choose-us-two-thumb { margin-block-end: 100px; } } .choose-us-two-thumb-2 { rotate: -14deg; margin-block-start: -280px; margin-inline-start: 60px; } @media screen and (max-width: 575px) { .choose-us-two-thumb-2 { rotate: 0deg; margin-block-start: 20px; margin-inline-start: 0; } } .choose-us-two-thumb-shape-1 { inset-block-start: -45px; inset-inline-start: 45px; } .choose-us-two-thumb-shape-2 { inset-block-end: 20px; inset-inline-end: -25px; animation: moving 8s linear infinite; } @media screen and (max-width: 767px) { .choose-us-two-list { margin-block-end: 40px; } } @media screen and (max-width: 767px) { .choose-us-two-list ul li { width: 100% !important; float: inherit !important; } } .choose-us-two-shape-1 { inset-block-start: 120px; animation: bounce-y 3s forwards infinite alternate; } @media screen and (max-width: 991px) { .choose-us-two-shape-1 { display: none; } } .choose-us-two-shape-3 { inset-block-start: 80px; animation: bounce-y 5s forwards infinite alternate; } @media screen and (max-width: 991px) { .choose-us-two-shape-3 { display: none; } } @media screen and (max-width: 1199px) { .choose-us-four-area .section-four-wrapper { margin-block-end: 30px; } } @media screen and (max-width: 1199px) { .choose-us-four-thumb { margin-block-end: 40px; } } @media screen and (max-width: 1199px) { .choose-us-four-thumb img { width: 100%; } } .choose-us-four-shape { inset-block-start: -80px; } @media screen and (max-width: 991px) { .choose-us-four-shape { display: none; } } .choose-us-five-nav-tabs { display: flex; flex-wrap: inherit; border-bottom: none; justify-content: space-between; } @media screen and (max-width: 767px) { .choose-us-five-nav-tabs { justify-content: space-between; row-gap: 40px; flex-wrap: wrap; } } @media screen and (max-width: 767px) { .choose-us-five-nav-item { width: 50%; } } .choose-us-five-nav-link { max-width: 312px; width: 100%; } .choose-us-five-nav-link:hover { border-color: transparent !important; } .choose-us-five-nav-link.active { color: transparent !important; background-color: transparent !important; border-color: transparent !important; } .choose-us-five-nav-link.active .choose-us-five-icon { background: var(--main-four-600) !important; } .choose-us-five-nav-link.active .choose-us-five-icon img { filter: brightness(0) invert(1); } @media screen and (max-width: 1399px) { .choose-us-five-nav-link h4 { font-size: 1.1rem; } } @media screen and (max-width: 1199px) { .choose-us-five-nav-link h4 { font-size: 1.4rem; } } @media screen and (max-width: 991px) { .choose-us-five-nav-link h4 { font-size: 1rem; } } @media screen and (max-width: 767px) { .choose-us-five-nav-link h4 { font-size: 1.4rem; } } @media screen and (max-width: 1199px) { .choose-us-five-nav-wrap { flex-wrap: wrap; } } @media screen and (max-width: 1399px) { .choose-us-five-wrapper { margin-inline-start: var(--size-5); } } @media screen and (max-width: 1199px) { .choose-us-five-thumb { margin-block-end: 30px; } } .choose-us-six-wrapper { background: hsl(var(--white)); border: 1px solid rgba(35, 31, 32, 0.1); border-radius: 15px; padding: 10px; padding-block-end: 13px; } @media screen and (max-width: 1199px) { .choose-us-six-wrapper { margin-block-end: 60px; } } .choose-us-six-icon { margin-block-start: -50px; margin-bottom: 20px; } .choose-us-six-icon span { background: #ffffff; border: 1px solid rgba(35, 31, 32, 0.1); padding: 5px; } .choose-us-six-icon span::before { content: ""; position: absolute; width: 86%; height: 86%; inset-block-start: 50%; inset-inline-start: 50%; transform: translate(-50%, -50%); background: var(--main-six-600); border-radius: 50%; z-index: -1; } .choose-us-six-number { color: rgba(35, 31, 32, 0.1); margin-block: -48px -20px; } .choose-us-six-wrap { background: #f7f7f8; border-radius: 15px; padding: 24px 20px 20px; } @media screen and (max-width: 1499px) { .choose-us-six-title { font-size: 1.5rem; } } .choose-us-six-shape { inset-block-start: -100px; } @media screen and (max-width: 991px) { .choose-seven-wrapper { margin-block-end: 40px; } } .choose-seven-icon span { border: 1px solid rgba(0, 11, 26, 0.1); } @media screen and (max-width: 991px) { .choose-seven-thumb img { width: 100%; } } .work-two-area { background: rgba(1, 100, 225, 0.06); padding-block-end: 320px; } @media screen and (max-width: 767px) { .work-two-area { padding-block-end: 90px; } } .work-two-wrapper { display: flex; justify-content: space-between; row-gap: 30px; } @media screen and (max-width: 991px) { .work-two-wrapper { flex-wrap: wrap; } } @media screen and (max-width: 767px) { .work-two-wrapper { justify-content: center; } } .work-two-item:first-child .work-two-thumb-border::before { background: var(--main-eight-600); } .work-two-item:last-child .work-two-thumb-border::after { width: 10px; height: 10px; background: var(--main-eight-600); border-radius: 50%; border-width: 0; } .work-two-item:hover .work-two-thumb { border-color: var(--main-eight-600); } .work-two-item:hover .work-two-icon { top: 35px; } .work-two-item:hover .work-two-icon span { color: hsl(var(--white)); } .work-two-item:hover .work-two-icon span::before { transform: scale(1); } .work-two-thumb { width: 312px; height: 312px; border-radius: 50%; border: 10px solid rgba(1, 100, 225, 0.1); margin: auto; margin-bottom: auto; margin-bottom: 24px; position: relative; z-index: 1; transition: 0.4s; } @media screen and (max-width: 1199px) { .work-two-thumb { width: 270px; height: 270px; } } .work-two-thumb img { width: 100%; object-fit: cover; } .work-two-icon { position: absolute; top: 45px; right: -7px; transition: 0.6s; } .work-two-icon span { width: 50px; height: 50px; line-height: 1; display: inline-flex; justify-content: center; align-items: center; background: rgba(1, 100, 225, 0.4); color: hsl(var(--white)); border-radius: 50%; font-family: var(--tj-ff-heading); font-weight: 600; font-size: 24px; position: relative; z-index: 1; } .work-two-icon span::before { content: ""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; transform: scale(0); background: var(--main-eight-600); width: 100%; height: 100%; z-index: -1; transition: 0.6s; border-radius: 50%; } .work-two-thumb-border { position: absolute; width: 185%; height: 2px; top: 50%; left: 50%; background: var(--main-eight-600); transform: translate(-50%, -50%); z-index: -1; } .work-two-thumb-border::before { content: ""; position: absolute; width: 10px; height: 10px; top: 50%; left: 0; background: transparent; border-radius: 50%; transform: translate(0, -50%); } @media screen and (max-width: 767px) { .work-two-thumb-border::before { background: var(--main-eight-600); } } .work-two-thumb-border::after { content: ""; position: absolute; width: 10px; height: 10px; right: 0; top: 50%; background: var(--main-eight-600); border-radius: 50%; transform: translate(0, -50%); } .work-two-shape-1 { inset-block-start: 140px; animation: moving 8s linear infinite; } @media screen and (max-width: 991px) { .work-two-shape-1 { display: none; } } .work-two-shape-2 { inset-inline-end: 8%; } @media screen and (max-width: 991px) { .work-two-shape-2 { display: none; } } .work-four-area::before { content: ""; position: absolute; width: 100%; height: 100%; inset-block-start: 0; inset-inline-start: 0; background: rgba(4, 27, 52, 0.9); z-index: -1; } .work-four-wrapper { display: flex; } @media screen and (max-width: 1199px) { .work-four-wrapper { flex-wrap: wrap; } } .work-four-item { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 30px; } @media screen and (max-width: 1199px) { .work-four-item { width: 50%; margin-block-end: 30px; } } @media screen and (max-width: 575px) { .work-four-item { width: 100%; } } .work-four-item:nth-child(2), .work-four-item:nth-child(4) { flex-direction: column-reverse; } .work-four-shape { inset-block-start: -24px; inset-inline-start: 32px; } @media screen and (max-width: 1399px) { .work-four-shape { display: none; } } .work-five-text span { border: 1px solid rgba(4, 27, 52, 0.1); width: 108px; } .work-five-wrapper { max-width: 570px; } .work-five-wrapper.two { margin-inline-start: auto; } .work-five-bottom::before { content: ""; position: absolute; width: 8px; height: 100%; inset-block-start: 50%; inset-inline-start: 50%; transform: translate(-50%, -50%); background: rgba(235, 96, 40, 0.06); border-radius: 30px; } @media screen and (max-width: 1199px) { .work-five-bottom::before { display: none; } } .work-five-dots { width: 16px; height: 16px; background: var(--main-four-600); border-radius: 50%; position: absolute; } @media screen and (max-width: 1199px) { .work-five-dots { display: none; } } .work-five-dots::before { position: absolute; content: ""; left: 50%; top: 50%; width: 70%; height: 70%; background-color: rgba(235, 96, 40, 0.471); animation: borderanimate2 2s linear infinite; z-index: -1; border-radius: 50%; } .work-five-dots::after { position: absolute; content: ""; left: 50%; top: 50%; width: 90%; height: 90%; transform: scale(1.5); border: 1px solid rgba(235, 96, 40, 0.471); animation: borderanimate2 2s linear infinite; border-radius: 50%; } .work-five-dots.one { inset-block-start: 0; inset-inline-start: 50%; transform: translateX(-50%); } .work-five-dots.two { inset-block-start: 50%; inset-inline-start: 50%; transform: translate(-50%, -50%); } .work-five-dots.three { inset-block-end: 0; inset-inline-start: 50%; transform: translateX(-50%); } @media screen and (max-width: 1199px) { .work-five-shape { display: none; } } @media screen and (max-width: 991px) { .work-seven-left { margin-block-end: 60px; } } @media screen and (max-width: 1399px) { .work-seven-right { margin-inline-start: 0; } } .work-seven-item::before { content: ""; position: absolute; width: 1px; height: 130%; inset-block-start: 0; inset-inline-start: 50px; background: #d9d9d9; z-index: -1; } .work-seven-item:last-child::before { display: none; } .work-seven-item:hover .work-seven-icon span { color: hsl(var(--white)); border-color: var(--main-four-600); } .work-seven-item:hover .work-seven-icon span::before { transform: scale(1); } .work-seven-item:hover .work-seven-title a { color: var(--main-four-600); } @media screen and (max-width: 991px) { .work-seven-thumb img { width: 100%; } } @media screen and (max-width: 1199px) { .work-seven-paragraph { width: 100%; } } .work-seven-content { border-bottom: 1px solid #d9d9d9; padding-block-end: 35px; margin-block-end: 20px; } .work-seven-icon span { border: 1px solid rgba(0, 11, 26, 0.2); } .work-seven-icon span::before { content: ""; position: absolute; top: 0; left: 0; bottom: 0; right: 0; transform: scale(0); background: var(--main-four-600); width: 100%; height: 100%; z-index: -1; transition: 0.5s; border-radius: 50%; } .before-after-bg { position: absolute; top: 0; left: 0; height: 620px; width: 100%; background-repeat: no-repeat; background-position: center center; z-index: -1; } .before-after-bg::before { content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: rgba(7, 124, 234, 0.85); } .before-after-list { margin-inline-start: -20px; } @media screen and (max-width: 1199px) { .before-after-list { margin-inline-start: 0; } } @media screen and (max-width: 767px) { .before-after-list ul li { width: 100% !important; } } .before-after-wrapper { overflow: hidden; border-radius: 20px; } .before-after-wrapper::before { content: "After"; position: absolute; inset-block-start: 10px; inset-inline-start: 10px; color: hsl(var(--white)); z-index: 2; background: var(--main-eight-600); padding: 5px 22px; border-radius: 8px; font-family: var(--tj-ff-heading); font-weight: var(--tj-fw-sbold); font-size: 18px; cursor: pointer; } .before-after-wrapper::after { content: "Before"; position: absolute; inset-block-start: 10px; inset-inline-end: 10px; color: var(--tj-color-common-white); z-index: 1; background: hsl(var(--white)); padding: 5px 22px; border-radius: 8px; font-family: var(--tj-ff-heading); font-weight: var(--tj-fw-sbold); font-size: 18px; cursor: pointer; } .before-after-wrapper img { max-width: inherit; height: 570px; object-fit: cover; } .before-after-wrapper div:nth-of-type(3) div div { background: var(--main-eight-600) !important; } .before-after-wrapper div:nth-of-type(3) div div span { position: relative; z-index: 1; } .before-after-wrapper div:nth-of-type(3) div div span::before { content: "\e138"; position: absolute; top: 50%; left: -30px; font-family: "Phosphor-Bold" !important; color: hsl(var(--white)); font-size: 24px; transform: translateY(-57%); font-weight: 600; } .before-after-wrapper div:nth-of-type(3) div div span::after { content: "\e13a"; position: absolute; top: 50%; right: -30px; font-family: "Phosphor-Bold" !important; color: hsl(var(--white)); font-size: 24px; transform: translateY(-57%); font-weight: 600; } .before-after-shape-2 { inset-block-start: 18%; animation: bounce-y 5s forwards infinite alternate; } .faq-two-area { background: rgba(1, 100, 225, 0.06); } @media screen and (max-width: 1199px) { .faq-two-thumb { margin-block-end: 30px; } } @media screen and (max-width: 1199px) { .faq-two-left { margin-block-end: 50px; } } @media screen and (max-width: 1199px) { .faq-two-wrapper { margin-inline-start: 0; } } .faq-two-accordion-item { background: hsl(var(--white)); padding-inline: 0 0; margin-bottom: 18px; border-radius: 30px !important; padding-block: 2px; border: none !important; } .faq-two-accordion-button { font-size: 20px; font-weight: 500; font-family: var(--body-font); background: transparent !important; padding-left: 0; padding-right: 0; border-radius: 30px 30px 0 0 !important; padding-inline: 30px 23px; border-bottom: 1px solid transparent !important; padding-block: 16px; } .faq-two-accordion-button::after { width: 30px; height: 30px; margin-left: auto; content: "+"; transition: var(--bs-accordion-btn-icon-transition); font-size: 20px; background-image: none; font-weight: 400; transition: 0.4s; position: absolute; right: 10px; top: 14px; display: inline-flex !important; justify-content: center; align-items: center; background: hsl(var(--white)); border: 1px solid rgba(4, 27, 52, 0.1); border-radius: 50%; } .faq-two-accordion-button:not(.collapsed) { color: var(--main-eight-600); background: transparent !important; box-shadow: none !important; margin-block-start: -2px; border-bottom: 1px solid rgba(102, 102, 102, 0.15) !important; } .faq-two-accordion-button:not(.collapsed)::after { background-image: none; content: "-"; background: var(--main-eight-600); transform: none; transition: 0.4s; color: hsl(var(--white)); } .faq-two-accordion-button:focus { box-shadow: none !important; border: none; } .faq-two-accordion-body { padding-inline: 30px 23px; padding-block: 26px 30px; } .faq-two-accordion-body p { font-size: 14px; color: #666; } .faq-ip-area .accordion-item { box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.1); } .faq-ip-area .faq-two-left-contact { box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.1); } .product-three-wrapper { background: rgba(1, 100, 225, 0.06); border-radius: 0 0 15px 15px; } .product-three-wrapper:hover .product-three-button { inset-block-end: 20px; } .product-three-wrapper:hover .product-three-action button { transform: translateX(0); visibility: visible; opacity: 1; } .product-three-action { position: absolute; top: 40px; right: 20px; } .product-three-action a, .product-three-action button { width: 40px; height: 40px; line-height: 1; display: inline-flex; align-items: center; justify-content: center; background-color: #FFFFFF; box-shadow: 0px 1px 3px rgba(3, 4, 28, 0.12); position: relative; margin-bottom: 6px; transform: translateX(100%); opacity: 0; visibility: hidden; transition: all 0.3s ease-in-out; border-radius: 8px; margin-bottom: 11px; } .product-three-action a::before, .product-three-action button::before { content: ""; position: absolute; width: 100%; height: 100%; inset-block-start: 0; inset-inline-start: 0; border-radius: 8px; background: var(--main-eight-600); transition: 0.4s; opacity: 0; visibility: hidden; } .product-three-action a:hover::before, .product-three-action button:hover::before { opacity: 1; visibility: visible; } .product-three-action a:hover span img, .product-three-action button:hover span img { filter: brightness(0) invert(1); } .product-three-action a svg, .product-three-action button svg { transform: translateY(-2px); transition: 0.3s; } .product-three-action a:nth-child(1), .product-three-action button:nth-child(1) { transition-delay: 0.14s; } .product-three-action a:nth-child(2), .product-three-action button:nth-child(2) { transition-delay: 0.12s; } .product-three-action a:nth-child(3), .product-three-action button:nth-child(3) { transition-delay: 0.1s; } .product-three-action a:nth-child(4), .product-three-action button:nth-child(4) { transition-delay: 0s; } .product-three-action-btn { position: relative; } .product-three-action-btn .product-three-action-tooltip { position: absolute; top: 50%; transform: translateY(-50%); right: 90%; font-weight: 500; font-size: 12px; color: hsl(var(--white)); background-color: var(--main-eight-600); z-index: 1; display: inline-block; width: max-content; line-height: 1; padding: 4px 8px; margin-right: 8px; visibility: hidden; opacity: 0; transition: 0.4s; } .product-three-action-btn .product-three-action-tooltip::after { position: absolute; content: ""; right: -8px; top: 50%; transform: translate(-50%, -50%) rotate(45deg); height: 10px; width: 10px; background-color: var(--main-eight-600); transition: 0.4s; } .product-three-action-btn img { transform: translateY(-1px); } .product-three-action-btn:hover .product-three-action-tooltip { visibility: visible; opacity: 1; right: 100%; } .product-three-thumb { border: 1px solid #ececec; border-radius: 15px; height: 290px; padding-block: 50px 0; margin-block-end: 20px; } .product-three-button { position: absolute; inset-block-end: -52px; inset-inline-start: 0; inset-inline-end: 0; transition: all 0.4s ease-in-out; } .product-three-button .tw-primary-btn .btn_inner { padding: 10px 64px 10px 40px; } .product-three-button .tw-primary-btn .btn_inner::before { width: 35px; } .product-three-button .tw-primary-btn .btn_inner .btn_icon { min-width: 35px; } .product-three-button .tw-primary-btn:hover .btn_inner::before { width: 100% !important; } .tw-cart-plus, .tw-cart-minus { width: 50px; height: 50px; line-height: 1; display: inline-flex; justify-content: center; align-items: center; color: hsl(var(--heading-color)); position: absolute; top: 0; left: 0; transition: 0.4s; border-left: 1px solid rgba(93, 50, 34, 0.1); border-right: 1px solid rgba(93, 50, 34, 0.1); } .tw-cart-plus svg, .tw-cart-minus svg { transform: translateY(-2px); } .tw-cart-plus:hover, .tw-cart-minus:hover { cursor: pointer; } .tw-cart-plus.tw-cart-plus, .tw-cart-minus.tw-cart-plus { left: auto; right: 0; } .tw-cart-plus.tw-cart-plus::after, .tw-cart-minus.tw-cart-plus::after { left: 0; right: auto; } .tw-cart-quantity { border-top: 1px solid rgba(93, 50, 34, 0.1); border-bottom: 1px solid rgba(93, 50, 34, 0.1); } .tw-cart-input[type=text] { font-size: 16px; border: none; padding: 0 0 0 72px; height: 50px; } .tw-cart-input[type=text]:focus { outline: none; } .product-details-nav-tabs { background: #f7f7f3; --bs-nav-tabs-border-width: 0; padding-block: 7px; border-radius: 10px; } .product-details-nav-link { color: #b7b7b7; font-size: 18px; font-weight: 600; } .product-details-nav-link.active { background: transparent !important; } @media screen and (max-width: 767px) { .cart-ip-wrapper { margin-block-end: 50px; } } .cart-ip-quantity { border-top: none; border-bottom: none; } .cart-ip-quantity .tw-cart-plus, .cart-ip-quantity .tw-cart-minus { width: 34px; height: 34px; top: 10px; border: 1px solid rgba(93, 50, 34, 0.1); border-radius: 50%; } .cart-ip-quantity .tw-cart-input[type=text] { padding: 0 0 0 55px; } .cart-ip-content tr { border-bottom: 1px solid rgba(60, 60, 60, 0.14); } .cart-ip-content tr td { padding: 2.8rem 0.5rem; } .cart-ip-sideber { box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.1); padding: 50px 30px; } .cart-ip-sideber-input { border: 1px solid rgba(4, 27, 52, 0.1); border-radius: 5px; height: 50px; width: 100%; padding-inline-start: 20px; padding-inline-end: 40px; } .cart-ip-sideber-button { border-bottom: 1px solid rgba(60, 60, 60, 0.14); padding-block-end: 25px; margin-block-end: 25px; } .product-thumbnail a img { max-width: 130px; width: 130px; height: 130px; } @media screen and (max-width: 767px) { .pricing-three-area .section-three-wrapper { margin-block-end: var(--size-8); } } @media screen and (max-width: 767px) { .pricing-three-main { margin-block-end: 50px; } } @media screen and (max-width: 1199px) { .pricing-three-switch-wrapper { justify-content: left !important; } } .pricing-three-check { position: absolute; display: block; cursor: pointer; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; z-index: 6; } .pricing-three-check:checked ~ .pricing-three-switch { right: 5px; left: 57.5%; transition: 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86); transition-property: left, right; transition-delay: 0.08s, 0s; } .pricing-three-switch { top: 4px; bottom: 4px; left: 5px; right: 57.5%; transition: 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86); transition-property: left, right; transition-delay: 0s, 0.08s; } .pricing-three-price-parent .pricing-three-toggler { display: inline-block; vertical-align: middle; margin-left: 10px; } .pricing-three-price-parent .pricing-three-toggle { display: inline-block; vertical-align: middle; margin-left: 10px; } .pricing-three-wrapper-full.hide { display: none; } .pricing-three-wrap { background: rgba(1, 100, 225, 0.1); border: 1px solid rgba(1, 100, 225, 0.1); margin-block-end: 30px; } .pricing-three-top { border-bottom: 1px solid rgba(4, 27, 52, 0.1); margin-block-end: 20px; padding-block-start: 10px; } .pricing-three-list.main ul li img { filter: brightness(0) invert(1); } .pricing-four-area { background: rgba(235, 96, 41, 0.05); } .pricing-four-wrapper { background: hsl(var(--white)); box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.1); padding: 30px; } @media screen and (max-width: 1399px) { .pricing-four-wrapper { padding: 50px 70px; flex-wrap: wrap; gap: var(--size-10); } } @media screen and (max-width: 575px) { .pricing-four-wrapper { padding: 50px 30px; } } .pricing-four-title span { transform: translateY(10px); color: rgba(102, 102, 102, 0.4); } .pricing-seven-area { background: #f5f4fa; padding-block-start: 382px; margin-block-start: -260px; } .pricing-seven-wrapper { box-shadow: 0 10px 40px 0 rgba(29, 31, 21, 0.1); } @media screen and (max-width: 1399px) { .pricing-seven-top { padding: 0; } } .pricing-seven-price span { color: #5f5c5a; } .pricing-seven-list li span img { filter: brightness(0) invert(1); } .pricing-seven-wrap { border: 1px solid rgba(0, 11, 26, 0.1); padding: 30px 20px 30px; } .pricing-eleven-wrapper.bg { background: linear-gradient(180deg, #afdcfd 0%, rgba(175, 220, 253, 0) 100%); } @media screen and (max-width: 991px) { .pricing-ip-area .pricing-three-main { margin-inline-start: -22px; } } @media screen and (max-width: 767px) { .pricing-ip-area .pricing-three-main { margin-inline-start: 0; } } .team-four-wrapper:hover .team-four-icon { bottom: 100%; opacity: 1; } .team-four-wrapper:hover .team-four-btn button { background: var(--main-four-600) !important; color: hsl(var(--white)); } .team-four-wrapper:hover .team-four-btn button i { transform: rotate(135deg); } .team-four-btn i { transform: rotate(0); } .team-four-icon { position: absolute; bottom: 0; right: 0; width: 40px; height: auto; padding: 15px 0; text-align: center; opacity: 0; transition: all 0.3s 0s ease-out; z-index: 1; } @media screen and (max-width: 1199px) { .team-four-shape-1 { display: none; } } @media screen and (max-width: 1199px) { .team-four-shape-2 { display: none; } } .team-five-wrapper:hover .team-five-content { border-color: var(--main-four-600); } .team-five-thumb { width: 138px; height: 138px; border-radius: 50%; display: inline-flex; padding: 5px; justify-content: center; margin: auto; position: relative; z-index: 1; } .team-five-thumb::before { content: ""; position: absolute; width: 100%; height: 100%; top: -5px; left: 0; border: 2px dashed red; border-radius: 50%; animation: rotateImg 20s infinite linear; } .team-five-content { border-top: 5px solid var(--main-four-100); border-bottom: 5px solid var(--main-four-100); padding-block: 120px 114px; margin-block-start: -69px; margin-block-end: -30px; border-radius: 5%; } .team-ip-wrapper:hover .team-four-icon { bottom: inherit; inset-block-start: 100%; opacity: 1; } .team-ip-wrapper:hover .team-four-btn button { background: var(--main-eight-600) !important; color: hsl(var(--white)); } .team-ip-wrapper:hover .team-four-btn button i { transform: rotate(0); } .team-ip-thumb { border: 1px solid rgba(4, 27, 52, 0.08); border-radius: 10px; padding: 10px; } .team-ip-icon { bottom: inherit; inset-block-start: 0; } .team-six-area { background: rgba(210, 28, 29, 0.03); } .team-six-wrapper:hover .team-six-icon { bottom: inherit; inset-block-start: 100%; opacity: 1; } .team-six-wrapper:hover .team-six-btn button { background: var(--main-six-600) !important; color: hsl(var(--white)); } .team-six-wrapper:hover .team-six-btn button i { transform: rotate(0); } .team-six-wrapper:hover .team-six-content::before { opacity: 1; visibility: visible; } .team-six-wrapper:hover .team-six-title a { color: hsl(var(--white)); } .team-six-wrapper:hover .team-six-paragraph { color: hsl(var(--white)); } .team-six-content { background: rgba(210, 28, 29, 0.06); border-radius: 10px; } .team-six-content::before { content: ""; position: absolute; width: 100%; height: 100%; inset-block-start: 0; inset-inline-start: 0; background: var(--main-six-600); z-index: -1; border-radius: 10px; opacity: 0; visibility: hidden; transition: 0.4s ease-in-out; } .team-seven-area { background: #f4f4f9; } .team-seven-wrapper:hover .team-four-btn button { background: hsl(var(--white)) !important; } .team-seven-wrapper:hover .team-four-btn button i { color: hsl(var(--heading-color)); transform: rotate(0); } .team-seven-thumb { background: #e2e2e2; padding: 18px 12px 0; text-align: center; } .team-seven-thumb img { height: 332px; } .team-nine-area { background: linear-gradient(180deg, #afdcfd 0%, rgba(175, 220, 253, 0) 100%); border-radius: 20px 20px 0 0; } .team-nine-wrapper { padding: 38px 28px 45px; } @media screen and (max-width: 1199px) { .team-nine-wrapper { margin-block-start: 0; } } .team-nine-wrapper:hover .team-nine-icon { bottom: 100%; opacity: 1; } .team-nine-wrapper:hover .team-nine-btn button { background: var(--main-eight-600) !important; color: hsl(var(--white)); } .team-nine-wrapper:hover .team-nine-btn button i { transform: rotate(0deg); } .team-nine-thumb { border-radius: 50%; } .team-nine-thumb a img { border-radius: 50%; } @media screen and (max-width: 1199px) { .team-ten-thumb a img { width: 100%; } } .team-details-wrapper { background: #f5f6f1; padding: 30px; border-radius: 20px; } @media screen and (max-width: 991px) { .team-details-wrapper { flex-wrap: wrap; gap: var(--size-12); } } .team-details-thumb img { max-width: 370px; height: 383px; object-fit: cover; } .checkout-verify-item { margin-bottom: 40px; } .checkout-verify-item:not(:last-child) { margin-bottom: 14px; } .checkout-verify-reveal { font-size: 14px; color: hsl(var(--heading-color)); margin-bottom: 0; display: inline-block; border: 1px dashed #AAB0B2; padding: 18px 40px; width: 100%; } .checkout-verify-reveal button { color: var(--main-eight-600); position: relative; } .checkout-verify-reveal button::after { position: absolute; content: ""; left: 0; bottom: 4px; width: 100%; height: 1px; background-color: var(--main-eight-600); } .checkout-btn { display: inline-block; font-size: 16px; font-weight: 500; color: hsl(var(--white)); background-color: var(--main-two-600); height: 50px; line-height: 50px; padding: 0 30px; text-align: center; } .checkout-btn:hover { background-color: hsl(var(--heading-color)); color: hsl(var(--white)); } .checkout-input { margin-bottom: 20px; } .checkout-input label { font-weight: 500; color: hsl(var(--heading-color)); padding-bottom: 10px; font-size: 14px; } .checkout-input label span { color: hsl(var(--heading-color)); } .checkout-input input, .checkout-input textarea { width: 100%; background: #FFFFFF; color: hsl(var(--heading-color)); height: 64px; border: 1px solid #E0E2E3; } .checkout-input input:focus, .checkout-input textarea:focus { border-color: var(--main-eight-600); } .checkout-input textarea { height: 200px; resize: none; padding: 25px; font-size: 14px; } .checkout-input .nice-select { height: 64px; line-height: 63px; border-radius: 0; border: 0; float: none; padding: 0 25px; font-size: 14px; } .checkout-input .nice-select::after { right: 26px; } .checkout-input .nice-select.open .list { transform: scale(1) translateY(0px); } .checkout-input .nice-select .list { margin-top: 0; border-radius: 0; transform-origin: center center; transform: scale(0.9) translateY(0px); width: 100%; padding: 12px 0; } .checkout-input .nice-select .list .option { line-height: 1.2; min-height: inherit; padding-top: 5px; padding-bottom: 5px; } .checkout-input .nice-select .list .option:hover { color: var(--main-two-600); } .checkout-option { margin-bottom: 4px; } .checkout-option-wrapper { margin-top: 10px; margin-bottom: 17px; } .checkout-option input { display: none; } .checkout-option input:checked ~ label::after { background-color: var(--main-eight-600); border-color: var(--main-eight-600); } .checkout-option input:checked ~ label::before { visibility: visible; opacity: 1; } .checkout-option label { font-size: 15px; color: hsl(var(--heading-color)); position: relative; padding-left: 26px; z-index: 1; font-weight: 300; } .checkout-option label::after { position: absolute; content: ""; top: 5px; left: 0; width: 18px; height: 18px; line-height: 16px; text-align: center; border: 1px solid rgba(6, 7, 40, 0.2); z-index: -1; transition: 0.3s; } .checkout-option label::before { position: absolute; content: "\f00c"; top: -2px; left: 5px; font-size: 11px; text-align: center; visibility: hidden; opacity: 0; color: hsl(var(--white)); transition: 0.3s; font-family: "Font Awesome 5 Pro"; } .checkout-option label a:hover { color: var(--main-eight-600); } .checkout-option label:hover { cursor: pointer; } .checkout-place { background-color: hsl(var(--white)); box-shadow: 0 11px 50px 11px rgba(1, 53, 102, 0.05); padding: 44px 50px 50px; } .checkout-place-title { font-size: 26px; font-weight: 600; margin-right: 37px; color: hsl(var(--heading-color)); margin-bottom: 32px; } .checkout-payment-item:not(:last-child) { margin-bottom: 10px; } .checkout-payment-item.paypal-payment { margin-block-end: 30px; border-bottom: 1px solid #E0E2E3; padding-block-end: 30px; } .checkout-payment-item.paypal-payment label { display: flex; align-items: center; flex-wrap: wrap; } .checkout-payment-item input { display: none; } .checkout-payment-item input:checked ~ label::before { opacity: 1; visibility: visible; } .checkout-payment-item label { font-size: 14px; position: relative; padding-left: 27px; font-weight: 500; color: hsl(var(--heading-color)); } .checkout-payment-item label:hover { cursor: pointer; } .checkout-payment-item label::after { position: absolute; content: ""; left: 0; top: 3px; width: 16px; height: 16px; border-radius: 50%; border: 1px solid var(--main-eight-600); transition: 0.3s; } .checkout-payment-item label::before { position: absolute; content: ""; left: 3px; top: 6px; width: 10px; height: 10px; border-radius: 50%; background-color: var(--main-eight-600); visibility: hidden; opacity: 0; transition: 0.3s; } .checkout-payment-item label img { margin-left: 14px; transform: translateY(1px); } .checkout-payment-item label a { margin-left: 20px; position: relative; color: var(--main-eight-600); } .checkout-payment-desc { position: relative; padding-top: 10px; display: none; } .checkout-payment-desc::after { position: absolute; content: ""; left: 57px; top: 0; width: 16px; height: 16px; background-color: #f5f6f1; transform: translateY(3px) rotate(45deg); } .checkout-payment-desc p { background-color: #f5f6f1; padding: 19px 30px; margin-left: 27px; font-size: 14px; line-height: 1.57; color: #55585B; margin-bottom: 0; } .checkout-agree { margin-bottom: 24px; } .checkout-place { background-color: var(--tp-grey-1); } .checkout-nice-select::after { border-bottom: 2px solid var(--main-eight-600); border-right: 2px solid var(--main-eight-600); } @media screen and (max-width: 991px) { .checkout-bill-area { margin-block-end: 40px; } } .checkout-bill-area input, .checkout-bill-area textarea { background: #f5f6f1 !important; border: 2px solid rgba(255, 255, 255, 0.09) !important; } .checkout-bill-area .nice-select { background: #f5f6f1 !important; border: 2px solid rgba(255, 255, 255, 0.09) !important; } .order-info-list { border: 1px solid rgba(10, 40, 3, 0.17); border-radius: 10px; } .order-info-list ul li { border-bottom: 1px solid rgba(10, 40, 3, 0.17); padding-block: 18px; padding-inline: 20px 14px; } .order-info-list ul li::before { content: ""; position: absolute; width: 1px; height: 100%; inset-block-start: 0; inset-inline-end: 120px; background: rgba(10, 40, 3, 0.17); } .order-info-list ul li:last-child { border-bottom: none; } .order-info-list ul li:last-child::before { display: none; } .return-customer { display: none; margin-top: 14px; padding: 40px 40px; background-color: #F5F6F1; border-radius: 10px; } .return-customer-input { margin-bottom: 20px; } .return-customer-input label { font-weight: 500; color: hsl(var(--heading-color)); padding-bottom: 10px; } .return-customer-input label span { color: red; } .return-customer-input input { width: 100%; background: #fff; border: 0; color: hsl(var(--heading-color)); height: 64px; transition: 0.3s; border: 1px solid #E0E2E3; padding-inline: 20px 20px; border-radius: 10px; } .return-customer-input input:focus { border: 1px solid var(--main-eight-600); } .return-customer-remeber label { font-size: 15px; color: #55585B; position: relative; padding-left: 26px; z-index: 1; } .return-customer-remeber label::after { position: absolute; content: ""; top: 6px; left: 0; width: 18px; height: 18px; line-height: 16px; text-align: center; border: 1px solid rgba(6, 7, 40, 0.2); z-index: -1; transition: 0.3s; } .return-customer-remeber label::before { position: absolute; content: "\f00c"; top: 0px; left: 5px; font-size: 10px; text-align: center; visibility: hidden; opacity: 0; color: hsl(var(--white)); transition: 0.3s; font-family: "Font Awesome 5 Pro"; } .return-customer-remeber label a:hover { color: red; } .return-customer-remeber label:hover { cursor: pointer; } .return-customer-forgot a { font-weight: 400; font-size: 15px; position: relative; display: inline-block; } .return-customer-forgot a::after { position: absolute; content: ""; left: auto; right: 0; bottom: 4px; width: 0%; height: 1px; background-color: var(--main-eight-600); } .return-customer-forgot a:hover::after { left: 0; right: auto; width: 100%; } .gallery-five-wrap { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr; gap: 20px; } @media screen and (max-width: 1199px) { .gallery-five-wrap { grid-template-columns: 1fr 1fr 1fr; } } @media screen and (max-width: 991px) { .gallery-five-wrap { grid-template-columns: 1fr 1fr; } } @media screen and (max-width: 767px) { .gallery-five-wrap { grid-template-columns: 1fr; } } .gallery-five-item:hover .gallery-five-thumb::before { opacity: 1; visibility: visible; } .gallery-five-item:hover .gallery-five-thumb img { border-color: rgba(235, 96, 41, 0.79) !important; } .gallery-five-item:hover .gallery-five-button { inset-block-start: 50%; opacity: 1; visibility: visible; } .gallery-five-thumb::before { content: ""; position: absolute; width: 100%; height: 100%; inset-block-start: 0; inset-inline-start: 0; background: rgba(235, 96, 41, 0.79); border-radius: 20px; opacity: 0; visibility: hidden; transition: all 0.4s ease-in-out; } .gallery-five-button { inset-block-start: 35%; opacity: 0; visibility: hidden; transition: all 0.4s ease-in-out; } .gallery-six-thumb { height: 100%; margin: 0 auto; position: relative; background-size: cover; background-position: center; } .gallery-six-thumb img { height: 100%; width: 100%; object-fit: cover; background-position: center; background-size: cover; margin: 0 auto; } @media screen and (max-width: 1399px) { .expert-eight-thumb { text-align: center; } } @media screen and (max-width: 1399px) { .expert-eight-thumb img { max-width: 100%; } } @media screen and (max-width: 1399px) { .expert-eight-right { margin-inline-start: 0; } }