/* CSS Index ============================================== 01. Theme Default CSS 02. Header 03. Slider 04. Banner 05. Features 06. About 07. Counter 08. Services 09. Cta 10. Team 11. Project 12. Faq 13. Work 14. Video 15. History 16. Community 17. Choose 18. Client 19. Office 20. Support 21. Consultation 22. Company 23. Testimonial 24. Shop 25. Blog 26. Brand 27. Contact 28. Footer ==============================================*/ @import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"); :root { --tg-body-font-family: "Poppins", sans-serif; --tg-heading-font-family: "Poppins", sans-serif; --tg-icon-font-family: "Font Awesome 5 Free"; --tg-body-font-size: 16px; --tg-body-line-height: 1.75; --tg-heading-line-height: 1.2; --tg-body-color: #343C4D; --tg-heading-color: #01022E; --tg-theme-primary: #a1248a; --tg-theme-secondary: #01022E; --tg-color-sky-blue: #00B2FF; --tg-color-yellow-light: #FFB930; --tg-color-yellow-light-2: #F09E24; --tg-color-red-light: #DC0000; --tg-color-white-default: #ffffff; --tg-color-gray-1: #F5F6FC; --tg-color-gray-2: #F8F9FD; --tg-color-gray-3: #E9EBEE; --tg-color-gray-4: #E9EBF8; --tg-color-gray-5: #E8E8E8; --tg-color-gray-6: #BCBCBC; --tg-color-gray-7: #9597C8; --tg-color-gray-8: #EFF0F4; --tg-color-gray-9: #8C919C; --tg-color-gray-10: #EFF1FA; --tg-color-gray-11: #667594; --tg-color-gray-12: #F0F0F0; --tg-color-gray-13: #F8F8F8; --tg-color-dark: #121212; --tg-color-dark-2: #040426; --tg-color-gradient: linear-gradient(90deg, #C3D4FF 0%, #0047FF 100%); --tg-border-1: #555C6A; --tg-border-2: #E6E7F3; --tg-border-3: #737373; --tg-border-4: #B8B9DA; --tg-border-5: #DCDCDC; --tg-border-6: #CFDDE2; --tg-border-7: #D1D4E3; --tg-border-8: #EAEAEA; --tg-border-9: #DADADA; --tg-border-10: #DBDEED; --tg-border-11: #D2D7E1; --tg-border-12: #EBEBEB; --tg-border-13: #D3D5E2; --tg-border-14: #E0E1E9; --tg-fw-extra-bold: 800; --tg-fw-bold: 700; --tg-fw-semi-bold: 600; --tg-fw-medium: 500; --tg-fw-regular: 400; --tg-fw-light: 300; } /*============================= Typography css start ===============================*/ body { font-family: var(--tg-body-font-family); font-size: var(--tg-body-font-size); font-weight: var(--tg-fw-regular); color: var(--tg-body-color); line-height: var(--tg-body-line-height); } img, .img { max-width: 100%; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } a, button { color: var(--tg-theme-primary); outline: none; text-decoration: none; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } a:focus, .btn:focus, .button:focus { text-decoration: none; outline: none; -webkit-box-shadow: none; -moz-box-shadow: none; -ms-box-shadow: none; -o-box-shadow: none; box-shadow: none; } a:hover, button:hover { color: var(--tg-theme-primary); text-decoration: none; } button:focus, input:focus, input:focus, textarea, textarea:focus { outline: 0; } h1, h2, h3, h4, h5, h6 { font-family: var(--tg-heading-font-family); color: var(--tg-heading-color); margin-top: 0px; font-weight: var(--tg-fw-bold); line-height: var(--tg-heading-line-height); text-transform: unset; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: inherit; } h1 { font-size: 2.5rem; } h2 { font-size: 2rem; } h3 { font-size: 1.75rem; } h4 { font-size: 1.5rem; } h5 { font-size: 1.25rem; } h6 { font-size: 1rem; } .list-wrap { margin: 0px; padding: 0px; } .list-wrap li { list-style: none; } p { margin-bottom: 15px; } hr { border-bottom: 1px solid var(--tg-common-color-gray); border-top: 0 none; margin: 30px 0; padding: 0; } label { color: var(--tg-heading-color); cursor: pointer; font-size: var(--tg-body-font-size); font-weight: var(--tg-fw-regular); } input[type=color] { appearance: none; -moz-appearance: none; -webkit-appearance: none; background: none; border: 0; cursor: pointer; height: 100%; width: 100%; padding: 0; border-radius: 50%; } @media (max-width: 991.98px) { .mb-md-30 { margin-bottom: 30px; } } body.theme-gray { background-color: var(--tg-color-gray-1); } body.theme-gray-two { background-color: var(--tg-color-gray-2); } *::-moz-selection { background: var(--tg-theme-primary); color: var(--tg-color-white-default); text-shadow: none; } ::-moz-selection { background: var(--tg-theme-primary); color: var(--tg-color-white-default); text-shadow: none; } ::selection { background: var(--tg-theme-primary); color: var(--tg-color-white-default); text-shadow: none; } /*============================= - Input Placeholder ===============================*/ input, textarea { color: var(--tg-body-color); } *::-moz-placeholder { color: var(--tg-body-color); font-size: var(--tg-body-font-size); opacity: 1; } *::placeholder { color: var(--tg-body-color); font-size: var(--tg-body-font-size); opacity: 1; } textarea, input { width: 100%; background: var(--tg-color-white-default); border: 1px solid var(--tg-border-7); -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; font-size: 15px; color: var(--tg-heading-color); padding: 11px 18px; height: 50px; display: block; } textarea::placeholder, input::placeholder { font-size: 15px; color: var(--tg-body-color); } textarea { min-height: 98px; max-height: 98px; } /*============================= - Common Classes ===============================*/ .fix { overflow: hidden; } .clear { clear: both; } /*============================= - Bootstrap Custom =============================*/ .container { padding-left: 12px; padding-right: 12px; } .row { --bs-gutter-x: 24px; } .gutter-y-30 { --bs-gutter-y: 30px; } .gutter-y-24 { --bs-gutter-y: 24px; } .gutter-y-20 { --bs-gutter-y: 20px; } .gx-0 { --bs-gutter-x: 0; } .gutter-20 { --bs-gutter-x: 20px; } .gutter-24 { --bs-gutter-x: 24px; } .p-relative { position: relative; } .container { max-width: 1250px; } @media (max-width: 1500px) { .container { max-width: 1250px; } } @media (max-width: 1199.98px) { .container { max-width: 960px; } } @media (max-width: 991.98px) { .container { max-width: 720px; } } @media (max-width: 767.98px) { .container { max-width: 100%; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .container { max-width: 540px; } } .custom-container { max-width: 1754px; } @media (max-width: 1800px) { .custom-container { max-width: 1680px; } } @media (max-width: 1500px) { .custom-container { max-width: 1320px; } } @media (max-width: 1199.98px) { .custom-container { max-width: 960px; } } @media (max-width: 991.98px) { .custom-container { max-width: 720px; } } @media (max-width: 767.98px) { .custom-container { max-width: 100%; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .custom-container { max-width: 540px; } } .custom-container-two { max-width: 1664px; } @media (max-width: 1800px) { .custom-container-two { max-width: 1570px; } } @media (max-width: 1500px) { .custom-container-two { max-width: 1320px; } } @media (max-width: 1199.98px) { .custom-container-two { max-width: 960px; } } @media (max-width: 991.98px) { .custom-container-two { max-width: 720px; } } @media (max-width: 767.98px) { .custom-container-two { max-width: 100%; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .custom-container-two { max-width: 540px; } } .custom-container-three { max-width: 1640px; } @media (max-width: 1800px) { .custom-container-three { max-width: 1570px; } } @media (max-width: 1500px) { .custom-container-three { max-width: 1320px; } } @media (max-width: 1199.98px) { .custom-container-three { max-width: 960px; } } @media (max-width: 991.98px) { .custom-container-three { max-width: 720px; } } @media (max-width: 767.98px) { .custom-container-three { max-width: 100%; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .custom-container-three { max-width: 540px; } } .custom-container-four { max-width: 1876px; } @media (max-width: 1800px) { .custom-container-four { max-width: 1570px; } } @media (max-width: 1500px) { .custom-container-four { max-width: 100%; } } @media (max-width: 1199.98px) { .custom-container-four { max-width: 960px; } } @media (max-width: 991.98px) { .custom-container-four { max-width: 720px; } } @media (max-width: 767.98px) { .custom-container-four { max-width: 100%; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .custom-container-four { max-width: 540px; } } .custom-container-five { max-width: 1548px; } @media (max-width: 1800px) { .custom-container-five { max-width: 1548px; } } @media (max-width: 1500px) { .custom-container-five { max-width: 1320px; } } @media (max-width: 1199.98px) { .custom-container-five { max-width: 960px; } } @media (max-width: 991.98px) { .custom-container-five { max-width: 720px; } } @media (max-width: 767.98px) { .custom-container-five { max-width: 100%; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .custom-container-five { max-width: 540px; } } .include-bg { background-position: center; background-size: cover; background-repeat: no-repeat; } /*============================= Button style ===============================*/ .tg-button-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; } .tg-btn { user-select: none; -moz-user-select: none; background: var(--tg-theme-primary) none repeat scroll 0 0; color: var(--tg-color-white-default); cursor: pointer; display: inline-flex; align-items: center; font-size: 15px; font-weight: var(--tg-fw-semi-bold); letter-spacing: 0; line-height: 1; margin-bottom: 0; padding: 18px 25px; text-align: center; text-transform: capitalize; touch-action: manipulation; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; vertical-align: middle; -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; white-space: nowrap; overflow: hidden; border-radius: 100px; --arrow-hover-move-x: -110%; gap: 10px; z-index: 1; position: relative; border: none; } .tg-btn svg { transition: all 0.3s ease-out 0s; } .tg-btn svg path { transition: transform 0.38s cubic-bezier(0.37, 0.08, 0.02, 0.93), opacity 0.18s ease-out; } .tg-btn svg path:nth-of-type(1) { transform: translateX(0); opacity: 1; transition-delay: 0.15s, 0.15s; } .tg-btn svg path:nth-of-type(2) { transform: translateX(calc(1 * var(--arrow-hover-move-x))); opacity: 0.5; transition-delay: 0s, 0s; } .tg-btn::before { content: ""; position: absolute; -webkit-transition-duration: 800ms; transition-duration: 800ms; width: 200%; height: 200%; top: 110%; left: 50%; background: var(--tg-theme-secondary); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; z-index: -1; } .tg-btn:hover, .tg-btn:focus-visible { background: var(--tg-theme-primary); color: var(--tg-color-white-default); border-color: var(--tg-theme-primary); } .tg-btn:hover svg path:nth-of-type(1), .tg-btn:focus-visible svg path:nth-of-type(1) { transform: translateX(calc(-1 * var(--arrow-hover-move-x))); opacity: 0; transition-delay: 0s, 0s; } .tg-btn:hover svg path:nth-of-type(2), .tg-btn:focus-visible svg path:nth-of-type(2) { transform: translateX(0); opacity: 1; transition-delay: 0.15s, 0.15s; } .tg-btn:hover::before, .tg-btn:focus-visible::before { top: -40%; } .tg-btn.white-btn { background: var(--tg-color-white-default); color: var(--tg-theme-secondary); } .tg-btn.white-btn svg path { stroke: var(--tg-theme-secondary); } .white-btn-two { background: var(--tg-color-white-default); color: var(--tg-theme-primary); } .white-btn-two::before { background: var(--tg-theme-primary); } .white-btn-two:hover { color: var(--tg-color-white-default); background: var(--tg-color-white-default); } .tg-hover-btn::before { background: var(--tg-color-sky-blue); } .tg-btn-two { background: var(--tg-color-gray-1); color: var(--tg-body-color); } .tg-btn-two svg { color: var(--tg-theme-primary); } .tg-btn-two::before { background: var(--tg-theme-primary); } .tg-btn-two:hover { color: var(--tg-color-white-default); background: var(--tg-color-gray-1); } .tg-btn-two:hover svg { color: var(--tg-color-white-default); } .tg-btn-three { -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; } .tg-btn-four { background: transparent; border-radius: 8px; border: 1px solid var(--tg-color-white-default); padding: 17px 25px; --arrow-hover-move-x: 110%; --arrow-hover-move-y: 100%; } .tg-btn-four svg path:nth-of-type(1) { transform: translateX(0) translateY(0); } .tg-btn-four svg path:nth-of-type(2) { transform: translateX(calc(-1 * var(--arrow-hover-move-x))) translateY(var(--arrow-hover-move-y)); } .tg-btn-four:hover, .tg-btn-four:focus-visible { background: var(--tg-theme-primary); color: var(--tg-color-white-default); border-color: var(--tg-theme-primary); } .tg-btn-four:hover svg path:nth-of-type(1), .tg-btn-four:focus-visible svg path:nth-of-type(1) { transform: translateX(var(--arrow-hover-move-x)) translateY(calc(-1 * var(--arrow-hover-move-y))); } .tg-btn-four:hover svg path:nth-of-type(2), .tg-btn-four:focus-visible svg path:nth-of-type(2) { transform: translateX(0) translateY(0); } .tg-btn-four::before { display: none; } .tg-btn-five { border-color: var(--tg-theme-primary); color: var(--tg-theme-primary); } .tg-btn-six { background: var(--tg-theme-primary); border: none; gap: 40px; padding: 18px 24px; } .tg-btn-six::after { content: ""; position: absolute; right: 54px; top: 50%; transform: translateY(-50%); width: 1px; height: 18px; background: var(--tg-color-white-default); -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .tg-btn-six::before { display: block; } .tg-btn-seven { -webkit-border-radius: 4px 12px; -moz-border-radius: 4px 12px; -o-border-radius: 4px 12px; -ms-border-radius: 4px 12px; border-radius: 4px 12px; } .tg-btn-eight { -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; padding: 18px 24px; } .tg-border-btn { border: 1px solid var(--tg-color-white-default); background: transparent; color: var(--tg-color-white-default); padding: 17px 25px; } .tg-border-btn:hover { background: var(--tg-theme-secondary); color: var(--tg-color-white-default); border-color: var(--tg-theme-secondary); } .tg-border-btn::before { display: none; } .tg-border-btn-two { background: transparent; border: 1px solid var(--tg-theme-primary); color: var(--tg-theme-primary); } .tg-border-btn-two::after { background: var(--tg-theme-primary); } .tg-border-btn-two::before { display: none; } .tg-border-btn-two:hover::after { background: var(--tg-color-white-default); } .tg-btn-lavender { background: var(--tg-color-gray-1); color: var(--tg-theme-primary); } .tg-btn-lavender::after { background: var(--tg-theme-primary); } .tg-btn-lavender::before { background: var(--tg-theme-secondary); } .tg-btn-lavender:hover { background: var(--tg-color-gray-1); color: var(--tg-color-white-default); } .tg-btn-lavender:hover::after { background: var(--tg-color-white-default); } .link-btn { display: inline-flex; align-items: center; gap: 12px; font-size: 15px; font-weight: 600; color: var(--tg-body-color); } /*============================= 00. Preloader ===============================*/ .preloader { position: fixed; left: 0; right: 0; top: 0; bottom: 0; z-index: 999; background-color: var(--tg-color-white-default); display: flex; align-items: center; justify-content: center; } .preloader-inner { display: block; width: 45px; height: 45px; } .preloader-inner span { box-sizing: border-box; display: block; position: absolute; width: 37px; height: 37px; margin: 4px; border: 4px solid transparent; border-radius: 50%; animation: preloader 1s cubic-bezier(0.5, 0, 0.5, 1) infinite; border-color: var(--tg-theme-primary) transparent transparent transparent; } .preloader-inner span:nth-child(1) { animation-delay: -0.1s; } .preloader-inner span:nth-child(2) { animation-delay: -0.2s; } .preloader-inner span:nth-child(3) { animation-delay: -0.3s; } @-webkit-keyframes preloader { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @keyframes preloader { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /*============================= - Background color ===============================*/ .grey-bg { background: var(--tg-color-gray-4); } .grey-bg-two { background: var(--tg-color-gray-2); } .grey-bg-three { background: var(--tg-border-5); } .white-bg { background: var(--tg-color-white-default); } .black-bg { background: var(--tg-common-color-black); } /*============================= OffCanvas ===============================*/ .offCanvas-menu { position: relative; width: 30px; height: 21px; } .offCanvas-menu .menu-tigger { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-direction: column; gap: 6px; } .offCanvas-menu .menu-tigger span { width: 30px; height: 3px; background: var(--tg-border-1); border-radius: 5px; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .offCanvas-menu .menu-tigger span:nth-child(2) { width: 18px; } .offCanvas-menu .menu-tigger:hover span { background: var(--tg-theme-primary); } .offCanvas-menu .menu-tigger:hover span:nth-child(2) { width: 30px; } .offCanvas-menu-two { margin-right: 0; padding-right: 0; padding-left: 40px; } .offCanvas-menu-two::before { right: auto; left: 0; height: 104px; } .offCanvas-menu-three { width: 95px; height: auto; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; border-right: 1px solid #DEE0EB; } @media (max-width: 1199.98px) { .offCanvas-menu-three { display: none; } } .offCanvas__info { background: var(--tg-color-white-default) none repeat scroll 0 0; height: 100%; padding: 55px 50px; position: fixed; left: 0; top: 0; transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); -moz-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); -webkit-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); -ms-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); -o-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); width: 400px; z-index: 999; overflow-y: scroll; -webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); -ms-transform: translateX(-100%); -o-transform: translateX(-100%); transform: translateX(-100%); } .offCanvas__info.active { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); } .offCanvas__info::-webkit-scrollbar { width: 0px; } .offCanvas__close-icon { position: absolute; left: 0; top: 0; } .offCanvas__close-icon button { width: 45px; height: 45px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-theme-primary); border: 0 none; color: var(--tg-color-white-default); cursor: pointer; font-size: 20px; padding: 0; } .offCanvas__close-icon button:hover { background: var(--tg-theme-secondary); color: var(--tg-color-white-default); } .offCanvas__logo { text-align: center; margin-bottom: 40px; } .offCanvas__logo img { max-height: 34px; } .offCanvas__content { margin-bottom: 35px; } .offCanvas__content p { margin-bottom: 0; text-align: center; } .offCanvas__img { margin-bottom: 40px; } .offCanvas__img .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; } .offCanvas__side-info .contact-list { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: flex-start; gap: 15px; margin-bottom: 20px; } .offCanvas__side-info .contact-list:last-child { margin-bottom: 0; } .offCanvas__side-info .contact-list i { font-size: 24px; color: var(--tg-theme-primary); transform: translateY(1px); } .offCanvas__side-info .contact-list a, .offCanvas__side-info .contact-list p { color: var(--tg-body-color); margin: 0; line-height: 24px; font-size: 17px; } .offCanvas__side-info .contact-list a { font-weight: 500; } .offCanvas__side-info .contact-list a:hover { color: var(--tg-theme-primary); } .offCanvas__social { text-align: center; padding-top: 45px; margin-top: 45px; border-top: 1px solid #D9D9D9; } .offCanvas__social .title { margin-bottom: 18px; font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: 2.8px; color: var(--tg-border-1); } .offCanvas__social .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; gap: 22px; } .offCanvas__social .list-wrap li { line-height: 1; } .offCanvas__social .list-wrap li a { color: var(--tg-border-1); display: block; } .offCanvas__social .list-wrap li a svg { width: 20px; height: 20px; } .offCanvas__social .list-wrap li a:hover { color: var(--tg-theme-primary); } .offCanvas__overly { position: fixed; background: #000; top: 0; left: 0; height: 100%; width: 100%; z-index: 99; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .offCanvas__overly.active { opacity: 0.7; visibility: visible; } /*========================= Breadcrumb ===========================*/ .breadcrumb__area { position: relative; z-index: 1; padding: 110px 0; } @media (max-width: 991.98px) { .breadcrumb__area { padding: 90px 0; } } .breadcrumb__bg { background-size: cover; background-position: center; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1; background-blend-mode: luminosity; background-color: var(--tg-color-white-default); } .breadcrumb__bg::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: linear-gradient(90deg, #01022E 0%, rgba(1, 2, 46, 0.5) 102.5%); z-index: -1; } .breadcrumb__content .title { margin-bottom: 12px; font-size: 40px; text-transform: capitalize; line-height: 1; color: var(--tg-color-white-default); } @media (max-width: 1199.98px) { .breadcrumb__content .title { font-size: 36px; } } @media (max-width: 767.98px) { .breadcrumb__content .title { font-size: 34px; } } .breadcrumb__content .breadcrumb { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; margin-bottom: 0; gap: 6px; } .breadcrumb__content .breadcrumb > * { font-size: 15px; color: var(--tg-theme-primary); font-weight: 500; text-transform: capitalize; } .breadcrumb__content .breadcrumb > * a { color: #939AC6; } .breadcrumb__content .breadcrumb > * a:hover { color: var(--tg-theme-primary); } .breadcrumb__content .breadcrumb .breadcrumb-separator { line-height: 1; font-size: 16px; font-weight: 700; color: #939AC6; } /*============================= 00. Scroll Top ===============================*/ .scroll__top { width: 50px; height: 50px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; position: fixed; bottom: -10%; right: 50px; font-size: 16px; border-radius: 50%; z-index: 99; color: var(--tg-color-white-default); text-align: center; cursor: pointer; background: var(--tg-theme-primary); transition: 1s ease; border: none; } @media (max-width: 1199.98px) { .scroll__top { right: 25px; bottom: 25px; } } @media (max-width: 991.98px) { .scroll__top { right: 30px; } } @media (max-width: 767.98px) { .scroll__top { right: 15px; width: 35px; height: 35px; font-size: 14px; } } .scroll__top.open { bottom: 30px; } @media (max-width: 767.98px) { .scroll__top.open { bottom: 15px; } } .scroll__top::after { position: absolute; z-index: -1; content: ""; top: 100%; left: 5%; height: 10px; width: 90%; opacity: 1; background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 80%); } .scroll__top:hover { background: var(--tg-theme-secondary); border-color: var(--tg-theme-secondary); color: var(--tg-color-white-default); } /*============================= 00. Section Title ===============================*/ .section__title { position: relative; } .section__title .sub-title { display: block; text-transform: uppercase; font-size: 15px; font-weight: 500; line-height: 1.4; color: var(--tg-theme-primary); margin-bottom: 12px; } .section__title .title { font-size: 36px; line-height: 1.2; margin: 0 0; text-transform: capitalize; font-weight: 700; } @media (max-width: 767.98px) { .section__title .title { font-size: 30px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .section__title .title { font-size: 34px; } } .section__title .title span { font-weight: 500; } @media (max-width: 991.98px) { .section__title .title br { display: none; } } .section__title .title svg { color: var(--tg-theme-primary); } .section__title p { margin-bottom: 0; margin-top: 15px; } @media (max-width: 767.98px) { .section__title p br { display: none; } } .section__title.white-title .sub-title { color: var(--tg-color-white-default); } .section__title.white-title .title { color: var(--tg-color-white-default); } .section__title.white-title p { color: #ACAACC; } .section__title.white-title-two p { color: var(--tg-color-gray-4); } .section__title-semiBold .title { font-weight: 600; } .section__title-two .title { font-size: 40px; } @media (max-width: 767.98px) { .section__title-two .title { font-size: 30px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .section__title-two .title { font-size: 34px; } } .section__content { margin-left: 115px; } @media (max-width: 1199.98px) { .section__content { margin-left: 60px; } } @media (max-width: 991.98px) { .section__content { margin-left: 0; } } .section__content p { margin-bottom: 0; } .section__content.white-content p { color: var(--tg-color-white-default); } @media (max-width: 991.98px) { .section__title.mb-70, .section__title.mb-60 { margin-bottom: 40px; } } /*============================= Mobile Menu ===============================*/ .tgmobile__search { padding: 0 20px 25px 25px; } .tgmobile__search form { position: relative; } .tgmobile__search input { display: block; width: 100%; border: none; padding: 10px 45px 10px 20px; font-size: 15px; height: 45px; background: var(--tg-color-gray-2); color: var(--tg-heading-color); -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; } .tgmobile__search input::placeholder { font-size: 15px; color: var(--tg-body-color); } .tgmobile__search button { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); border: none; padding: 0; right: 20px; line-height: 1; background: transparent; color: var(--tg-heading-color); } .tgmobile__menu { position: fixed; right: 0; top: 0; width: 300px; padding-right: 30px; max-width: 100%; height: 100%; z-index: 99; border-radius: 0px; transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); -moz-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); -webkit-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); -ms-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86) e; -o-transition: all 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86); -webkit-transform: translateX(101%); -moz-transform: translateX(101%); -ms-transform: translateX(101%); -o-transform: translateX(101%); transform: translateX(101%); } .tgmobile__menu .navbar-collapse { display: block !important; } .tgmobile__menu .nav-logo { position: relative; padding: 30px 25px; text-align: left; } .tgmobile__menu .nav-logo img { max-width: 150px; } .tgmobile__menu .navigation { position: relative; display: block; width: 100%; float: none; margin: 0; padding: 0; } .tgmobile__menu .navigation li { position: relative; display: block; border-top: 1px solid rgba(0, 0, 0, 0.1); } .tgmobile__menu .navigation li.active > a { color: var(--tg-theme-primary); } .tgmobile__menu .navigation li.menu-item-has-children .dropdown-btn { position: absolute; right: 20px; top: 6px; width: 32px; height: 32px; text-align: center; font-size: 16px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; color: var(--tg-heading-color); background: var(--tg-color-gray-1); cursor: pointer; border-radius: 0; -webkit-transition: all 500ms ease; -o-transition: all 500ms ease; transition: all 500ms ease; z-index: 5; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; } .tgmobile__menu .navigation li.menu-item-has-children .dropdown-btn::after { content: ""; position: absolute; right: -20px; top: -6px; width: 300px; height: 46px; } .tgmobile__menu .navigation li.menu-item-has-children .dropdown-btn .plus-line { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%) rotate(0); -ms-transform: translate(-50%, -50%) rotate(0); transform: translate(-50%, -50%) rotate(0); border-radius: 10px; width: 12px; height: 2px; background-color: var(--tg-theme-secondary); -webkit-transition: all 500ms ease; -o-transition: all 500ms ease; transition: all 500ms ease; } .tgmobile__menu .navigation li.menu-item-has-children .dropdown-btn .plus-line::after { content: ""; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%) rotate(0); -ms-transform: translate(-50%, -50%) rotate(0); transform: translate(-50%, -50%) rotate(0); border-radius: 10px; width: 2px; height: 12px; background-color: var(--tg-theme-secondary); -webkit-transition: all 500ms ease; -o-transition: all 500ms ease; transition: all 500ms ease; } .tgmobile__menu .navigation li.menu-item-has-children .dropdown-btn.open { background-color: var(--tg-theme-primary); } .tgmobile__menu .navigation li.menu-item-has-children .dropdown-btn.open .plus-line { background-color: var(--tg-color-white-default); } .tgmobile__menu .navigation li.menu-item-has-children .dropdown-btn.open .plus-line::after { display: none; } .tgmobile__menu .navigation li > a { position: relative; display: block; padding: 10px 55px 10px 20px; font-size: 15px; font-weight: 600; color: var(--tg-heading-color); text-transform: uppercase; -webkit-transition: all 500ms ease; -o-transition: all 500ms ease; transition: all 500ms ease; border: none; } .tgmobile__menu .navigation li > a::before { content: ""; position: absolute; left: 0; top: 0; height: 0; -webkit-transition: all 500ms ease; -o-transition: all 500ms ease; transition: all 500ms ease; width: 2px; background: var(--tg-theme-primary); pointer-events: none; } .tgmobile__menu .navigation li ul li > a { margin-left: 20px; text-transform: capitalize; } .tgmobile__menu .navigation li ul li ul li a { margin-left: 20px; } .tgmobile__menu .navigation li ul li ul li ul li a { margin-left: 60px; } .tgmobile__menu .navigation li > ul { display: none; } .tgmobile__menu .navigation li > ul > li > ul { display: none; } .tgmobile__menu .navigation ul { padding: 0; margin: 0; } .tgmobile__menu .navigation ul li a { display: block; } .tgmobile__menu .navigation ul li ul li > a { font-size: 16px; margin-left: 20px; text-transform: capitalize; } .tgmobile__menu .navigation:last-child { border-bottom: 1px solid rgba(0, 0, 0, 0.1); } .tgmobile__menu .navigation > li > ul > li:first-child { border-top: 1px solid rgba(0, 0, 0, 0.1); } @media (max-width: 991.98px) { .tgmobile__menu .navigation > li > ul > li:first-child { border: none; } } .tgmobile__menu .navigation > li.active > a::before { height: 100%; } .tgmobile__menu .close-btn { position: absolute; right: 15px; top: 28px; line-height: 30px; width: 35px; text-align: center; font-size: 14px; color: var(--tg-theme-primary); cursor: pointer; padding: 8px; z-index: 10; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; } .tgmobile__menu .close-btn i[class^=flaticon-]:before { font-weight: var(--tg-fw-bold) !important; } .tgmobile__menu-backdrop { position: fixed; right: 0; top: 0; width: 100%; height: 100%; z-index: 2; transition: all 700ms ease; -moz-transition: all 700ms ease; -webkit-transition: all 700ms ease; -ms-transition: all 700ms ease; -o-transition: all 700ms ease; opacity: 0; visibility: hidden; background: rgba(0, 0, 0, 0.5); } .tgmobile__menu .social-links ul { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; position: relative; text-align: center; padding: 30px 20px 20px; align-items: center; justify-content: center; flex-wrap: wrap; } .tgmobile__menu .social-links ul li { position: relative; display: inline-block; margin: 0px 6px 10px; } .tgmobile__menu .social-links ul li a { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; position: relative; line-height: 32px; font-size: 16px; color: var(--tg-theme-secondary); -webkit-transition: all 500ms ease; -o-transition: all 500ms ease; transition: all 500ms ease; border: 1px solid #efefef; border-radius: 5px; } .tgmobile__menu .social-links ul li a:hover { border-color: var(--tg-theme-primary); background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .tgmobile__menu .tgmenu__action { padding: 0 0; margin: 0 0; } .tgmobile__menu .tgmenu__action > ul { margin: 0 0; padding: 30px 20px 0; justify-content: center; gap: 0 15px; } .tgmobile__menu .tgmenu__action > ul li { margin: 0 0; } .tgmobile__menu .tgmenu__action > ul .header-btn { display: block; } .tgmobile__menu-box { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; max-height: 100%; overflow-y: auto; overflow-x: hidden; background: var(--tg-color-white-default); padding: 0px 0px; z-index: 5; box-shadow: -9px 0 14px 0px rgba(0, 0, 0, 0.06); } .tgmobile__menu-outer .mobile-nav-toggler { position: relative; float: right; font-size: 40px; line-height: 50px; cursor: pointer; display: none; color: var(--tg-color-white-default); margin-right: 30px; top: 15px; } .mobile-menu-visible { overflow: hidden; } .mobile-menu-visible .tgmobile__menu { -webkit-transform: translateX(0%); -moz-transform: translateX(0%); -ms-transform: translateX(0%); -o-transform: translateX(0%); transform: translateX(0%); } .mobile-menu-visible .tgmobile__menu-backdrop { opacity: 1; visibility: visible; } .mobile-menu-visible .tgmobile__menu .close-btn { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } .tgmenu__navbar-wrap ul li .tg-mega-menu-wrap-two { width: 560px !important; display: flex !important; align-items: flex-start !important; padding: 40px 0 !important; } .tgmenu__navbar-wrap ul li .tg-mega-menu-wrap-two > li { border-right: 1px solid #e5e5e5; } .tgmenu__navbar-wrap ul li .tg-mega-menu-wrap-two > li:last-child { border: none; } .mega-sub-menu { display: flex !important; flex-direction: column !important; min-width: 260px !important; margin-left: 10px !important; } @media (max-width: 991.98px) { .mega-sub-menu { margin-left: 0 !important; } } .mega-sub-menu > li > a { display: flex !important; align-items: center; gap: 5px; } .mega-sub-menu > li > a .badge { display: block; padding: 0.5em 0.5em 0.5em 0.5em; font-size: 10px; font-weight: 500; text-transform: uppercase; line-height: 1; color: var(--tg-color-white-default); text-align: center; white-space: nowrap; border-radius: 0.25rem; background: var(--tg-theme-primary); margin-left: 2px; } /*============================= 00. Keyframe Animation ===============================*/ @-webkit-keyframes hoverShine { 100% { left: 125%; } } @keyframes hoverShine { 100% { left: 125%; } } .rotateme { -webkit-animation-name: rotateme; animation-name: rotateme; -webkit-animation-duration: 25s; animation-duration: 25s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: linear; animation-timing-function: linear; } @keyframes rotateme { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @-webkit-keyframes rotateme { from { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); } } .alltuchtopdown { -webkit-animation: alltuchtopdown 2s ease-in-out 0s infinite alternate; animation: alltuchtopdown 2s ease-in-out 0s infinite alternate; animation-duration: 3s; } @keyframes alltuchtopdown { 0% { -webkit-transform: rotateX(0deg) translateY(0px); -moz-transform: rotateX(0deg) translateY(0px); -ms-transform: rotateX(0deg) translateY(0px); -o-transform: rotateX(0deg) translateY(0px); transform: rotateX(0deg) translateY(0px); } 50% { -webkit-transform: rotateX(0deg) translateY(-20px); -moz-transform: rotateX(0deg) translateY(-20px); -ms-transform: rotateX(0deg) translateY(-20px); -o-transform: rotateX(0deg) translateY(-20px); transform: rotateX(0deg) translateY(-20px); } 100% { -webkit-transform: rotateX(0deg) translateY(0px); -moz-transform: rotateX(0deg) translateY(0px); -ms-transform: rotateX(0deg) translateY(0px); -o-transform: rotateX(0deg) translateY(0px); transform: rotateX(0deg) translateY(0px); } } @-webkit-keyframes alltuchtopdown { 0% { -webkit-transform: rotateX(0deg) translateY(0px); -moz-transform: rotateX(0deg) translateY(0px); -ms-transform: rotateX(0deg) translateY(0px); -o-transform: rotateX(0deg) translateY(0px); transform: rotateX(0deg) translateY(0px); } 50% { -webkit-transform: rotateX(0deg) translateY(-20px); -moz-transform: rotateX(0deg) translateY(-20px); -ms-transform: rotateX(0deg) translateY(-20px); -o-transform: rotateX(0deg) translateY(-20px); transform: rotateX(0deg) translateY(-20px); } 100% { -webkit-transform: rotateX(0deg) translateY(0px); -moz-transform: rotateX(0deg) translateY(0px); -ms-transform: rotateX(0deg) translateY(0px); -o-transform: rotateX(0deg) translateY(0px); transform: rotateX(0deg) translateY(0px); } } .rightToLeft { -webkit-animation: rightToLeft 3s ease-in-out 0s infinite alternate; animation: rightToLeft 3s ease-in-out 0s infinite alternate; animation-duration: 3s; } @keyframes rightToLeft { 0% { transform: translateX(-30px); } 50% { transform: translateX(-10px); } 100% { transform: translateX(-30px); } } .img-custom-anim-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; } } .img-custom-anim-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; } } .img-custom-anim-top { animation: img-anim-top 1.3s 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; } } @keyframes fadeInUp2 { 0% { opacity: 0; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInUp2 { -webkit-animation-name: fadeInUp2; animation-name: fadeInUp2; -webkit-animation-delay: 0.5s; animation-delay: 0.5s; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @keyframes fadeRight2 { 0% { opacity: 0; -webkit-transform: translateX(100px); -ms-transform: translateX(100px); transform: translateX(100px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeRight2 { -webkit-animation-name: fadeRight2; animation-name: fadeRight2; -webkit-animation-delay: 0.5s; animation-delay: 0.5s; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @keyframes pulse-border { 0% { transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); opacity: 1; } 100% { transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5); opacity: 0; } } @-webkit-keyframes pulse-border { 0% { transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); opacity: 1; } 100% { transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5); opacity: 0; } } @keyframes fadeInUp2 { 0% { opacity: 0; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInUp2 { -webkit-animation-name: fadeInUp2; animation-name: fadeInUp2; -webkit-animation-delay: 0.5s; animation-delay: 0.5s; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @keyframes fadeDown2 { 0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeDown2 { -webkit-animation-name: fadeDown2; animation-name: fadeDown2; -webkit-animation-delay: 0.5s; animation-delay: 0.5s; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @keyframes fadeInLeft2 { 0% { opacity: 0; -webkit-transform: translateX(-50px); -ms-transform: translateX(-50px); transform: translateX(-50px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInLeft2 { -webkit-animation-name: fadeInLeft2; animation-name: fadeInLeft2; -webkit-animation-delay: 0.5s; animation-delay: 0.5s; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @keyframes pulse-border { 0% { transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); opacity: 1; } 100% { transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5); opacity: 0; } } @-webkit-keyframes pulse-border { 0% { transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); opacity: 1; } 100% { transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5); opacity: 0; } } /*============================= 00. Search ===============================*/ .search__popup { padding-top: 70px; padding-bottom: 100px; position: fixed; top: 0; left: 0; right: 0; width: 100%; background: var(--tg-color-white-default); backdrop-filter: blur(10px); z-index: 99; -webkit-transform: translateY(calc(-100% - 80px)); -moz-transform: translateY(calc(-100% - 80px)); -ms-transform: translateY(calc(-100% - 80px)); -o-transform: translateY(calc(-100% - 80px)); transform: translateY(calc(-100% - 80px)); -webkit-transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out; -moz-transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out; transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out; transition-delay: 0.5s; } .search__popup.search-opened { -webkit-transform: translateY(0%); -moz-transform: translateY(0%); -ms-transform: translateY(0%); -o-transform: translateY(0%); transform: translateY(0%); transition-delay: 0s; z-index: 99999999; } .search__popup.search-opened .search__input { -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); transform: translateY(0px); opacity: 1; transition-delay: 0.3s; } .search__popup.search-opened .search__input::after { width: 100%; transition-delay: 0.5s; } .search__input { position: relative; height: 80px; -webkit-transform: translateY(-40px); -moz-transform: translateY(-40px); -ms-transform: translateY(-40px); -o-transform: translateY(-40px); transform: translateY(-40px); -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; transition-delay: 0.5s; opacity: 0; } .search__input::after { position: absolute; content: ""; left: 0; bottom: 0; width: 0%; height: 1px; background-color: var(--tg-theme-primary); transition-delay: 0.3s; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .search__input input { width: 100%; height: 100%; background-color: transparent; border: 0; outline: 0; font-size: 24px; color: var(--tg-heading-color); border-bottom: 1px solid transparent; padding: 0; padding-right: 30px; } .search__input input::placeholder { font-size: 24px; } .search__input button { position: absolute; top: 50%; right: 0; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); font-size: 18px; color: var(--tg-theme-primary); border: none; padding: 0 0; background: transparent; } .search__close { position: absolute; top: 10%; right: 2%; z-index: 2; } .search-close-btn { margin: 0; padding: 0; border: none; color: var(--tg-theme-primary); cursor: pointer; background: transparent; } .search-popup-overlay { position: fixed; right: 0; top: 0; width: 100%; height: 100%; z-index: 4; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; transition-delay: 0.5s; opacity: 0; visibility: hidden; background: #000d25; } .search-popup-overlay.search-popup-overlay-open { opacity: 0.55; visibility: visible; transition-delay: 0s; } .search-input-field ~ .search-focus-border { position: absolute; bottom: 0; left: auto; right: 0; width: 0; height: 1px; background-color: var(--tg-theme-primary); transition: all 0.5s; } .search-input-field:focus ~ .search-focus-border { width: 100%; left: 0; right: auto; transition: all 0.5s; } /*============================= 02. Header ===============================*/ .transparent-header { position: absolute; left: 0; top: 0px; width: 100%; z-index: 9; height: auto; } @media (max-width: 767.98px) { .transparent-header { top: 0; } } .tg-header__top { background-color: #a1248a; padding: 9px 0; } @media (max-width: 991.98px) { .tg-header__top { display: none; } } .tg-header__top-info .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 25px; } .tg-header__top-info .list-wrap li { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; position: relative; align-items: center; gap: 7px; font-size: 14px; color: #FFD300; } .tg-header__top-info .list-wrap li::before { content: ""; position: absolute; right: -12px; top: 50%; transform: translateY(-50%); width: 2px; height: 12px; background: var(--tg-color-gray-1); } .tg-header__top-info .list-wrap li:last-child::before { display: none; } .tg-header__top-info .list-wrap li a { color: #FCC900; } .tg-header__top-info .list-wrap li a:hover { opacity: 0.8; } .tg-header__top-info .list-wrap li i { font-size: 18px; } .tg-header__top-right > .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 25px; justify-content: flex-end; } .tg-header__top-right > .list-wrap > li { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 7px; font-size: 14px; color: var(--tg-color-gray-1); position: relative; } .tg-header__top-right > .list-wrap > li::before { content: ""; position: absolute; right: -12px; top: 50%; transform: translateY(-50%); width: 2px; height: 12px; background: var(--tg-color-gray-1); } .tg-header__top-right > .list-wrap > li:last-child::before { display: none; } .tg-header__top-right > .list-wrap > li a { color: #CFA700; } .tg-header__top-right > .list-wrap > li a:hover { opacity: 0.8; } .tg-header__top-right > .list-wrap > li i { font-size: 18px; } .tg-header__top-right > .list-wrap > li.log-in a { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 10px; color: var(--tg-color-gray-4); font-weight: 600; } .tg-header__top-social .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 12px; } .tg-header__top-social .list-wrap li a { font-size: 16px; color: var(--tg-color-gray-1); display: block; } .tg-header__top-social .list-wrap li a svg { width: 16px; height: 16px; } @media (max-width: 991.98px) { .tg-header__top-menu { display: none; } } .tg-header__top-menu .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 20px; } .tg-header__top-menu .list-wrap li a { color: var(--tg-color-white-default); text-transform: uppercase; font-size: 12px; position: relative; font-weight: 600; } .tg-header__top-menu .list-wrap li a::before { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: var(--tg-color-white-default); -webkit-transform-origin: right top; -ms-transform-origin: right top; transform-origin: right top; -webkit-transform: scale(0, 1); -ms-transform: scale(0, 1); transform: scale(0, 1); -webkit-transition: transform 0.4s cubic-bezier(1, 0, 0, 1); transition: transform 0.4s cubic-bezier(0.74, 0.72, 0.27, 0.24); } .tg-header__top-menu .list-wrap li a:hover::before { -webkit-transform-origin: left top; -ms-transform-origin: left top; transform-origin: left top; -webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); transform: scale(1, 1); } .tg-header__area { position: relative; } @media (max-width: 991.98px) { .tg-header__area { padding: 18px 0; } } @media (max-width: 767.98px) { .tg-header__area { padding: 10px 0; } } .tg-header__area .mobile-nav-toggler { position: relative; font-size: 30px; cursor: pointer; line-height: 1; color: var(--tg-theme-primary); display: none; } @media (max-width: 991.98px) { .tg-header__area .mobile-nav-toggler { display: block; margin-left: 25px; } } .tg-header__area.sticky-menu { padding: 0 0; } @media (max-width: 991.98px) { .tg-header__area.sticky-menu { padding: 18px 0; } } @media (max-width: 767.98px) { .tg-header__area.sticky-menu { padding: 10px 0; } } .tg-header__area-two .tgmenu__navbar-wrap ul { margin: 0 0 0 auto; } @media (max-width: 991.98px) { .tg-header__area-three { background: var(--tg-color-white-default); } } .tg-header__area-three .tgmenu__wrap { background: var(--tg-color-white-default); padding: 0 22px; -webkit-border-radius: 100px; -moz-border-radius: 100px; -o-border-radius: 100px; -ms-border-radius: 100px; border-radius: 100px; margin-top: 50px; box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.05); } @media (max-width: 1500px) { .tg-header__area-three .tgmenu__wrap { margin-top: 35px; } } @media (max-width: 1199.98px) { .tg-header__area-three .tgmenu__wrap { margin-top: 25px; } } @media (max-width: 991.98px) { .tg-header__area-three .tgmenu__wrap { margin-top: 0; padding: 0; background: transparent; -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; box-shadow: none; } } .tg-header__area-three .tgmenu__navbar-wrap ul { margin: 0 auto; } .tg-header__area-three .tgmenu__navbar-wrap ul li a { padding: 33px 16px; } .tg-header__area-three.sticky-menu .tgmenu__wrap { margin-top: 0; padding: 0 0; box-shadow: none; } @media (max-width: 1199.98px) { .tg-header__area-three .header-contact { display: none; } } .tg-header__area-four { border-bottom: 1px solid #4275FF; } @media (max-width: 991.98px) { .tg-header__area-four { padding: 0 0; } } .tg-header__area-four .tgmenu__nav { align-items: normal; } .tg-header__area-four .logo a { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; height: 100%; border-right: 1px solid #3269FF; padding: 20px 50px; } @media (max-width: 1199.98px) { .tg-header__area-four .logo a { padding: 20px 20px; } } .tg-header__area-four .tgmenu__navbar-wrap > ul { margin: 0 auto; } .tg-header__area-four .tgmenu__navbar-wrap > ul > li > a { color: var(--tg-color-white-default); } .tg-header__area-four .tgmenu__navbar-wrap > ul > li > a::after { color: var(--tg-color-white-default); } .tg-header__area-four .tgmenu__navbar-wrap > ul > li > a:hover { color: var(--tg-color-white-default); } .tg-header__area-four .tgmenu__navbar-wrap > ul > li > a:hover::after { color: var(--tg-color-white-default); } .tg-header__area-four .tgmenu__navbar-wrap > ul > li.active > a { color: var(--tg-color-white-default); } .tg-header__area-four .tgmenu__navbar-wrap > ul > li.active > a::after { color: var(--tg-color-white-default); } .tg-header__area-four .tgmenu__navbar-wrap > ul > li.active > a:hover { color: var(--tg-color-white-default); } .tg-header__area-four .tgmenu__navbar-wrap > ul > li.active > a:hover::after { color: var(--tg-color-white-default); } .tg-header__area-four .tgmenu__navbar-wrap > ul > li:hover > a { color: var(--tg-color-white-default); } .tg-header__area-four .tgmenu__navbar-wrap > ul > li:hover > a::after { color: var(--tg-color-white-default); } @media (max-width: 991.98px) { .tg-header__area-four.sticky-menu { padding: 0 0; } } .tg-header__area-four.sticky-menu .logo { display: none; } .tg-header__area-four.sticky-menu .logo.d-none { display: block !important; } .tg-header__area-four.sticky-menu .tgmenu__navbar-wrap ul > li > a { color: var(--tg-heading-color); } .tg-header__area-four.sticky-menu .tgmenu__navbar-wrap ul > li > a::after { color: var(--tg-heading-color); } .tg-header__area-four.sticky-menu .tgmenu__navbar-wrap ul > li > a:hover { color: var(--tg-theme-primary); } .tg-header__area-four.sticky-menu .tgmenu__navbar-wrap ul > li > a:hover::after { color: var(--tg-theme-primary); } .tg-header__area-four.sticky-menu .tgmenu__navbar-wrap ul > li.active > a { color: var(--tg-theme-primary); } .tg-header__area-four.sticky-menu .tgmenu__navbar-wrap ul > li.active > a::after { color: var(--tg-theme-primary); } .tg-header__area-four.sticky-menu .tgmenu__action-four > ul li .header-contact-info { color: var(--tg-heading-color); } .tg-header__area-four.sticky-menu .tgmenu__action-four > ul li .header-contact-info:hover { color: var(--tg-theme-primary); } .tg-header__area-four.sticky-menu .tgmenu__action-four > ul li.header-btn-three .tg-btn { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .tg-header__area-four.sticky-menu .mobile-nav-toggler { color: var(--tg-theme-primary); } @media (max-width: 991.98px) { .tg-header__area-four .mobile-nav-toggler { color: var(--tg-color-white-default); display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; padding: 0 20px; margin-left: 0; border-left: 1px solid #3269FF; } } .tg-header__area-five { border-bottom: 1px solid rgba(255, 255, 255, 0.15); } .tg-header__area-five .tgmenu__navbar-wrap > ul { margin: 0 auto; } .tg-header__area-five .tgmenu__navbar-wrap > ul > li a { color: var(--tg-color-white-default); } .tg-header__area-five .tgmenu__navbar-wrap > ul > li a::after { color: var(--tg-color-white-default); } .tg-header__area-five .tgmenu__navbar-wrap > ul > li a:hover::after { color: var(--tg-theme-primary); } .tg-header__area-five .tgmenu__navbar-wrap > ul > li.active > a, .tg-header__area-five .tgmenu__navbar-wrap > ul > li:hover > a { color: var(--tg-theme-primary); } .tg-header__area-five .tgmenu__navbar-wrap > ul > li.active > a::after, .tg-header__area-five .tgmenu__navbar-wrap > ul > li:hover > a::after { color: var(--tg-theme-primary); } .tg-header__area-five.sticky-menu .logo { display: none; } .tg-header__area-five.sticky-menu .logo.d-none { display: block !important; } .tg-header__area-five.sticky-menu .tgmenu__navbar-wrap > ul > li a { color: var(--tg-heading-color); } .tg-header__area-five.sticky-menu .tgmenu__navbar-wrap > ul > li a::after { color: var(--tg-heading-color); } .tg-header__area-five.sticky-menu .tgmenu__navbar-wrap > ul > li a:hover { color: var(--tg-theme-primary); } .tg-header__area-five.sticky-menu .tgmenu__navbar-wrap > ul > li a:hover::after { color: var(--tg-theme-primary); } .tg-header__area-five.sticky-menu .tgmenu__navbar-wrap > ul > li.active > a, .tg-header__area-five.sticky-menu .tgmenu__navbar-wrap > ul > li:hover > a { color: var(--tg-theme-primary); } .tg-header__area-five.sticky-menu .tgmenu__navbar-wrap > ul > li.active > a::after, .tg-header__area-five.sticky-menu .tgmenu__navbar-wrap > ul > li:hover > a::after { color: var(--tg-theme-primary); } .tg-header__area-five.sticky-menu .tgmenu__action-five ul li.header-contact .header-contact-info { color: var(--tg-heading-color); } .tg-header__area-five.sticky-menu .tgmenu__action-five ul li.offCanvas-menu .menu-tigger span { background: var(--tg-theme-primary); } .tg-header__area-seven .tgmenu__navbar-wrap ul { margin: 0 0 0 170px; } @media (max-width: 1199.98px) { .tg-header__area-seven .tgmenu__navbar-wrap ul { margin: 0 0 0 30px; } } .tg-header__area-eight { padding: 5px 0; } @media (max-width: 991.98px) { .tg-header__area-eight { padding: 20px 0; } } .tg-header__area-eight .tgmenu__navbar-wrap > ul { margin: 0 65px 0 auto; } .tg-header__area-nine .tgmenu__navbar-wrap ul { margin: 0 0 0 65px; } @media (max-width: 991.98px) { .tg-header__area-ten { padding: 20px 0; background: var(--tg-color-white-default); } } .tg-header__area-ten .tgmenu__navbar-wrap ul { margin: 0 0 0 0; } .tg-header__area-ten .tgmenu__navbar-wrap ul li a { padding: 30px 16px; } .tg-header__area-ten .tgmenu__wrap { border: 1px solid var(--tg-color-gray-4); border-top: none; background: var(--tg-color-white-default); -webkit-border-radius: 0px 0px 15px 15px; -moz-border-radius: 0px 0px 15px 15px; -o-border-radius: 0px 0px 15px 15px; -ms-border-radius: 0px 0px 15px 15px; border-radius: 0px 0px 15px 15px; padding-left: 15px; } @media (max-width: 991.98px) { .tg-header__area-ten .tgmenu__wrap { -webkit-border-radius: 0px; -moz-border-radius: 0px; -o-border-radius: 0px; -ms-border-radius: 0px; border-radius: 0px; padding: 0; border: none; } } .tg-header__area-ten .tgmenu__nav { align-items: normal; } @media (max-width: 991.98px) { .tg-header__area-ten .logo.d-none { display: block !important; } } .tg-header__area-ten.sticky-menu .tgmenu__wrap { border: none; } .tg-header__area-eleven { border-bottom: 1px solid #DEE0EB; background: var(--tg-color-gray-13); } @media (max-width: 991.98px) { .tg-header__area-eleven { padding: 18px 20px; } } @media (max-width: 767.98px) { .tg-header__area-eleven { padding: 20px 15px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .tg-header__area-eleven { padding: 20px 20px; } } @media (max-width: 991.98px) { .tg-header__area-eleven.sticky-menu { padding: 18px 20px; } } @media (max-width: 767.98px) { .tg-header__area-eleven.sticky-menu { padding: 20px 15px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .tg-header__area-eleven.sticky-menu { padding: 20px 20px; } } .tg-header__area-eleven .tgmenu__nav { align-items: normal; } @media (max-width: 991.98px) { .tg-header__area-eleven .tgmenu__nav { align-items: center; } } .tg-header__area-eleven .logo { margin-left: 30px; } @media (max-width: 1199.98px) { .tg-header__area-eleven .logo { margin-left: 25px; } } @media (max-width: 991.98px) { .tg-header__area-eleven .logo { margin-left: 0; } } .tg-header__area-eleven .logo a { height: 100%; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; } .tg-header__area-eleven .tgmenu__navbar-wrap ul { margin: 0 0 0 75px; } @media (max-width: 1199.98px) { .tg-header__area-eleven .tgmenu__navbar-wrap ul { margin: 0 0 0 30px; } } .tg-header__area-twelve { margin-top: 38px; } @media (max-width: 1500px) { .tg-header__area-twelve { margin-top: 25px; } } @media (max-width: 991.98px) { .tg-header__area-twelve { background: var(--tg-color-white-default); margin-top: 0; } } .tg-header__area-twelve .tgmenu__wrap { background: var(--tg-color-white-default); padding: 10px 40px; } @media (max-width: 1199.98px) { .tg-header__area-twelve .tgmenu__wrap { padding: 0px 20px; } } @media (max-width: 991.98px) { .tg-header__area-twelve .tgmenu__wrap { padding: 0px; } } .tg-header__area-twelve .tgmenu__navbar-wrap ul { margin: 0 0 0 50px; } .tg-header__area-twelve .tgmenu__action-ten { margin-right: 0; } .tg-header__area-twelve.sticky-menu .tgmenu__wrap { padding: 0 40px; } @media (max-width: 1199.98px) { .tg-header__area-twelve.sticky-menu .tgmenu__wrap { padding: 0 20px; } } @media (max-width: 991.98px) { .tg-header__area-twelve.sticky-menu .tgmenu__wrap { padding: 0px; } } @media (max-width: 1199.98px) { .tg-header__area-twelve .header-search { display: none; } } .tg-header__logo-area { background: var(--tg-theme-primary); } @media (max-width: 991.98px) { .tg-header__logo-area { display: none; } } .tg-header__logo-area-inner { background: var(--tg-color-white-default); border: 1px solid var(--tg-color-gray-4); border-top: none; } .tg-header__logo-area-inner .logo a { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; height: 100%; align-items: center; padding: 10px 27px; border-right: 1px solid var(--tg-color-gray-4); } @media (max-width: 1199.98px) { .tg-header__logo-area-inner .logo a { padding: 10px 20px; border-right: 1px solid var(--tg-color-gray-4); } } .tg-header__logo-area-inner .header__btn { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; height: 100%; align-items: center; padding: 15px 30px; } @media (max-width: 1199.98px) { .tg-header__logo-area-inner .header__btn { padding: 15px 20px; border-left: 1px solid var(--tg-color-gray-4); margin-left: auto; } } .tg-header__info-wrap { flex-grow: 1; } @media (max-width: 1199.98px) { .tg-header__info-wrap { display: none !important; } } .tg-header__info-item { width: 33.33%; flex: 0 0 auto; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 13px; padding: 20px 23px; border-right: 1px solid var(--tg-color-gray-4); } .tg-header__info-item .icon { width: 40px; height: 40px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; background: var(--tg-color-gray-4); -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; justify-content: center; color: var(--tg-theme-primary); font-size: 22px; } .tg-header__info-item .content span { display: block; line-height: 1; font-size: 13px; font-weight: 500; color: var(--tg-border-1); margin-bottom: 6px; } .tg-header__info-item .content a { display: block; font-size: 15px; color: var(--tg-theme-secondary); font-weight: 500; line-height: 1; } .tg-header__info-item .content a:hover { color: var(--tg-theme-primary); } .tg-header__info-item .content p { font-size: 15px; color: var(--tg-theme-secondary); font-weight: 500; line-height: 1; margin-bottom: 0; } .tgmenu__nav { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-start; } @media (max-width: 991.98px) { .tgmenu__nav { justify-content: space-between; } } .tgmenu__nav .logo img { max-height: 65px; } .tgmenu__nav-left { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 35px; } .tgmenu__nav-left-contact { position: relative; } @media (max-width: 1199.98px) { .tgmenu__nav-left-contact { display: none; } } .tgmenu__nav-left-contact::before { content: ""; position: absolute; left: -15px; top: 50%; transform: translateY(-50%); background: #CACACA; height: 30px; width: 1px; } .tgmenu__nav-left-contact span { display: block; line-height: 1; font-size: 13px; color: var(--tg-border-1); margin-bottom: 7px; } .tgmenu__nav-left-contact a { font-size: 16px; font-weight: 500; line-height: 1; color: var(--tg-body-color); display: block; } .tgmenu__nav-left-contact a::before { content: ""; position: absolute; left: 0; bottom: 0; width: 0; height: 1px; background: var(--tg-theme-primary); -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .tgmenu__nav-left-contact a:hover { color: var(--tg-theme-primary); } .tgmenu__nav-left-contact a:hover::before { width: 100%; } .tgmenu__navbar-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-grow: 1; } .tgmenu__navbar-wrap ul { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; padding: 0; flex-direction: row; flex-wrap: wrap; margin: 0 0 0 115px; } @media (max-width: 1199.98px) { .tgmenu__navbar-wrap ul { margin: 0 0 0 50px; } } .tgmenu__navbar-wrap ul li { display: block; position: relative; list-style: none; } .tgmenu__navbar-wrap ul li a { font-size: 14px; font-weight: var(--tg-fw-medium); text-transform: uppercase; color: var(--tg-heading-color); padding: 35px 15px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; line-height: 1.4; position: relative; z-index: 1; } .tgmenu__navbar-wrap ul li .sub-menu { position: absolute; left: 0; top: 100%; min-width: 230px; border: 1px solid #f5f5f5; background: var(--tg-color-white-default); margin: 0; -webkit-transform: scale(1, 0); -moz-transform: scale(1, 0); -ms-transform: scale(1, 0); -o-transform: scale(1, 0); transform: scale(1, 0); transform-origin: 0 0; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; -webkit-box-shadow: 0px 30px 70px 0px rgba(137, 139, 142, 0.15); -moz-box-shadow: 0px 30px 70px 0px rgba(137, 139, 142, 0.15); box-shadow: 0px 30px 70px 0px rgba(137, 139, 142, 0.15); border-radius: 0; padding: 18px 0; display: block; visibility: hidden; opacity: 0; z-index: 9; border-radius: 0 0 10px 10px; } .tgmenu__navbar-wrap ul li .sub-menu.sub-menu-right { right: 0; left: auto; } .tgmenu__navbar-wrap ul li .sub-menu .sub-menu { right: auto; left: 100%; top: 0; } .tgmenu__navbar-wrap ul li .sub-menu li { margin-left: 0; text-align: left; display: block; } .tgmenu__navbar-wrap ul li .sub-menu li a { padding: 8px 15px 8px 25px; display: block; color: var(--tg-heading-color); font-size: 15px; text-transform: capitalize; } .tgmenu__navbar-wrap ul li .sub-menu li:hover > a, .tgmenu__navbar-wrap ul li .sub-menu li.active > a { color: var(--tg-theme-primary); } .tgmenu__navbar-wrap ul li:hover > .sub-menu { opacity: 1; visibility: visible; transform: scale(1); } .tgmenu__navbar-wrap > ul > li.active a, .tgmenu__navbar-wrap > ul > li:hover a { color: var(--tg-theme-primary); } .tgmenu__main-menu li.menu-item-has-children .dropdown-btn { display: none; } .tgmenu__main-menu li.menu-item-has-children > a::after { content: "\f078"; display: block; font-family: var(--tg-icon-font-family); font-size: 12px; font-weight: var(--tg-fw-bold); margin-left: 6px; color: var(--tg-border-1); -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; display: none; } .tgmenu__main-menu li.menu-item-has-children > a:hover::after { color: var(--tg-theme-primary); } .tgmenu__main-menu li.menu-item-has-children:hover > a::after, .tgmenu__main-menu li.menu-item-has-children.active > a::after { color: var(--tg-theme-primary); } @media (max-width: 991.98px) { .tgmenu__action { margin-left: auto; } } @media (max-width: 767.98px) { .tgmenu__action { display: none; } } .tgmenu__action > ul { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; } .tgmenu__action > ul li { position: relative; margin-left: 25px; flex: 0 0 auto; } @media (max-width: 991.98px) { .tgmenu__action > ul li { margin-left: 20px; } } .tgmenu__action > ul li:first-child { margin-left: 0; } .tgmenu__action > ul li.header-search a { font-size: 24px; color: var(--tg-border-1); line-height: 0; } .tgmenu__action > ul li.header-search a:hover { color: var(--tg-theme-primary); } .tgmenu__action > ul li.header-btn .tg-btn { padding: 13px 15px; } .tgmenu__action > ul li.header-btn .tg-btn svg path { opacity: 1 !important; transform: translateX(0); } .tgmenu__action > ul li.header-btn-three { border-left: 1px solid #3269FF; height: 100%; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; padding: 0 40px; } @media (max-width: 1500px) { .tgmenu__action > ul li.header-btn-three { padding: 0 25px; } } @media (max-width: 1199.98px) { .tgmenu__action > ul li.header-btn-three { padding: 0 20px; } } @media (max-width: 767.98px) { .tgmenu__action > ul li.header-btn-three { display: none; } } .tgmenu__action > ul li.header-btn-three .tg-btn { background: var(--tg-color-white-default); color: var(--tg-theme-secondary); -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; padding: 18px 28px; } .tgmenu__action > ul li.header-btn-three .tg-btn:hover { color: var(--tg-color-white-default); } @media (max-width: 1199.98px) { .tgmenu__action > ul li.offCanvas-menu { display: none; } } .tgmenu__action > ul li .header-contact-info { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 500; color: var(--tg-body-color); line-height: 1; } .tgmenu__action > ul li .header-contact-info i { font-size: 20px; } .tgmenu__action > ul li .header-contact-info:hover { color: var(--tg-theme-primary); } .tgmenu__action-two { margin-left: 40px; } @media (max-width: 991.98px) { .tgmenu__action-two { margin-left: auto; } } .tgmenu__action-two .list-wrap .header-btn-two .tg-btn { padding: 13px 22px; } .tgmenu__action-four { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; } .tgmenu__action-four > ul { height: 100%; } .tgmenu__action-four > ul li { margin-left: 40px; } @media (max-width: 1500px) { .tgmenu__action-four > ul li { margin-left: 25px; } } @media (max-width: 1199.98px) { .tgmenu__action-four > ul li { margin-left: 0; } } @media (max-width: 1199.98px) { .tgmenu__action-four > ul li.header-contact { display: none; } } .tgmenu__action-four > ul li.header-contact .header-contact-info { color: var(--tg-color-white-default); } .tgmenu__action-four > ul li.header-contact .header-contact-info:hover { color: var(--tg-theme-secondary); } .tgmenu__action-five ul li.header-contact .header-contact-info { color: var(--tg-color-white-default); } .tgmenu__action-five ul li.header-contact .header-contact-info:hover { opacity: 0.8; } .tgmenu__action-five ul li.offCanvas-menu .menu-tigger span { background: var(--tg-color-white-default); } .tgmenu__action-six ul li { margin-left: 15px; } .tgmenu__action-six ul li.header-btn .tg-btn { border: 1px solid var(--tg-border-13); padding: 15px 22px; color: var(--tg-heading-color); font-size: 14px; } .tgmenu__action-six ul li.header-btn .tg-btn svg { color: var(--tg-theme-primary); } .tgmenu__action-six ul li.header-btn .tg-btn:hover { border-color: var(--tg-theme-primary); color: var(--tg-color-white-default); background: var(--tg-theme-primary); } .tgmenu__action-six ul li.header-btn .tg-btn:hover svg { color: var(--tg-color-white-default); } .tgmenu__action-six ul li.offCanvas-menu { width: auto; height: auto; } .tgmenu__action-six ul li.offCanvas-menu .menu-tigger { width: 46px; height: 46px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; border: 1px solid var(--tg-border-13); -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; color: var(--tg-body-color); } .tgmenu__action-six ul li.offCanvas-menu .menu-tigger:hover { background: var(--tg-theme-primary); border-color: var(--tg-theme-primary); color: var(--tg-color-white-default); } .tgmenu__action-seven ul li.header-btn .tg-btn { border-radius: 4px 12px; padding: 16px 19px; } .tgmenu__action-eight ul li { margin-left: 15px; } .tgmenu__action-eight ul li .header-search-form { position: relative; width: 250px; } @media (max-width: 1199.98px) { .tgmenu__action-eight ul li .header-search-form { display: none; } } .tgmenu__action-eight ul li .header-search-form input { width: 100%; background: #F5F5F5; border: none; -webkit-border-radius: 100px; -moz-border-radius: 100px; -o-border-radius: 100px; -ms-border-radius: 100px; border-radius: 100px; font-size: 14px; color: var(--tg-heading-color); padding: 10px 40px 10px 20px; height: 45px; } .tgmenu__action-eight ul li .header-search-form input::placeholder { color: var(--tg-body-color); font-size: 14px; } .tgmenu__action-eight ul li .header-search-form button { position: absolute; border: none; background: transparent; padding: 0; right: 10px; top: 50%; transform: translateY(-50%); font-size: 20px; color: var(--tg-body-color); } .tgmenu__action-eight ul li .header-search-form button:hover { color: var(--tg-theme-primary); } .tgmenu__action-eight ul li .header-search-form-two input { background: var(--tg-color-white-default); border: 1px solid #C6C6C6; } .tgmenu__action-eight ul li.header-btn .tg-btn { padding: 15px 25px; } .tgmenu__action-nine > .list-wrap { align-items: normal; height: 100%; } .tgmenu__action-nine > .list-wrap li { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; height: 100%; } .tgmenu__action-nine > .list-wrap li.offCanvas-menu { padding: 0 24px; width: auto; border-left: 1px solid var(--tg-color-gray-4); } .tgmenu__action-nine > .list-wrap li.offCanvas-menu .menu-tigger { justify-content: center; } .tgmenu__action-ten { margin-right: 26px; } @media (max-width: 991.98px) { .tgmenu__action-ten { margin-right: 0; } } .tgmenu__action-ten > ul { height: 100%; } .tgmenu__action-ten > ul li { margin-left: 20px; } .tgmenu__action-ten > ul li.header-search { padding-right: 20px; } .tgmenu__action-ten > ul li.header-search::before { content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 2px; height: 24px; background: #DEE0EB; } @media (max-width: 1199.98px) { .tgmenu__action-ten > ul li.header-contact { display: none; } } .tgmenu__action-ten > ul li.header-contact .header-contact-info { font-size: 16px; gap: 5px; } .tgmenu__action-ten > ul li.header-btn .tg-btn { padding: 16px 24px; } .sticky-menu { position: fixed; left: 0; margin: auto; top: 0; width: 100%; z-index: 99; background: var(--tg-color-white-default); -webkit-animation: 1000ms ease-in-out 0s normal none 1 running fadeInDown; animation: 1000ms ease-in-out 0s normal none 1 running fadeInDown; -webkit-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1); box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1); border-radius: 0; } .sticky-menu ul li .sub-menu { -webkit-border-radius: 0 0 10px 10px; -moz-border-radius: 0 0 10px 10px; -o-border-radius: 0 0 10px 10px; -ms-border-radius: 0 0 10px 10px; border-radius: 0 0 10px 10px; } #header-fixed-height.active-height { display: block; height: 90px; } .tg-mega-menu-wrap { position: absolute; left: 50%; top: 100%; width: 1225px; border-radius: 20px; padding: 30px 40px 10px; background: var(--tg-color-white-default); margin: 0 0; transform: scale(1, 0) translateX(-50%); transform-origin: 0 0; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; margin: 0 auto; opacity: 0; visibility: hidden; z-index: 9; box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.05); } @media (max-width: 1500px) { .tg-mega-menu-wrap { width: 1150px; padding: 25px 25px 10px; } } @media (max-width: 1199.98px) { .tg-mega-menu-wrap { width: 960px; padding: 25px 20px 0; } } @media (max-width: 1500px) { .tg-mega-menu-wrap .row { --bs-gutter-x: 15px; } } .menu-item-has-children:hover .tg-mega-menu-wrap { opacity: 1; visibility: visible; transform: scale(1) translateX(-50%); } .mega-menu-item { margin-bottom: 25px; } .mega-menu-item .mega-menu-thumb { margin-bottom: 10px; } .mega-menu-item .mega-menu-thumb a { padding: 0 !important; } .mega-menu-item .mega-menu-thumb a img { -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; border: 1px solid var(--tg-color-gray-5); width: 100%; } .mega-menu-item .mega-menu-content .title { margin-bottom: 0; text-align: center; } .mega-menu-item .mega-menu-content .title a { padding: 0 !important; text-align: center; justify-content: center; font-size: 15px; text-transform: capitalize; color: var(--tg-heading-color); font-weight: 500; } .mega-menu-item:hover .mega-menu-thumb a img { transform: translateY(-3px); } .mega-menu-item:hover .mega-menu-content .title a { color: var(--tg-theme-primary); } .mega-menu-item.active .mega-menu-content .title a { color: var(--tg-theme-primary); } .tgmobile__menu .tg-mega-menu-wrap { display: none; width: auto; padding: 25px 40px 0; background: transparent; position: relative; opacity: 1 !important; visibility: visible; transition: 0s; box-shadow: none; border: none; transform: scale(1); transform-origin: unset; left: 0; } .tgmobile__menu .tg-mega-menu-wrap .row .col { position: relative; width: 100%; } .tg-mega-menu-has-children { position: static !important; } .tgmobile__menu .menu-item-has-children:hover .tg-mega-menu-wrap { transform: scale(1) translateX(0); } .mfp-iframe-holder .mfp-content { max-width: 1200px; } .transparent-header .tgmenu__navbar-wrap ul li .sub-menu { border-radius: 10px; } .transparent-header .sticky-menu ul li .sub-menu { -webkit-border-radius: 0 0 10px 10px; -moz-border-radius: 0 0 10px 10px; -o-border-radius: 0 0 10px 10px; -ms-border-radius: 0 0 10px 10px; border-radius: 0 0 10px 10px; } /*============================= 03. Banner ===============================*/ .banner__area { position: relative; z-index: 1; padding: 30px 0 0; } @media (max-width: 991.98px) { .banner__area { padding: 60px 0 0; } } .banner__area-two { padding: 160px 0 140px; position: relative; z-index: 1; } @media (max-width: 1199.98px) { .banner__area-two { padding: 130px 0 100px; } } @media (max-width: 767.98px) { .banner__area-two { padding: 110px 0 100px; } } .banner__area-two::before { content: ""; position: absolute; left: -218px; top: 121px; width: 512px; height: 512px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; background: #3894FF; filter: blur(75px); opacity: 0.1; z-index: -1; } .banner__area-two::after { content: ""; position: absolute; top: -177px; right: -210px; width: 515px; height: 515px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; background: #FF7438; filter: blur(150px); opacity: 0.1; z-index: -1; } .banner__area-six { position: relative; z-index: 1; padding: 215px 0 0; } @media (max-width: 1500px) { .banner__area-six { padding: 160px 0 0; } } @media (max-width: 991.98px) { .banner__area-six { padding: 130px 0 0; } } @media (max-width: 767.98px) { .banner__area-six { padding: 110px 0 0; } } .banner__bg { background-size: cover; background-position: center; position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: -1; opacity: 0.08; mix-blend-mode: luminosity; background-color: var(--tg-color-white-default); } .banner__bg-two { background-size: cover; background-position: center; padding: 200px 0 135px; position: relative; z-index: 1; } @media (max-width: 1500px) { .banner__bg-two { padding: 170px 0 120px; } } @media (max-width: 991.98px) { .banner__bg-two { padding: 120px 0 100px; } } .banner__bg-three { background-size: cover; background-position: center; padding: 190px 0 115px; position: relative; z-index: 1; } @media (max-width: 1500px) { .banner__bg-three { padding: 170px 0 110px; } } @media (max-width: 1199.98px) { .banner__bg-three { padding: 160px 0 100px; } } @media (max-width: 991.98px) { .banner__bg-three { padding: 135px 0 100px; } } @media (max-width: 767.98px) { .banner__bg-three { padding: 125px 0 80px; } } .banner__bg-four { background-size: cover; background-position: center; min-height: 650px; padding: 100px 80px 100px 150px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; -webkit-border-radius: 50px; -moz-border-radius: 50px; -o-border-radius: 50px; -ms-border-radius: 50px; border-radius: 50px; position: relative; z-index: 1; overflow: hidden; } @media (max-width: 1500px) { .banner__bg-four { padding: 100px 80px 100px 80px; min-height: 580px; } } @media (max-width: 1199.98px) { .banner__bg-four { padding: 100px 60px 100px 60px; min-height: 500px; } } @media (max-width: 767.98px) { .banner__bg-four { padding: 70px 25px 70px 25px; } } .banner__bg-four > .row { flex-grow: 1; } .banner__bg-five { position: absolute; left: 0; top: 0; background-size: cover; background-position: center; width: 100%; height: 84%; z-index: -1; } .banner__bg-six { background-size: cover; background-position: center; min-height: 855px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; padding: 260px 0 130px; } @media (max-width: 1500px) { .banner__bg-six { min-height: 740px; padding: 195px 0 130px; } } @media (max-width: 991.98px) { .banner__bg-six { min-height: 680px; padding: 140px 0 130px; } } .banner__bg-shape { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-size: cover; background-position: center; z-index: -1; } @media (max-width: 991.98px) { .banner__content { text-align: center; margin-bottom: 50px; } } .banner__content .sub-title { display: block; font-size: 16px; font-weight: 500; text-transform: uppercase; color: var(--tg-theme-primary); line-height: 1.4; margin-bottom: 5px; } .banner__content .title { font-size: 60px; margin-bottom: 10px; } @media (max-width: 1500px) { .banner__content .title { font-size: 55px; } } @media (max-width: 1199.98px) { .banner__content .title { font-size: 45px; } } @media (max-width: 767.98px) { .banner__content .title { font-size: 38px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .banner__content .title { font-size: 40px; } } .banner__content p { margin-bottom: 22px; font-size: 18px; text-transform: capitalize; width: 85%; } @media (max-width: 1199.98px) { .banner__content p { width: 100%; } } @media (max-width: 991.98px) { .banner__content-two { text-align: center; } } .banner__content-two .title { font-size: 55px; letter-spacing: -2px; text-transform: capitalize; margin-bottom: 10px; } @media (max-width: 1500px) { .banner__content-two .title { font-size: 50px; letter-spacing: -1px; } } @media (max-width: 1199.98px) { .banner__content-two .title { font-size: 45px; letter-spacing: 0; } } @media (max-width: 991.98px) { .banner__content-two .title { font-size: 42px; } } @media (max-width: 767.98px) { .banner__content-two .title { font-size: 38px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .banner__content-two .title { font-size: 40px; } } .banner__content-two p { margin-bottom: 38px; font-size: 18px; } @media (max-width: 991.98px) { .banner__content-three { text-align: center; } } .banner__content-three .title { margin-bottom: 15px; font-size: 55px; text-transform: capitalize; width: 81%; } @media (max-width: 1199.98px) { .banner__content-three .title { font-size: 45px; width: 100%; } } @media (max-width: 991.98px) { .banner__content-three .title { font-size: 42px; } } @media (max-width: 767.98px) { .banner__content-three .title { font-size: 38px; } } .banner__content-three > p { margin-bottom: 35px; font-size: 18px; text-transform: capitalize; line-height: 1.6; } @media (max-width: 1199.98px) { .banner__content-three > p { margin-bottom: 20px; } } .banner__content-four .title { margin-bottom: 35px; color: var(--tg-color-white-default); font-size: 70px; line-height: 1.1; } @media (max-width: 1500px) { .banner__content-four .title { font-size: 65px; } } @media (max-width: 1199.98px) { .banner__content-four .title { font-size: 52px; } } @media (max-width: 767.98px) { .banner__content-four .title { font-size: 40px; margin-bottom: 25px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .banner__content-four .title { font-size: 45px; } } .banner__content-four .title .arrow { width: 126px; height: 57px; display: inline-flex; align-items: center; justify-content: center; background: var(--tg-color-white-default); -webkit-border-radius: 100px; -moz-border-radius: 100px; -o-border-radius: 100px; -ms-border-radius: 100px; border-radius: 100px; color: var(--tg-theme-primary); transform: translateY(-13px); } @media (max-width: 1500px) { .banner__content-four .title .arrow { transform: translateY(-9px); } } @media (max-width: 1199.98px) { .banner__content-four .title .arrow { transform: translateY(-4px); width: 100px; height: 44px; } } @media (max-width: 767.98px) { .banner__content-four .title .arrow { width: 80px; height: 35px; transform: translateY(-10px); } } @media (max-width: 1199.98px) { .banner__content-four .title .arrow svg { width: 60px; height: auto; } } @media (max-width: 767.98px) { .banner__content-four .title .arrow svg { width: 40px; } } @media (max-width: 991.98px) { .banner__content-five { text-align: center; } } .banner__content-five .sub-title { display: inline-flex; font-weight: 500; text-transform: uppercase; color: var(--tg-theme-primary); line-height: 1; position: relative; gap: 7px; align-items: center; margin-bottom: 15px; } .banner__content-five .sub-title::after { content: ""; width: 30px; height: 3px; background: var(--tg-theme-primary); -webkit-border-radius: 3px; -moz-border-radius: 3px; -o-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px; } .banner__content-five .title { margin-bottom: 12px; font-size: 60px; text-transform: capitalize; } @media (max-width: 1500px) { .banner__content-five .title { font-size: 55px; } } @media (max-width: 1199.98px) { .banner__content-five .title { font-size: 45px; } } @media (max-width: 767.98px) { .banner__content-five .title { font-size: 38px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .banner__content-five .title { font-size: 42px; } } .banner__content-five .title span { font-weight: 500; } .banner__content-five p { margin-bottom: 32px; font-size: 18px; font-weight: 500; text-transform: capitalize; line-height: 1.6; width: 80%; } @media (max-width: 1500px) { .banner__content-five p { width: 90%; } } @media (max-width: 991.98px) { .banner__content-five p { width: 100%; } } .banner__content-six { position: relative; margin-bottom: 35px; } .banner__content-six .title { margin-bottom: 30px; font-size: 80px; text-transform: uppercase; line-height: 1; width: 47%; } @media (max-width: 1500px) { .banner__content-six .title { font-size: 75px; } } @media (max-width: 1199.98px) { .banner__content-six .title { font-size: 60px; } } @media (max-width: 991.98px) { .banner__content-six .title { font-size: 55px; margin-bottom: 10px; width: 100%; } } @media (max-width: 767.98px) { .banner__content-six .title { font-size: 48px; margin-bottom: 0; } } .banner__content-six .title-two { margin-bottom: 0; font-size: 80px; text-transform: uppercase; line-height: 1; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 10px; } @media (max-width: 1500px) { .banner__content-six .title-two { font-size: 75px; } } @media (max-width: 1199.98px) { .banner__content-six .title-two { font-size: 60px; } } @media (max-width: 991.98px) { .banner__content-six .title-two { font-size: 55px; } } @media (max-width: 767.98px) { .banner__content-six .title-two { font-size: 48px; } } .banner__content-six .title-two svg { color: var(--tg-theme-primary); } @media (max-width: 991.98px) { .banner__content-six .title-two svg { width: 55px; height: auto; } } @media (max-width: 767.98px) { .banner__content-six .title-two svg { display: none; } } .banner__content-six p { margin-bottom: 0; position: absolute; right: 70px; width: 45%; top: 0; } @media (max-width: 1199.98px) { .banner__content-six p { right: 26px; width: 49%; top: -25px; } } @media (max-width: 991.98px) { .banner__content-six p { position: initial; width: 100%; margin-top: 20px; } } @media (max-width: 991.98px) { .banner__content-seven { text-align: center; } } .banner__content-seven .sub-title { display: block; text-transform: uppercase; color: var(--tg-theme-primary); font-size: 16px; font-weight: 500; margin-bottom: 10px; } .banner__content-seven .title { margin-bottom: 10px; font-size: 50px; width: 90%; } @media (max-width: 1199.98px) { .banner__content-seven .title { font-size: 43px; width: 100%; } } @media (max-width: 767.98px) { .banner__content-seven .title { font-size: 38px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .banner__content-seven .title { font-size: 40px; } } .banner__content-seven p { font-size: 18px; text-transform: capitalize; margin-bottom: 35px; } .banner__content-bottom { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 25px; flex-wrap: wrap; } @media (max-width: 991.98px) { .banner__content-bottom { text-align: left; justify-content: center; } } .banner__mask-img { -webkit-mask-image: url(../img/banner/mask_img.svg); mask-image: url(../img/banner/mask_img.svg); -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; width: 1224px; height: 668px; margin: 0 auto; } @media (max-width: 1199.98px) { .banner__mask-img { width: 935px; height: 512px; } } @media (max-width: 991.98px) { .banner__mask-img { width: 695px; height: 382px; } } @media (max-width: 767.98px) { .banner__mask-img { width: 100%; height: auto; -webkit-mask-image: none; mask-image: none; border-radius: 20px; overflow: hidden; } } .banner__mask-img img { width: 100%; height: 100%; object-fit: cover; } .banner__img { position: relative; } @media (max-width: 991.98px) { .banner__img { text-align: center; } } .banner__img img { max-width: unset; } @media (max-width: 1500px) { .banner__img img { max-width: 90%; } } @media (max-width: 991.98px) { .banner__img img { max-width: 100%; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .banner__img img { max-width: 90%; margin: 0 auto; } } .banner__img .shape { position: absolute; left: -75px; top: 0; max-width: unset; z-index: -1; } @media (max-width: 1500px) { .banner__img .shape { max-width: 600px; } } @media (max-width: 1199.98px) { .banner__img .shape { max-width: 450px; left: -50px; } } @media (max-width: 991.98px) { .banner__img .shape { max-width: 500px; left: -50px; } } @media (max-width: 767.98px) { .banner__img .shape { max-width: 100%; left: 0; } } .banner__img-two { position: relative; text-align: right; padding-right: 30px; } @media (max-width: 991.98px) { .banner__img-two { margin-bottom: 60px; } } @media (max-width: 767.98px) { .banner__img-two { padding: 0; text-align: center; } } .banner__img-two .main-img img { -webkit-border-radius: 30px; -moz-border-radius: 30px; -o-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; } @media (max-width: 1199.98px) { .banner__img-two .main-img img { max-width: 80%; } } @media (max-width: 767.98px) { .banner__img-two .main-img img { max-width: 100%; } } .banner__img-two .shape-wrap img { position: absolute; z-index: -1; } .banner__img-two .shape-wrap img:nth-child(1) { left: 7%; top: 18%; } @media (max-width: 767.98px) { .banner__img-two .shape-wrap img:nth-child(1) { display: none; } } .banner__img-two .shape-wrap img:nth-child(2) { right: -19%; bottom: 29%; } @media (max-width: 1500px) { .banner__img-two .shape-wrap img:nth-child(2) { right: -9%; } } @media (max-width: 1199.98px) { .banner__img-two .shape-wrap img:nth-child(2) { right: -7%; max-width: 100px; } } @media (max-width: 767.98px) { .banner__img-two .shape-wrap img:nth-child(2) { display: none; } } .banner__img-two .shape-wrap img:nth-child(3) { right: -3%; bottom: -6%; } @media (max-width: 767.98px) { .banner__img-two .shape-wrap img:nth-child(3) { right: -1%; bottom: -10%; max-width: 120px; } } .banner__img-two .shape-wrap img:nth-child(4) { left: 30px; bottom: 65px; z-index: 1; -webkit-border-radius: 11px; -moz-border-radius: 11px; -o-border-radius: 11px; -ms-border-radius: 11px; border-radius: 11px; } @media (max-width: 1199.98px) { .banner__img-two .shape-wrap img:nth-child(4) { left: 0; max-width: 200px; } } @media (max-width: 767.98px) { .banner__img-two .shape-wrap img:nth-child(4) { display: none; } } .banner__img-two .shape-wrap img:nth-child(5) { left: 14%; bottom: 0; max-width: unset; z-index: -2; } @media (max-width: 1199.98px) { .banner__img-two .shape-wrap img:nth-child(5) { left: 5%; max-width: 100%; } } .banner__img-three { position: relative; z-index: 1; } @media (max-width: 991.98px) { .banner__img-three { margin-bottom: 50px; } } .banner__img-three > img { max-width: unset; } @media (max-width: 1199.98px) { .banner__img-three > img { max-width: 100%; } } .banner__img-three > img:nth-child(2) { position: absolute; left: -2%; bottom: 23%; } @media (max-width: 1199.98px) { .banner__img-three > img:nth-child(2) { max-width: 150px; } } @media (max-width: 991.98px) { .banner__img-three > img:nth-child(2) { bottom: 35%; } } @media (max-width: 767.98px) { .banner__img-three > img:nth-child(2) { max-width: 120px; bottom: 33%; } } .banner__img-three > img.shape { position: absolute; left: 0; top: -5%; z-index: -1; } .banner__img-four { position: relative; } .banner__img-four img { border-radius: 25px 80px; width: 100%; height: 560px; object-fit: cover; } @media (max-width: 1500px) { .banner__img-four img { height: 500px; } } @media (max-width: 991.98px) { .banner__img-four img { height: 450px; } } .banner__img-four .play-btn { width: 80px; height: 80px; background: var(--tg-color-white-default); position: absolute; left: 45px; bottom: 45px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; } .banner__img-four .play-btn svg { width: 24px; height: auto; } .banner__img-wrap { position: relative; margin-bottom: 90px; } @media (max-width: 1199.98px) { .banner__img-wrap { margin-bottom: 70px; } } @media (max-width: 767.98px) { .banner__img-wrap { margin-bottom: 60px; } } .banner__img-wrap > p { margin-bottom: 0; color: var(--tg-color-gray-4); position: absolute; right: 22px; top: 15px; width: 40%; font-size: 18px; line-height: 1.55; } @media (max-width: 1199.98px) { .banner__img-wrap > p { font-size: 14px; } } @media (max-width: 991.98px) { .banner__img-wrap > p { font-size: 16px; position: unset; width: 100%; margin-bottom: 30px; } } .banner__client { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 8px; } .banner__client .content .count { font-size: 24px; font-weight: 600; margin-bottom: 8px; line-height: 1; } .banner__client .content p { margin-bottom: 0; font-size: 16px; font-weight: 500; line-height: 1; } .banner__form { width: 89%; position: relative; } @media (max-width: 991.98px) { .banner__form { width: 100%; } } .banner__form input { -webkit-border-radius: 100px; -moz-border-radius: 100px; -o-border-radius: 100px; -ms-border-radius: 100px; border-radius: 100px; padding: 11px 180px 11px 20px; } .banner__form input::placeholder { text-transform: capitalize; color: var(--tg-color-gray-9); } .banner__form button { position: absolute; right: 0; top: 0; padding: 17px 25px; height: 50px; } .banner__social-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 57px; position: absolute; right: 90px; top: 50%; transform: translateY(-50%) rotate(-180deg); writing-mode: vertical-lr; flex-direction: row-reverse; z-index: 1; } @media (max-width: 1500px) { .banner__social-wrap { right: 50px; } } @media (max-width: 1199.98px) { .banner__social-wrap { right: 30px; } } @media (max-width: 991.98px) { .banner__social-wrap { display: none; } } .banner__social-wrap .title { display: block; letter-spacing: 3.2px; text-transform: uppercase; font-weight: 600; font-size: 16px; color: var(--tg-border-1); position: relative; line-height: 1; } .banner__social-wrap .title::before { content: ""; position: absolute; left: 50%; top: -40px; transform: translateX(-50%); width: 2px; height: 24px; background: var(--tg-theme-secondary); } .banner__social-wrap .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 25px; } .banner__social-wrap .list-wrap li { line-height: 0; } .banner__social-wrap .list-wrap li a { color: var(--tg-theme-secondary); transform: rotate(90deg); display: block; } .banner__social-wrap .list-wrap li a svg { width: 20px; height: 20px; } .banner__social-wrap .list-wrap li a:hover { color: var(--tg-theme-primary); } .banner__social-wrap-two { right: auto; left: 90px; top: 37%; transform: translateY(0) rotate(-180deg); } @media (max-width: 1500px) { .banner__social-wrap-two { left: 25px; } } @media (max-width: 1199.98px) { .banner__social-wrap-two { display: none; } } .banner__side-wrap { position: absolute; left: 0; top: 0; bottom: 0; border-left: 1px solid #DEE0EB; z-index: 1; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 12px; writing-mode: vertical-lr; transform: rotate(180deg); justify-content: center; padding: 25px 20px; width: 95px; } @media (max-width: 1199.98px) { .banner__side-wrap { display: none; } } .banner__side-wrap i { font-size: 24px; color: var(--tg-border-1); } .banner__side-wrap span { font-size: 16px; display: block; font-weight: 500; color: var(--tg-border-1); } .banner__shape img { position: absolute; left: 0; bottom: 0; z-index: -1; } @media (max-width: 1500px) { .banner__shape img { max-width: 130px; } } @media (max-width: 1199.98px) { .banner__shape img { max-width: 100px; } } .banner__shape-two img { position: absolute; z-index: -1; } .banner__shape-two img:nth-child(1) { left: 7%; top: 31%; } @media (max-width: 1500px) { .banner__shape-two img:nth-child(1) { left: 4%; top: 20%; } } .banner__shape-two img:nth-child(2) { left: 44%; top: 28%; } @media (max-width: 1199.98px) { .banner__shape-two img:nth-child(2) { top: 20%; } } @media (max-width: 991.98px) { .banner__shape-two img:nth-child(2) { top: 15%; z-index: 1; } } .banner__shape-three img { position: absolute; right: 26%; top: 18%; z-index: -1; } @media (max-width: 991.98px) { .banner__shape-three img { display: none; } } .business-growth-box { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 10px; background: var(--tg-color-white-default); position: absolute; right: -20%; top: 20%; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; padding: 10px 20px 10px 10px; } @media (max-width: 1500px) { .business-growth-box { right: -9%; } } @media (max-width: 767.98px) { .business-growth-box { display: none; } } .business-growth-box .icon { width: 60px; height: 60px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; background: var(--tg-theme-primary); color: var(--tg-color-white-default); font-size: 40px; } .business-growth-box .content { text-align: left; } .business-growth-box .content .title { font-size: 15px; font-weight: 500; margin-bottom: 5px; } .business-growth-box .content .count { font-size: 24px; margin-bottom: 0; } .happy__clients-wrap { background: var(--tg-color-white-default); -webkit-border-radius: 22px; -moz-border-radius: 22px; -o-border-radius: 22px; -ms-border-radius: 22px; border-radius: 22px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 10px; padding: 17px 24px 17px 28px; position: absolute; left: 0; bottom: 44px; } @media (max-width: 1199.98px) { .happy__clients-wrap { padding: 15px 15px 15px 15px; bottom: 35px; } } @media (max-width: 991.98px) { .happy__clients-wrap { display: none; } } .happy__clients-wrap .count { margin-bottom: 0; font-size: 40px; } @media (max-width: 1199.98px) { .happy__clients-wrap .count { font-size: 30px; } } .happy__clients-wrap span { font-size: 16px; font-weight: 600; color: var(--tg-theme-secondary); line-height: 1.25; } @media (max-width: 1199.98px) { .happy__clients-wrap span { font-size: 14px; } } .circle__wrap { position: absolute; right: 94px; bottom: 14px; width: 168px; height: 168px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; border: 33px solid var(--tg-color-white-default); } @media (max-width: 1199.98px) { .circle__wrap { right: 54px; } } @media (max-width: 991.98px) { .circle__wrap { right: 19px; } } @media (max-width: 767.98px) { .circle__wrap { display: none; } } .circle__wrap .icon { width: 86px; height: 86px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-color-white-default); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; color: var(--tg-theme-primary); position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .circle__wrap .content .circle { margin-bottom: 0; background: var(--tg-color-white-default); text-transform: uppercase; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: 16px; -webkit-animation-duration: 25s; animation-duration: 15s; font-weight: 600; } .circle__wrap .content .circle span { position: absolute; top: -76px; display: inline-block; transform-origin: 0 76px; } .circle__wrap-two { position: relative; z-index: 1; margin: 0 auto; right: 0; bottom: 0; border: 0; } @media (max-width: 767.98px) { .circle__wrap-two { display: block; } } .circle__wrap-two .icon { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .circle__wrap-two .content .circle { font-weight: 500; } .circle__wrap-two .content .circle span { top: -80px; transform-origin: 0 80px; } .circle__wrap-three { margin: 0 0 35px; margin-left: auto; } @media (max-width: 1199.98px) { .circle__wrap-three { right: 28px; } } @media (max-width: 991.98px) { .circle__wrap-three { display: none; } } /*============================= 03. Slider ===============================*/ .slider__area { position: relative; z-index: 1; } .slider__area-two { position: relative; z-index: 1; } .slider__area-four { position: relative; z-index: 1; } .slider__area-five { position: relative; z-index: 1; } .slider__area-five .swiper-slide { min-height: 750px; padding: 100px 0; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; background: var(--tg-color-gray-13); } @media (max-width: 1500px) { .slider__area-five .swiper-slide { min-height: 600px; } } @media (max-width: 991.98px) { .slider__area-five .swiper-slide { min-height: 500px; padding: 90px 0 120px; } } .slider__bg { min-height: 670px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; position: relative; z-index: 1; padding: 70px 0 120px; } @media (max-width: 1500px) { .slider__bg { min-height: 600px; } } @media (max-width: 991.98px) { .slider__bg { min-height: 670px; } } @media (max-width: 767.98px) { .slider__bg { padding: 150px 0 100px; } } .slider__bg::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0.5; background: linear-gradient(78deg, #000 100%, #222 100%); z-index: -1; } .slider__bg-two { background-size: cover; background-position: center; position: relative; z-index: 1; overflow: hidden; min-height: 740px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; padding: 120px 0; } @media (max-width: 1500px) { .slider__bg-two { min-height: 600px; } } @media (max-width: 1199.98px) { .slider__bg-two { min-height: 550px; } } @media (max-width: 991.98px) { .slider__bg-two { min-height: 500px; } } .slider__bg-two::before { content: ""; position: absolute; left: 36.5%; bottom: -30px; width: 80px; height: 105px; background: #002A96; clip-path: polygon(50% 0%, 100% 0%, 50% 100%, 0% 100%); transform: rotate(1.692deg); } @media (max-width: 1800px) { .slider__bg-two::before { left: 35.5%; transform: rotate(-0.308deg); } } @media (max-width: 1199.98px) { .slider__bg-two::before { left: 38.5%; transform: rotate(-6.308deg); } } @media (max-width: 991.98px) { .slider__bg-two::before { display: none; } } .slider__bg-two .shape img { position: absolute; left: 5px; bottom: -20px; } @media (max-width: 1800px) { .slider__bg-two .shape img { width: 170px; } } @media (max-width: 1500px) { .slider__bg-two .shape img { width: 130px; } } @media (max-width: 1199.98px) { .slider__bg-two .shape img { display: none; } } .slider__bg-three { background-size: cover; background-position: center; height: 100%; position: absolute; right: 0; top: 0; width: 60%; clip-path: polygon(25% 0%, 100% 0%, 100% 100%, 0% 100%); z-index: -1; } @media (max-width: 1199.98px) { .slider__bg-three { width: 55%; } } @media (max-width: 991.98px) { .slider__bg-three { display: none; } } .slider__bg-three::before { content: ""; position: absolute; left: 23%; bottom: 12px; width: 158px; height: 243px; background: rgba(0, 42, 150, 0.9); clip-path: polygon(56% 0%, 100% 0%, 44% 100%, 0% 100%); transform: rotate(1.251deg); } @media (max-width: 1800px) { .slider__bg-three::before { transform: rotate(-1deg); } } @media (max-width: 1500px) { .slider__bg-three::before { left: 20%; bottom: 15px; } } @media (max-width: 1199.98px) { .slider__bg-three::before { display: none; } } .slider__bg-three::after { content: ""; position: absolute; left: 148px; top: 50%; transform: translateY(-50%) rotate(21deg); width: 220px; height: 200%; background: rgba(0, 71, 255, 0.95); } @media (max-width: 1800px) { .slider__bg-three::after { transform: translateY(-50%) rotate(19deg); left: 90px; } } @media (max-width: 1500px) { .slider__bg-three::after { left: 20px; } } @media (max-width: 1199.98px) { .slider__bg-three::after { left: -62px; transform: translateY(-50%) rotate(14deg); } } .slider__bg-four { background-size: cover; background-position: center; min-height: 740px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; position: relative; z-index: 1; padding: 100px 0; cursor: grab; } @media (max-width: 1500px) { .slider__bg-four { min-height: 650px; } } @media (max-width: 991.98px) { .slider__bg-four { min-height: 600px; } } .slider__bg-four::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: linear-gradient(90deg, rgba(0, 0, 0, 0.2) 15.68%, rgba(0, 0, 0, 0) 77.23%); z-index: -1; } .slider__bg-four .shape img { position: absolute; z-index: -1; } .slider__bg-four .shape img:nth-child(1) { left: 0; bottom: 0; } @media (max-width: 1500px) { .slider__bg-four .shape img:nth-child(1) { max-width: 230px; } } @media (max-width: 767.98px) { .slider__bg-four .shape img:nth-child(1) { max-width: 150px; } } .slider__bg-four .shape img:nth-child(2) { right: 0; top: 0; } @media (max-width: 1500px) { .slider__bg-four .shape img:nth-child(2) { max-width: 250px; } } @media (max-width: 1199.98px) { .slider__bg-four .shape img:nth-child(2) { max-width: 200px; } } @media (max-width: 991.98px) { .slider__bg-four .shape img:nth-child(2) { max-width: 170px; } } @media (max-width: 767.98px) { .slider__bg-four .shape img:nth-child(2) { max-width: 150px; } } .slider__bg-five { background-size: cover; background-position: center; padding: 250px 0 120px; min-height: 820px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; } @media (max-width: 1500px) { .slider__bg-five { min-height: 740px; } } @media (max-width: 1199.98px) { .slider__bg-five { min-height: 650px; padding: 230px 0 110px; } } @media (max-width: 991.98px) { .slider__bg-five { min-height: 570px; padding: 130px 0 100px; } } .slider__bg-six { background-size: cover; background-position: center; width: 50%; height: 100%; position: absolute; right: 0; top: 0; } @media (max-width: 991.98px) { .slider__bg-six { display: none; } } .slider__bg-shape { position: absolute; right: 0; top: 0; width: 100%; height: 100%; background-size: cover; background-position: center; } .slider__content { margin-top: 20px; } @media (max-width: 991.98px) { .slider__content { margin-top: 0; text-align: center; } } .slider__content .title { margin-bottom: 20px; font-size: 80px; color: var(--tg-color-white-default); text-transform: capitalize; } @media (max-width: 1500px) { .slider__content .title { font-size: 75px; } } @media (max-width: 1199.98px) { .slider__content .title { font-size: 65px; } } @media (max-width: 767.98px) { .slider__content .title { font-size: 37px; } } .slider__content p { margin-bottom: 30px; font-size: 18px; color: var(--tg-color-gray-4); text-transform: capitalize; width: 95%; } @media (max-width: 1199.98px) { .slider__content p { width: 100%; } } .slider__content-two { margin-top: -35px; position: relative; } @media (max-width: 991.98px) { .slider__content-two { text-align: center; } } .slider__content-two .sub-title { display: block; color: var(--tg-theme-primary); text-transform: uppercase; font-weight: 500; line-height: 1.4; margin-bottom: 3px; } .slider__content-two .title { margin-bottom: 12px; font-size: 60px; font-weight: 700; text-transform: capitalize; line-height: 1.1; } @media (max-width: 1500px) { .slider__content-two .title { font-size: 55px; } } @media (max-width: 1199.98px) { .slider__content-two .title { font-size: 48px; } } @media (max-width: 767.98px) { .slider__content-two .title { font-size: 45px; } } .slider__content-two p { margin-bottom: 27px; font-size: 18px; line-height: 1.55; text-transform: capitalize; } .slider__content-three { margin-top: -30px; } @media (max-width: 991.98px) { .slider__content-three { text-align: center; margin-top: 0; } } .slider__content-three .sub-title { font-size: 16px; font-weight: 500; text-transform: uppercase; color: var(--tg-color-white-default); display: block; line-height: 1.2; margin-bottom: 5px; } .slider__content-three .title { margin-bottom: 10px; color: var(--tg-color-white-default); font-size: 60px; text-transform: capitalize; } @media (max-width: 1199.98px) { .slider__content-three .title { font-size: 50px; } } @media (max-width: 767.98px) { .slider__content-three .title { font-size: 45px; } } .slider__content-three p { margin-bottom: 25px; font-size: 18px; font-weight: 500; color: var(--tg-color-white-default); line-height: 1.6; } @media (max-width: 991.98px) { .slider__content-four { text-align: center; } } .slider__content-four .sub-title { display: block; font-size: 16px; text-transform: uppercase; color: var(--tg-theme-primary); font-weight: 500; line-height: 1.2; margin-bottom: 5px; } .slider__content-four .title { margin-bottom: 10px; font-size: 60px; text-transform: capitalize; } @media (max-width: 1199.98px) { .slider__content-four .title { font-size: 50px; } } @media (max-width: 767.98px) { .slider__content-four .title { font-size: 40px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .slider__content-four .title { font-size: 42px; } } .slider__content-four p { margin-bottom: 30px; font-size: 18px; line-height: 1.6; width: 85%; } @media (max-width: 1199.98px) { .slider__content-four p { margin-bottom: 20px; font-size: 18px; line-height: 1.6; width: 100%; } } @media (max-width: 1500px) { .slider__content-five { margin-left: 90px; } } @media (max-width: 1199.98px) { .slider__content-five { margin-left: 0; } } @media (max-width: 991.98px) { .slider__content-five { text-align: center; } } .slider__content-five .sub-title { display: block; font-size: 16px; font-weight: 500; text-transform: uppercase; color: var(--tg-theme-primary); margin-bottom: 12px; } .slider__content-five .title { font-size: 50px; text-transform: capitalize; margin-bottom: 17px; } @media (max-width: 1500px) { .slider__content-five .title { font-size: 45px; } } @media (max-width: 767.98px) { .slider__content-five .title { font-size: 38px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .slider__content-five .title { font-size: 42px; } } .slider__content-five p { margin-bottom: 28px; font-size: 18px; line-height: 1.6; } .slider__nav { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 15px; position: absolute; right: 85px; top: 50%; z-index: 1; flex-direction: column; transform: translateY(-50%); } @media (max-width: 991.98px) { .slider__nav { display: none; } } .slider__nav button { width: 45px; height: 70px; border: none; -webkit-border-radius: 125px; -moz-border-radius: 125px; -o-border-radius: 125px; -ms-border-radius: 125px; border-radius: 125px; background: var(--tg-color-white-default); color: var(--tg-theme-secondary); } .slider__nav button:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .slider__nav-two { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; position: absolute; right: 98px; bottom: 36%; z-index: 1; flex-direction: column; gap: 10px; } @media (max-width: 991.98px) { .slider__nav-two { display: none; } } .slider__nav-two button { width: 48px; height: 48px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; padding: 0; -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; border: 1px solid #D1D1D1; background: var(--tg-color-white-default); color: var(--tg-heading-color); } .slider__nav-two button:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); border-color: var(--tg-theme-primary); } .slider__nav-three { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; position: absolute; left: 50%; bottom: 0; z-index: 1; } @media (max-width: 991.98px) { .slider__nav-three { transform: translateX(-50%); } } .slider__nav-three button { border: none; width: 60px; height: 60px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; padding: 0; color: var(--tg-color-white-default); background: var(--tg-theme-primary); } .slider__nav-three button.slider-button-next { background: #1f5dff; } .slider__pagination { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; position: absolute; left: 17.8% !important; bottom: 115px !important; z-index: 2; gap: 5px; } @media (max-width: 1800px) { .slider__pagination { left: 11.8% !important; } } @media (max-width: 1500px) { .slider__pagination { left: 5% !important; } } @media (max-width: 1199.98px) { .slider__pagination { left: 4% !important; bottom: 85px !important; } } @media (max-width: 991.98px) { .slider__pagination { left: 50% !important; transform: translateX(-50%); bottom: 50px !important; justify-content: center; } } .slider__pagination span { width: 18px; height: 18px; padding: 0; position: relative; border: 1px solid #ADAFBB; background: transparent; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; opacity: 1; margin: 0 !important; -webkit-transition: all 0.2s ease-out 0s; -moz-transition: all 0.2s ease-out 0s; -ms-transition: all 0.2s ease-out 0s; -o-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; } .slider__pagination span::before { content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 8px; height: 8px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; background: var(--tg-body-color); -webkit-transition: all 0.2s ease-out 0s; -moz-transition: all 0.2s ease-out 0s; -ms-transition: all 0.2s ease-out 0s; -o-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; } .slider__pagination span.swiper-pagination-bullet-active { width: 24px; height: 24px; } .slider__pagination span.swiper-pagination-bullet-active::before { width: 12px; height: 12px; background-color: var(--tg-theme-primary); } .slider__bg.swiper-slide-active .slider__content .title { -webkit-animation-delay: 0.3s; animation-delay: 0.3s; -webkit-animation-duration: 0.8s; animation-duration: 0.8s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeInUp2; animation-name: fadeInUp2; } .slider__bg.swiper-slide-active .slider__content p { -webkit-animation-delay: 0.6s; animation-delay: 0.6s; -webkit-animation-duration: 0.8s; animation-duration: 0.8s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeInUp2; animation-name: fadeInUp2; } .slider__bg.swiper-slide-active .slider__content .tg-btn { -webkit-animation-delay: 0.9s; animation-delay: 0.9s; -webkit-animation-duration: 0.8s; animation-duration: 0.8s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeInUp2; animation-name: fadeInUp2; } .swiper-slide.swiper-slide-active .slider__content-five .sub-title, .swiper-slide.swiper-slide-active .slider__content-four .sub-title, .swiper-slide.swiper-slide-active .slider__content-three .sub-title, .swiper-slide.swiper-slide-active .slider__content-two .sub-title { -webkit-animation-delay: 0.3s; animation-delay: 0.3s; -webkit-animation-duration: 0.8s; animation-duration: 0.8s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeInUp2; animation-name: fadeInUp2; } .swiper-slide.swiper-slide-active .slider__content-five .title, .swiper-slide.swiper-slide-active .slider__content-four .title, .swiper-slide.swiper-slide-active .slider__content-three .title, .swiper-slide.swiper-slide-active .slider__content-two .title { -webkit-animation-delay: 0.6s; animation-delay: 0.6s; -webkit-animation-duration: 0.8s; animation-duration: 0.8s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeInUp2; animation-name: fadeInUp2; } .swiper-slide.swiper-slide-active .slider__content-five p, .swiper-slide.swiper-slide-active .slider__content-four p, .swiper-slide.swiper-slide-active .slider__content-three p, .swiper-slide.swiper-slide-active .slider__content-two p { -webkit-animation-delay: 0.9s; animation-delay: 0.9s; -webkit-animation-duration: 0.8s; animation-duration: 0.8s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeInUp2; animation-name: fadeInUp2; } .swiper-slide.swiper-slide-active .slider__content-five .tg-btn, .swiper-slide.swiper-slide-active .slider__content-four .tg-btn, .swiper-slide.swiper-slide-active .slider__content-three .tg-btn, .swiper-slide.swiper-slide-active .slider__content-two .tg-btn { -webkit-animation-delay: 1.2s; animation-delay: 1.2s; -webkit-animation-duration: 0.8s; animation-duration: 0.8s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeInUp2; animation-name: fadeInUp2; } .swiper-slide.swiper-slide-active .shape img { -webkit-animation-delay: 1.2s; animation-delay: 1.2s; -webkit-animation-duration: 0.8s; animation-duration: 0.8s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeInUp2; animation-name: fadeInUp2; } .swiper-slide.swiper-slide-active.slider__bg-four .shape img:nth-child(1) { -webkit-animation-delay: 1.2s; animation-delay: 1.2s; -webkit-animation-duration: 0.8s; animation-duration: 0.8s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeInUp2; animation-name: fadeInUp2; } .swiper-slide.swiper-slide-active.slider__bg-four .shape img:nth-child(2) { -webkit-animation-delay: 1.2s; animation-delay: 1.2s; -webkit-animation-duration: 0.8s; animation-duration: 0.8s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeDown2; animation-name: fadeDown2; } /*============================= 04. Brand ===============================*/ .brand__area { border-bottom: 1px solid var(--tg-border-2); padding: 52px 0; } .brand__area-three { position: relative; z-index: 1; } .brand__area-three::before { content: ""; position: absolute; left: -194px; top: 260px; width: 320px; height: 320px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; background: #DFD2FB; filter: blur(150px); z-index: -1; } .brand__area-three::after { content: ""; position: absolute; right: -181px; top: 298px; width: 320px; height: 320px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; background: #C3CEFA; filter: blur(150px); z-index: -1; } .brand__area-four { padding: 75px 0; } .brand-item { min-height: 46px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; } .brand-item img { cursor: pointer; } .brand-item-two { padding: 50px 40px; border-right: 1px solid var(--tg-border-12); border-top: 1px solid var(--tg-border-12); width: 100%; height: 186px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-color-white-default); } @media (max-width: 991.98px) { .brand-item-two { padding: 30px 20px; height: 160px; } } @media (max-width: 767.98px) { .brand-item-two { height: 120px; } } .brand-item-two img { cursor: pointer; } .brand-item-three { padding: 20px 20px; border-right: 1px solid var(--tg-border-2); border-top: 1px solid var(--tg-border-2); width: 100%; height: 140px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-color-white-default); } @media (max-width: 1199.98px) { .brand-item-three { height: 120px; } } .brand-item-three img { cursor: pointer; } .brand-item-wrap { border-bottom: 1px solid var(--tg-border-12); border-left: 1px solid var(--tg-border-12); margin-bottom: 0; display: grid; grid-template-columns: repeat(4, 1fr); } @media (max-width: 767.98px) { .brand-item-wrap { grid-template-columns: repeat(2, 1fr); } } .brand-item-wrap-two { border-top: 1px solid var(--tg-border-2); padding: 84px 0; } .brand-item-wrap-three { border-bottom: 1px solid var(--tg-border-4); padding: 64px 0; } .brand-item-wrap-four { border-color: var(--tg-border-2); grid-template-columns: repeat(6, 1fr); } @media (max-width: 991.98px) { .brand-item-wrap-four { grid-template-columns: repeat(3, 1fr); } } @media (max-width: 767.98px) { .brand-item-wrap-four { grid-template-columns: repeat(2, 1fr); } } .brand-item-wrap-five { padding: 80px 0 60px; border-bottom: 1px solid #dbdbdb; } .brand__content { text-align: center; margin-bottom: 50px; } .brand__content .title { margin-bottom: 0; font-size: 20px; font-weight: 400; color: var(--tg-border-1); } .brand__content .title span { position: relative; color: var(--tg-heading-color); font-weight: 600; } .brand__content .title span svg { position: absolute; left: -5px; bottom: -3px; color: var(--tg-theme-primary); } .brand__content-two { text-align: center; margin-bottom: 50px; } .brand__content-two .title { margin-bottom: 0; font-size: 18px; font-weight: 400; color: var(--tg-body-color); } .brand__content-two .title span { color: var(--tg-theme-primary); font-weight: 600; } .brand__content-three .section__title .title { line-height: 1.4; } .brand__content-three .section__title .title span { font-size: 30px; display: block; } /*============================= 05. About ===============================*/ .about__area-two { position: relative; z-index: 1; } .about__area-two::before { content: ""; position: absolute; right: -215px; top: -200px; width: 515px; height: 515px; background: #7838FF; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; z-index: -1; filter: blur(150px); opacity: 0.1; } @media (max-width: 991.98px) { .about__area-two::before { top: 0; } } .about__area-three { position: relative; z-index: 1; } .about__area-three::before { content: ""; position: absolute; right: -215px; bottom: -200px; width: 515px; height: 515px; background: #7838FF; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; z-index: -1; filter: blur(150px); opacity: 0.1; } .about__area-four { position: relative; z-index: 1; } .about__area-five { position: relative; z-index: 1; } .about__area-eight { background: var(--tg-color-gray-2); } @media (max-width: 991.98px) { .about__img-three { text-align: center; margin-bottom: 50px; } } .about__img-four { margin-left: -20px; position: relative; z-index: 1; } @media (max-width: 1199.98px) { .about__img-four { margin-left: -45px; } } @media (max-width: 991.98px) { .about__img-four { margin-left: 0; margin-bottom: 50px; } } .about__img-four .shape img { position: absolute; z-index: -1; left: -5%; top: 11%; } .about__img-five { width: 505px; flex: 0 0 auto; } @media (max-width: 1199.98px) { .about__img-five { width: 400px; } } @media (max-width: 767.98px) { .about__img-five { width: 100%; } } .about__img-five img { border-radius: 50px 200px 50px 50px; } .about__img-six { text-align: right; position: relative; padding-left: 40px; } @media (max-width: 991.98px) { .about__img-six { margin-bottom: 50px; } } @media (max-width: 767.98px) { .about__img-six { padding-left: 20px; } } .about__img-six::before { content: ""; position: absolute; left: 0; bottom: 80px; width: 100px; height: 70%; background: var(--tg-theme-primary); border-radius: 25px 0px 0px 25px; z-index: -1; } .about__img-six img { -webkit-border-radius: 50px; -moz-border-radius: 50px; -o-border-radius: 50px; -ms-border-radius: 50px; border-radius: 50px; } @media (max-width: 767.98px) { .about__img-six img { -webkit-border-radius: 30px; -moz-border-radius: 30px; -o-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; } } .about__img-wrap { position: relative; margin-right: 45px; } @media (max-width: 1199.98px) { .about__img-wrap { margin-right: 0; } } @media (max-width: 991.98px) { .about__img-wrap { margin-bottom: 60px; } } .about__img-wrap .shape img { position: absolute; z-index: -1; } .about__img-wrap .shape img:nth-child(1) { left: -6%; top: 42%; z-index: 1; } @media (max-width: 1199.98px) { .about__img-wrap .shape img:nth-child(1) { max-width: 90px; } } @media (max-width: 767.98px) { .about__img-wrap .shape img:nth-child(1) { left: -4%; top: 38%; } } .about__img-wrap .shape img:nth-child(2) { left: 20%; bottom: -6%; } @media (max-width: 1199.98px) { .about__img-wrap .shape img:nth-child(2) { left: 6%; } } @media (max-width: 767.98px) { .about__img-wrap .shape img:nth-child(2) { left: 1%; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .about__img-wrap .shape img:nth-child(2) { left: 16%; } } .about__img-wrap-two { position: relative; padding: 70px 80px 70px 0; margin-right: 35px; } @media (max-width: 1199.98px) { .about__img-wrap-two { padding: 70px 50px 70px 0; margin-right: 0; } } @media (max-width: 991.98px) { .about__img-wrap-two { margin-bottom: 50px; } } @media (max-width: 991.98px) { .about__img-wrap-two { padding: 30px 20px 30px 0; } } .about__img-wrap-two::before { content: ""; position: absolute; right: 0; top: 0; width: 84%; height: 100%; background: var(--tg-color-white-default); z-index: -1; -webkit-border-radius: 20px 20px 107px 20px; -moz-border-radius: 20px 20px 107px 20px; -o-border-radius: 20px 20px 107px 20px; -ms-border-radius: 20px 20px 107px 20px; border-radius: 20px 20px 107px 20px; } @media (max-width: 767.98px) { .about__img-wrap-two::before { -webkit-border-radius: 20px 20px 50px 20px; -moz-border-radius: 20px 20px 50px 20px; -o-border-radius: 20px 20px 50px 20px; -ms-border-radius: 20px 20px 50px 20px; border-radius: 20px 20px 50px 20px; } } .about__img-wrap-two > img { -webkit-border-radius: 30px; -moz-border-radius: 30px; -o-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; } @media (max-width: 767.98px) { .about__img-wrap-two > img { -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; } } .about__img-wrap-two .shape img { position: absolute; } .about__img-wrap-two .shape img:nth-child(1) { left: -50px; bottom: 0; z-index: -1; } .about__img-wrap-two .shape img:nth-child(2) { right: 4%; bottom: 25%; } @media (max-width: 767.98px) { .about__img-wrap-two .shape img:nth-child(2) { display: none; } } .about__img-wrap-three { margin-right: 80px; text-align: right; position: relative; z-index: 1; padding-bottom: 10px; } @media (max-width: 1199.98px) { .about__img-wrap-three { margin-right: 0; } } @media (max-width: 991.98px) { .about__img-wrap-three { margin-bottom: 50px; } } @media (max-width: 767.98px) { .about__img-wrap-three { padding: 0 0 40px 30px; } } .about__img-wrap-three > img:nth-child(2) { position: absolute; left: 0; bottom: 0; border: 8px solid var(--tg-color-white-default); } .about__img-wrap-three .rating-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 13px; justify-content: flex-end; text-align: left; margin-top: 20px; } @media (max-width: 767.98px) { .about__img-wrap-three .rating-wrap { display: none; } } .about__img-wrap-three .rating-wrap p { margin-bottom: 0; color: var(--tg-theme-secondary); font-weight: 500; font-size: 16px; text-transform: capitalize; line-height: 1.3; } .about__img-wrap-three .rating-wrap p span { font-size: 24px; font-weight: 700; line-height: 1.3; } .about__img-wrap-four { position: relative; padding-bottom: 30px; margin-right: 35px; z-index: 1; } @media (max-width: 1199.98px) { .about__img-wrap-four { margin-right: 0; padding-right: 50px; } } @media (max-width: 991.98px) { .about__img-wrap-four { margin-bottom: 50px; } } @media (max-width: 767.98px) { .about__img-wrap-four { padding-right: 0; text-align: center; } } .about__img-wrap-four::before { content: ""; position: absolute; right: 0; bottom: 0; width: 290px; height: 50px; background: var(--tg-theme-primary); z-index: -1; } @media (max-width: 767.98px) { .about__img-wrap-four::before { display: none; } } .about__img-wrap-four img:nth-child(1) { border: 12px solid var(--tg-color-white-default); } .about__img-wrap-four img:nth-child(2) { border: 10px solid var(--tg-color-white-default); position: absolute; right: 0; bottom: 0; } @media (max-width: 767.98px) { .about__img-wrap-four img:nth-child(2) { display: none; } } .about__images { padding-right: 30px; text-align: right; } @media (max-width: 767.98px) { .about__images { padding-right: 0; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .about__images { padding-right: 30px; } } .about__images img { -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; } .about__images img:nth-child(2) { -webkit-border-radius: 15px 20px 0px 15px; -moz-border-radius: 15px 20px 0px 15px; -o-border-radius: 15px 20px 0px 15px; -ms-border-radius: 15px 20px 0px 15px; border-radius: 15px 20px 0px 15px; margin-top: 24px; position: relative; z-index: 1; } .about__mask-img { -webkit-mask-image: url(../img/images/about_mask_img.svg); mask-image: url(../img/images/about_mask_img.svg); -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; width: 623px; height: 566px; margin: 0 auto; } @media (max-width: 1199.98px) { .about__mask-img { width: 495px; height: 452px; } } @media (max-width: 991.98px) { .about__mask-img { width: 575px; height: 523px; } } @media (max-width: 767.98px) { .about__mask-img { width: 330px; height: 300px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .about__mask-img { width: 513px; height: 468px; } } .about__mask-img img { width: 100%; height: 100%; object-fit: cover; } .about__content > p { margin-bottom: 25px; width: 95%; } .about__content-bottom { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 30px 70px; flex-wrap: wrap; } @media (max-width: 1199.98px) { .about__content-bottom { gap: 30px 30px; } } .about__content-bottom-two { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 20px 25px; } @media (max-width: 1199.98px) { .about__content-bottom-two { flex-wrap: wrap; flex-direction: column-reverse; align-items: flex-start; } } .about__content-bottom-two .rating-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 20px; width: 68%; } @media (max-width: 1199.98px) { .about__content-bottom-two .rating-wrap { width: 100%; } } .about__content-bottom-two .rating-wrap p { margin-bottom: 0; line-height: 1.2; font-size: 16px; font-weight: 500; text-transform: capitalize; color: var(--tg-heading-color); } .about__content-bottom-two .rating-wrap p span { font-size: 24px; font-weight: 600; } .about__content-two > p { font-size: 18px; margin-bottom: 38px; width: 90%; } @media (max-width: 1199.98px) { .about__content-two > p { margin-bottom: 30px; width: 100%; } } .about__content-three { margin-left: 30px; } @media (max-width: 1199.98px) { .about__content-three { margin-left: 0; } } .about__content-three > p { margin-bottom: 28px; width: 90%; } .about__content-four { margin-right: 55px; } @media (max-width: 991.98px) { .about__content-four { margin-right: 0; } } .about__content-four .section__title .title strong { font-style: italic; font-weight: 400; } .about__content-four > p { margin-bottom: 0; } .about__content-four .about__list-item-two li { margin-bottom: 14px; font-size: 18px; } .about__content-four .tg-btn { margin-top: 33px; } @media (max-width: 767.98px) { .about__content-four .tg-btn { margin-top: 23px; } } .about__content-five > p { margin-bottom: 30px; } .about__content-five .about__list-item-two { margin-bottom: 45px; } .about__content-six > p { margin-bottom: 50px; font-size: 20px; font-weight: 500; line-height: 1.5; } @media (max-width: 1199.98px) { .about__content-six > p { margin-bottom: 40px; } } .about__content-seven { margin-left: -45px; } @media (max-width: 1199.98px) { .about__content-seven { margin-left: 0; } } .about__content-seven p { margin-bottom: 18px; } .about__content-seven p.info-one { font-size: 18px; font-weight: 500; line-height: 1.6; margin-bottom: 18px; } .about__content-seven .about__list-item { margin-bottom: 35px; } @media (max-width: 1199.98px) { .about__content-seven .about__list-item { margin-bottom: 25px; } } .about__content-seven .about__list-item li { margin-bottom: 13px; } .about__content-seven .about__list-item li:last-child { margin-bottom: 0; } .about__content-eight .info-one { margin-bottom: 20px; font-size: 18px; font-weight: 500; color: var(--tg-theme-secondary); line-height: 1.4; } .about__content-eight p { margin-bottom: 20px; } .about__inner-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 30px 30px; margin-bottom: 35px; } @media (max-width: 767.98px) { .about__inner-wrap { flex-wrap: wrap; } } .about__inner-wrap-two { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 30px; margin-bottom: 45px; } @media (max-width: 1199.98px) { .about__inner-wrap-two { margin-bottom: 40px; gap: 20px; } } @media (max-width: 767.98px) { .about__inner-wrap-two { flex-wrap: wrap; } } .about__inner-wrap-three { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 18px; margin: 22px 0 35px; flex-wrap: wrap; } @media (max-width: 767.98px) { .about__inner-wrap-three { margin: 22px 0 25px; } } .about__inner-wrap-four { margin-left: -90px; margin-right: 60px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 30px 55px; } @media (max-width: 1500px) { .about__inner-wrap-four { margin-left: -50px; margin-right: 40px; gap: 30px 40px; } } @media (max-width: 1199.98px) { .about__inner-wrap-four { margin-left: -10px; margin-right: 20px; gap: 30px 25px; } } @media (max-width: 991.98px) { .about__inner-wrap-four { margin-left: 0; margin-right: 0; } } @media (max-width: 767.98px) { .about__inner-wrap-four { flex-wrap: wrap; } } .about__inner-wrap-five { margin-left: -20px; text-align: center; } @media (max-width: 991.98px) { .about__inner-wrap-five { margin-left: 0; margin-bottom: 50px; } } .about__inner-wrap-five .circle__wrap-two { margin-bottom: 45px; } .about__inner-wrap-five img { -webkit-border-radius: 30px; -moz-border-radius: 30px; -o-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; } .about__inner-wrap-six { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 30px 50px; margin-bottom: 60px; } @media (max-width: 1199.98px) { .about__inner-wrap-six { gap: 30px 35px; margin-bottom: 35px; } } @media (max-width: 767.98px) { .about__inner-wrap-six { flex-wrap: wrap; } } .about__inner-wrap-seven { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 30px; flex-wrap: wrap; justify-content: space-between; } .about__inner-wrap-eight { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 20px; flex-wrap: wrap; margin-bottom: 40px; } .about__inner-wrap-eight .about__list-item { background: var(--tg-color-white-default); position: relative; z-index: 1; padding: 20px 20px 20px 20px; } .about__inner-wrap-eight .about__list-item::before { content: ""; position: absolute; right: 0; top: 0; width: 4px; height: 100%; background: var(--tg-theme-primary); } .about__inner-box { position: relative; } .about__inner-box::before { content: ""; position: absolute; right: -18px; top: 0; width: 1px; height: 100%; background: #E3E3E3; } @media (max-width: 767.98px) { .about__inner-box::before { display: none; } } .about__inner-box:last-child::before { display: none; } .about__inner-box .icon { width: 80px; height: 80px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-color-gray-4); color: var(--tg-theme-primary); border-radius: 8px 18px; font-size: 45px; margin-bottom: 25px; } .about__inner-box .content .title { margin-bottom: 8px; font-size: 20px; font-weight: 600; } .about__inner-box .content p { margin-bottom: 0; } .about__list-box { width: 44.4%; flex: 0 0 auto; } @media (max-width: 767.98px) { .about__list-box { width: 100%; } } .about__list-box-item { background: var(--tg-color-gray-1); display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; margin-bottom: 15px; gap: 17px; padding: 29px 24px; } @media (max-width: 1199.98px) { .about__list-box-item { padding: 29px 18px; gap: 12px; } } @media (max-width: 767.98px) { .about__list-box-item { padding: 29px 24px; gap: 17px; } } .about__list-box-item:last-child { margin-bottom: 0; } .about__list-box-item .icon { font-size: 50px; line-height: 0; color: var(--tg-theme-primary); -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -ms-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; } .about__list-box-item .content .title { margin-bottom: 0; font-size: 17px; font-weight: 600; } @media (max-width: 767.98px) { .about__list-box-item .content .title br { display: none; } } .about__list-box-item:hover .icon { transform: rotateY(180deg); } .about__list-box-item-two { background: var(--tg-color-white-default); border: 1px solid #DFE1ED; margin-bottom: 20px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; padding: 29px 40px; justify-content: space-between; gap: 15px; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.06); } @media (max-width: 767.98px) { .about__list-box-item-two { flex-wrap: wrap; padding: 30px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .about__list-box-item-two { flex-wrap: nowrap; } } .about__list-box-item-two:last-child { margin-bottom: 0; } .about__list-box-item-two:hover { transform: translateY(-5px); } .about__list-box-item-two:hover .left-side-content .icon i { transform: rotateY(180deg); } .about__list-box-item-two .left-side-content { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 25px; } @media (max-width: 767.98px) { .about__list-box-item-two .left-side-content { gap: 20px; flex-wrap: wrap; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .about__list-box-item-two .left-side-content { flex-wrap: nowrap; } } .about__list-box-item-two .left-side-content .icon { position: relative; font-size: 42px; color: var(--tg-theme-primary); z-index: 1; } .about__list-box-item-two .left-side-content .icon::before { content: ""; position: absolute; left: -12px; top: -8px; width: 42px; height: 42px; background: var(--tg-color-gray-1); -webkit-border-radius: 7px; -moz-border-radius: 7px; -o-border-radius: 7px; -ms-border-radius: 7px; border-radius: 7px; z-index: -1; } .about__list-box-item-two .left-side-content .icon i { -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .about__list-box-item-two .content .title { margin-bottom: 0; font-size: 18px; font-weight: 600; } .about__list-box-item-two .content p { margin-bottom: 0; width: 93%; } .about__list-box-item-two .right-side-arrow a { width: 74px; height: 50px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-color-gray-1); color: var(--tg-theme-primary); -webkit-border-radius: 100px; -moz-border-radius: 100px; -o-border-radius: 100px; -ms-border-radius: 100px; border-radius: 100px; } .about__list-box-item-two .right-side-arrow a:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .about__inner-content p { margin-bottom: 25px; } .about__inner-img { position: relative; z-index: 1; padding-bottom: 18px; } .about__inner-img::before { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 18px; background: var(--tg-theme-primary); } .about__list-item li { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: flex-start; gap: 8px; font-size: 17px; font-weight: 500; line-height: 1; margin-bottom: 10px; } .about__list-item li:last-child { margin-bottom: 0; } .about__list-item li .icon { width: 22px; height: 22px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; border: 1.5px solid var(--tg-theme-primary); color: var(--tg-theme-primary); transform: translateY(-2px); flex: 0 0 auto; } .about__list-item-two li { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 9px; font-size: 17px; font-weight: 500; line-height: 1; margin-bottom: 19px; } .about__list-item-two li:last-child { margin-bottom: 0; } .about__list-item-two li .icon { width: 24px; height: 24px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; background: var(--tg-theme-primary); color: var(--tg-color-white-default); flex: 0 0 auto; } .about__list-item-three { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 16px 0; flex-wrap: wrap; } .about__list-item-three li { width: 33.33%; flex: 0 0 auto; margin-bottom: 0; } @media (max-width: 1199.98px) { .about__list-item-three li { width: 50%; } } @media (max-width: 767.98px) { .about__list-item-three li { width: 100%; } } .about__list-item-four { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; flex-wrap: wrap; gap: 16px 0; margin-bottom: 35px; } .about__list-item-four li { width: 50%; flex: 0 0 auto; margin-bottom: 0; } @media (max-width: 767.98px) { .about__list-item-four li { width: 100%; } } .about__list-item-white li { color: var(--tg-color-gray-2); } .about__shape img { position: absolute; z-index: -1; right: 15%; bottom: 10%; } @media (max-width: 767.98px) { .about__shape img { display: none; } } .about__shape-two img { position: absolute; left: 30px; top: 0; z-index: -1; } @media (max-width: 1199.98px) { .about__shape-two img { max-width: 240px; } } @media (max-width: 767.98px) { .about__shape-two img { display: none; } } .about__shape-three img { position: absolute; z-index: -1; } .about__shape-three img:nth-child(1) { left: 17%; top: 17%; } @media (max-width: 1800px) { .about__shape-three img:nth-child(1) { left: 11%; } } @media (max-width: 1500px) { .about__shape-three img:nth-child(1) { left: 5%; } } @media (max-width: 1199.98px) { .about__shape-three img:nth-child(1) { left: 1%; max-width: 200px; top: 19%; } } @media (max-width: 991.98px) { .about__shape-three img:nth-child(1) { display: none; } } .about__shape-three img:nth-child(2) { right: 10%; top: -10px; } @media (max-width: 1800px) { .about__shape-three img:nth-child(2) { right: 4%; } } @media (max-width: 1500px) { .about__shape-three img:nth-child(2) { max-width: 200px; right: 2%; } } @media (max-width: 1199.98px) { .about__shape-three img:nth-child(2) { max-width: 155px; } } .experience__wrap { background: var(--tg-theme-primary); -webkit-border-radius: 94px 16px 13px 13px; -moz-border-radius: 94px 16px 13px 13px; -o-border-radius: 94px 16px 13px 13px; -ms-border-radius: 94px 16px 13px 13px; border-radius: 94px 16px 13px 13px; padding: 38px 43px 246px 43px; position: absolute; right: 0; bottom: 0; } @media (max-width: 767.98px) { .experience__wrap { padding: 30px 20px 230px 32px; -webkit-border-radius: 70px 16px 13px 13px; -moz-border-radius: 70px 16px 13px 13px; -o-border-radius: 70px 16px 13px 13px; -ms-border-radius: 70px 16px 13px 13px; border-radius: 70px 16px 13px 13px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .experience__wrap { padding: 30px 20px 260px 32px; -webkit-border-radius: 70px 16px 13px 13px; -moz-border-radius: 70px 16px 13px 13px; -o-border-radius: 70px 16px 13px 13px; -ms-border-radius: 70px 16px 13px 13px; border-radius: 70px 16px 13px 13px; } } .experience__wrap .count { font-size: 64px; margin-bottom: 5px; color: #fecb00; line-height: 0.8; } @media (max-width: 1199.98px) { .experience__wrap .count { font-size: 50px; } } .experience__wrap span { display: block; font-size: 18px; font-weight: 500; color: #fecb00; text-transform: capitalize; line-height: 1.5; } .experience__wrap-two { text-align: left; background: var(--tg-theme-primary); display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 10px; border-radius: 0px 40px; position: absolute; left: 0; bottom: 0; border-top: 8px solid var(--tg-color-white-default); border-right: 8px solid var(--tg-color-white-default); padding: 19px 27px; } .experience__wrap-two .count { margin-bottom: 0; font-size: 64px; line-height: 1; color: var(--tg-color-white-default); } @media (max-width: 1199.98px) { .experience__wrap-two .count { font-size: 60px; } } @media (max-width: 767.98px) { .experience__wrap-two .count { font-size: 50px; } } .experience__wrap-two span { color: var(--tg-color-white-default); font-size: 20px; font-weight: 500; text-transform: capitalize; line-height: 1.2; } @media (max-width: 767.98px) { .experience__wrap-two span { font-size: 18px; } } .experience__wrap-three { background: var(--tg-theme-primary); display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 15px; border-radius: 0 10px 30px 0px; position: absolute; right: -21.3%; top: 29%; padding: 26px 40px 26px 80px; transform: rotate(-90deg); z-index: -1; } @media (max-width: 1199.98px) { .experience__wrap-three { right: -20.4%; top: 29%; padding: 26px 20px 26px 72px; } } @media (max-width: 767.98px) { .experience__wrap-three { display: none; } } .experience__wrap-three .count { color: var(--tg-color-white-default); margin-bottom: 0; font-size: 60px; line-height: 1; } @media (max-width: 1199.98px) { .experience__wrap-three .count { font-size: 40px; } } .experience__wrap-three span { color: var(--tg-color-white-default); font-size: 18px; font-weight: 500; line-height: 1.5; text-transform: capitalize; } @media (max-width: 1199.98px) { .experience__wrap-three span { font-size: 15px; } } .experience__wrap-four { background: var(--tg-theme-primary); text-align: center; padding: 52px 35px; position: absolute; right: 0; bottom: 16px; -webkit-border-radius: 40px 0 40px 0; -moz-border-radius: 40px 0 40px 0; -o-border-radius: 40px 0 40px 0; -ms-border-radius: 40px 0 40px 0; border-radius: 40px 0 40px 0; } @media (max-width: 767.98px) { .experience__wrap-four { padding: 30px 20px; } } .experience__wrap-four .count { margin-bottom: 6px; line-height: 0.8; font-size: 64px; font-weight: 700; color: var(--tg-color-white-default); } @media (max-width: 767.98px) { .experience__wrap-four .count { font-size: 50px; } } .experience__wrap-four span { display: block; line-height: 1.2; font-size: 20px; font-weight: 600; color: var(--tg-color-white-default); } @media (max-width: 767.98px) { .experience__wrap-four span { font-size: 16px; } } .experience__wrap-five { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; background: var(--tg-theme-primary); gap: 8px; -webkit-border-radius: 10px 15px 0px 15px; -moz-border-radius: 10px 15px 0px 15px; -o-border-radius: 10px 15px 0px 15px; -ms-border-radius: 10px 15px 0px 15px; border-radius: 10px 15px 0px 15px; position: absolute; right: 0; top: 0; padding: 21px 25px; } .experience__wrap-five .count { margin-bottom: 0; color: var(--tg-color-white-default); line-height: 0.8; font-size: 50px; } .experience__wrap-five span { display: block; line-height: 1.4; color: var(--tg-color-white-default); font-weight: 500; } .experience__wrap-six { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; background: var(--tg-theme-primary); gap: 12px; position: absolute; right: -13%; top: 35.5%; padding: 16px 36px; transform: rotate(-90deg); } @media (max-width: 1199.98px) { .experience__wrap-six { right: -16%; top: 24.5%; } } @media (max-width: 767.98px) { .experience__wrap-six { display: none; } } .experience__wrap-six .count { color: var(--tg-color-white-default); font-size: 50px; margin-bottom: 0; line-height: 1; } .experience__wrap-six span { color: var(--tg-color-white-default); display: block; font-size: 16px; font-weight: 500; line-height: 1.4; } .profit__wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; -webkit-border-radius: 10px 30px; -moz-border-radius: 10px 30px; -o-border-radius: 10px 30px; -ms-border-radius: 10px 30px; border-radius: 10px 30px; border: 1px solid var(--tg-border-3); background: var(--tg-color-white-default); box-shadow: 11px 11px 0px 0px rgba(0, 0, 0, 0.27); gap: 12px; padding: 17px 22px; position: absolute; left: -35px; bottom: 14%; z-index: 2; } @media (max-width: 767.98px) { .profit__wrap { display: none; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .profit__wrap { display: flex; } } .profit__wrap .content .title { margin-bottom: 0; font-size: 20px; font-weight: 600; } .profit__wrap .content span { display: block; font-size: 13px; font-weight: 500; } .profit__wrap-two { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; border: 1px solid #E1E1E1; background: var(--tg-color-white-default); gap: 10px; padding: 19px 23px; z-index: 2; } .profit__wrap-two .icon { font-size: 60px; line-height: 0; color: var(--tg-theme-primary); } .profit__wrap-two .content .title { margin-bottom: 5px; font-size: 20px; font-weight: 600; } .profit__wrap-two .content span { display: block; font-size: 13px; font-weight: 500; } .profit__wrap-five { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; background: var(--tg-theme-primary); position: absolute; gap: 5px; padding: 10px 15px; right: 0; bottom: 6px; } .profit__wrap-five .content .count { margin-bottom: 0; color: var(--tg-color-white-default); font-size: 24px; } .profit__wrap-five .content span { display: block; line-height: 1; font-size: 13px; font-weight: 600; color: var(--tg-color-white-default); } .author__wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 15px; } .author__wrap .thumb { width: 60px; height: 60px; flex: 0 0 auto; } .author__wrap .thumb img { width: 100%; border: 1px solid var(--tg-border-4); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } .author__wrap .content img { margin-bottom: 5px; } .author__wrap .content .title { margin-bottom: 0; font-size: 20px; font-weight: 500; } .author__wrap .content .title span { font-size: 16px; font-weight: 400; color: var(--tg-body-color); } .author__wrap-two { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; background: var(--tg-color-white-default); -webkit-border-radius: 18px; -moz-border-radius: 18px; -o-border-radius: 18px; -ms-border-radius: 18px; border-radius: 18px; overflow: hidden; gap: 12px; position: absolute; right: 0; bottom: 0; } @media (max-width: 991.98px) { .author__wrap-two { display: none; } } .author__wrap-two .thumb { width: 77px; flex: 0 0 auto; } .author__wrap-two .content { padding: 0 10px 0 0; } .author__wrap-two .content img { margin-bottom: 5px; } .author__wrap-two .content .title { margin-bottom: 0; font-size: 20px; font-weight: 500; } .author__wrap-two .content .title span { font-size: 16px; color: var(--tg-body-color); font-weight: 400; } .client__box { background: var(--tg-color-white-default); display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; padding: 32px 20px 32px 30px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; gap: 15px; } @media (max-width: 1199.98px) { .client__box { padding: 30px 20px 30px 25px; } } .client__box .icon { font-size: 50px; color: var(--tg-theme-primary); } .client__box .content .count { margin-bottom: 10px; font-size: 36px; line-height: 0.8; } .client__box .content span { display: block; font-weight: 500; line-height: 1; } .client__box-two { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; border: 1px solid #CFD5ED; -webkit-border-radius: 12px; -moz-border-radius: 12px; -o-border-radius: 12px; -ms-border-radius: 12px; border-radius: 12px; gap: 15px; padding: 30px 35px; } @media (max-width: 991.98px) { .client__box-two { padding: 20px 20px; } } .client__box-two .icon { font-size: 50px; color: var(--tg-theme-primary); } .client__box-two .content .count { font-size: 40px; margin-bottom: 7px; line-height: 1; } @media (max-width: 991.98px) { .client__box-two .content .count { font-size: 36px; } } .client__box-two .content span { display: block; font-weight: 600; font-size: 17px; color: var(--tg-heading-color); text-transform: capitalize; line-height: 1; } .satisfied-clients { background: var(--tg-color-white-default); border: 1px solid #DBDDE5; padding: 27px 30px; } .satisfied-clients span { display: block; font-size: 14px; font-weight: 600; line-height: 1; margin-bottom: 5px; } .section__line-wrap { top: 0px; left: 50%; bottom: 0px; width: 100%; z-index: -2; position: absolute; transform: translateX(-50%); max-width: 1226px; margin: auto; display: flex; } @media (max-width: 1199.98px) { .section__line-wrap { max-width: 936px; } } .section__line-wrap .line__item { height: 100%; position: relative; width: 25%; flex: 0 0 auto; } .section__line-wrap span { height: 100%; display: block; width: 1px; background: #EBEBEB; } .section-py-130 { padding: 130px 0; } @media (max-width: 767.98px) { .section-py-130 { padding: 100px 0; } } .section-pt-130 { padding-top: 130px; } @media (max-width: 767.98px) { .section-pt-130 { padding-top: 100px; } } .section-pb-130 { padding-bottom: 130px; } @media (max-width: 767.98px) { .section-pb-130 { padding-bottom: 100px; } } /*============================= 06. Services ===============================*/ .services__area-two { position: relative; z-index: 1; } .services__area-two::before { content: ""; position: absolute; right: -210px; top: 130px; width: 418px; height: 418px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; background: #55FF8F; filter: blur(100px); z-index: -1; opacity: 0.1; } .services__area-two::after { content: ""; position: absolute; left: -290px; bottom: -140px; width: 530px; height: 530px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; background: #FF5555; opacity: 0.1; filter: blur(100px); z-index: -1; } .services__area-eleven { position: relative; z-index: 1; background: var(--tg-color-gray-2); } .services__bg { background-size: cover; background-position: center; background-color: var(--tg-color-gray-2); position: relative; z-index: 1; } .services__bg-two { position: relative; z-index: 1; } .services__bg-three { background-size: cover; background-position: center; } .services__bg-four { background-size: cover; background-position: center; background-color: var(--tg-theme-secondary); } .services__bg-five { background-size: cover; background-position: center; } .services__bg-six { background-size: cover; background-position: center; position: absolute; left: 0; top: 0; width: 100%; height: 57.6%; z-index: -1; } .services__bg-six::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: var(--tg-theme-secondary); opacity: 0.8; z-index: -1; } .services__bg-six img { position: absolute; z-index: -1; } .services__bg-six img:nth-child(1) { right: 0; top: 0; } .services__bg-six img:nth-child(2) { left: 0; bottom: 0; mix-blend-mode: luminosity; } .services__bg-seven { background-position: center; background-size: cover; } .services-active { margin-right: -445px; } @media (max-width: 767.98px) { .services-active { margin-right: 0; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .services-active { margin-right: -170px; } } .services__item { background: var(--tg-color-white-default); border-radius: 15px; overflow: hidden; position: relative; z-index: 1; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .services__item-shape img { position: absolute; right: 0; bottom: 0; z-index: -1; opacity: 0.3; filter: grayscale(1); -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .services__item-shape-two { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1; } .services__item-shape-two svg { width: 100%; height: 100%; overflow: visible; display: block; filter: drop-shadow(10px 10px 20px rgba(0, 0, 0, 0.06)); stroke-width: 1px; stroke: #DFE1ED; } .services__item:hover { box-shadow: 0px 4px 50px 0px rgba(0, 0, 0, 0.1); } .services__item:hover .services__item-shape img { opacity: 1; filter: grayscale(0); } .services__item-two { background: var(--tg-color-white-default); -webkit-border-radius: 30px; -moz-border-radius: 30px; -o-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; padding: 50px 45px; } @media (max-width: 1199.98px) { .services__item-two { padding: 40px 30px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .services__item-two { padding: 40px 40px; } } .services__item-two:hover .services__icon-two i { transform: rotateY(180deg); } .services__item-three { background: var(--tg-color-white-default); -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; border: 1px solid #DFE1ED; padding: 40px 25px 38px 40px; box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.06); height: 100%; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } @media (max-width: 767.98px) { .services__item-three { padding: 40px 25px 38px 30px; } } .services__item-three:hover { transform: translateY(-5px); } .services__item-three:hover .services__icon-three { transform: rotateY(180deg); } .services__item-four { position: relative; z-index: 1; padding: 40px 35px 83px; } @media (max-width: 1800px) { .services__item-four { padding: 40px 35px 75px; } } @media (max-width: 1199.98px) { .services__item-four { padding: 30px 25px 75px; } } .services__item-four .tg-btn { position: absolute; right: 0; bottom: 0; padding: 19px 21px; } @media (max-width: 1800px) { .services__item-four .tg-btn { padding: 19px 16px; } } @media (max-width: 1500px) { .services__item-four .tg-btn { padding: 19px 19px; } } @media (max-width: 1199.98px) { .services__item-four .tg-btn { padding: 19px 10px; font-size: 13px; gap: 5px; } } @media (max-width: 991.98px) { .services__item-four .tg-btn { padding: 19px 13px; font-size: 15px; gap: 8px; } } .services__item-four:hover .services__icon-four i { transform: rotateY(180deg); } .services__item-five { background: var(--tg-color-white-default); border: 1px solid var(--tg-border-11); -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; padding: 17px 50px 17px 20px; margin-bottom: 24px; } @media (max-width: 1199.98px) { .services__item-five { padding: 17px 20px 17px 20px; } } @media (max-width: 991.98px) { .services__item-five { padding: 30px; } } @media (max-width: 767.98px) { .services__item-five { padding: 20px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .services__item-five { padding: 25px; } } .services__item-five:last-child { margin-bottom: 0; } .services__item-six { background: var(--tg-color-white-default); border: 1px solid #E6E6E6; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; padding: 40px 40px; } @media (max-width: 1500px) { .services__item-six { padding: 30px 25px; } } .services__item-six:hover .services__icon-six i { transform: rotateY(180deg); } .services__item-seven { background: var(--tg-color-gray-2); padding: 40px 40px; position: relative; z-index: 1; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; } .services__item-seven:hover .services__icon-seven i { transform: rotateY(180deg); } .services__item-seven .number { margin-bottom: 0; font-size: 60px; line-height: 1; position: absolute; right: 40px; top: 40px; color: transparent; -webkit-text-stroke: 1px #DFDFDF; z-index: -1; } .services__item-eight { border: 1px solid var(--tg-border-14); -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; padding: 40px 40px; height: 100%; } @media (max-width: 1199.98px) { .services__item-eight { padding: 30px 30px; } } .services__item-eight .services__item-top .title { font-size: 20px; } .services__item-eight:hover .services__icon-four i { transform: rotateY(180deg); } .services__item-nine { background: var(--tg-color-white-default); -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; overflow: hidden; } .services__item-ten { background: var(--tg-color-white-default); border: 1px solid var(--tg-border-14); -webkit-border-radius: 20px 30px; -moz-border-radius: 20px 30px; -o-border-radius: 20px 30px; -ms-border-radius: 20px 30px; border-radius: 20px 30px; overflow: hidden; padding: 40px 40px; } @media (max-width: 1199.98px) { .services__item-ten { padding: 30px 30px; } } .services__item-ten .services__icon-two { font-size: 50px; padding: 10px 0 0 14px; } .services__item-ten .services__icon-two::before { width: 50px; height: 50px; } .services__item-ten:hover .services__icon-two i { transform: rotateY(180deg); } .services__item-eleven { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; background: var(--tg-color-white-default); border: 1px solid #E6E6E6; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; padding: 36px 36px; gap: 30px; } @media (max-width: 1199.98px) { .services__item-eleven { padding: 20px 20px; gap: 20px; } } @media (max-width: 991.98px) { .services__item-eleven { padding: 30px 30px; gap: 30px; } } @media (max-width: 767.98px) { .services__item-eleven { flex-wrap: wrap; gap: 25px; } } .services__item-eleven:hover .services__icon-eight i { transform: rotateY(180deg); } .services__item-twelve { background: var(--tg-color-white-default); height: 100%; } .services__item-twelve:hover .services__icon-nine i { transform: rotateY(180deg); } .services__item-wrap .row > *:nth-child(even) .services__item-three { margin-top: 20px; } @media (max-width: 991.98px) { .services__item-wrap .row > *:nth-child(even) .services__item-three { margin-top: 0; } } .services__item-wrap-two { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: flex-start; gap: 40px; } @media (max-width: 991.98px) { .services__item-wrap-two { gap: 25px; } } @media (max-width: 767.98px) { .services__item-wrap-two { flex-wrap: wrap; gap: 50px; } } .services__item-wrap-two .nav-tabs { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-direction: column; width: 37%; flex: 0 0 auto; border: none; } @media (max-width: 991.98px) { .services__item-wrap-two .nav-tabs { width: 42%; } } @media (max-width: 767.98px) { .services__item-wrap-two .nav-tabs { width: 100%; } } .services__item-wrap-two .nav-item:first-child .nav-link { -webkit-border-radius: 0 15px 0 0; -moz-border-radius: 0 15px 0 0; -o-border-radius: 0 15px 0 0; -ms-border-radius: 0 15px 0 0; border-radius: 0 15px 0 0; } .services__item-wrap-two .nav-item:last-child .nav-link { -webkit-border-radius: 0 0 15px 0; -moz-border-radius: 0 0 15px 0; -o-border-radius: 0 0 15px 0; -ms-border-radius: 0 0 15px 0; border-radius: 0 0 15px 0; } .services__item-wrap-two .nav-link { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 0 0; text-align: left; gap: 10px; border: 1px solid #10113E; -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; margin-top: 0; padding: 30px 45px 30px 35px; border-left: 4px solid #10113E; background: var(--tg-theme-secondary); color: #C1C6E3; } @media (max-width: 1199.98px) { .services__item-wrap-two .nav-link { padding: 30px 25px 30px 25px; } } @media (max-width: 991.98px) { .services__item-wrap-two .nav-link { padding: 25px 25px 25px 25px; } } .services__item-wrap-two .nav-link .content__left { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 25px; } @media (max-width: 1199.98px) { .services__item-wrap-two .nav-link .content__left { gap: 15px; } } .services__item-wrap-two .nav-link .content__left i { font-size: 50px; } @media (max-width: 991.98px) { .services__item-wrap-two .nav-link .content__left i { font-size: 45px; } } .services__item-wrap-two .nav-link .content__left strong { font-size: 18px; text-transform: capitalize; font-weight: 600; line-height: 1.4; } @media (max-width: 991.98px) { .services__item-wrap-two .nav-link .content__left strong { font-size: 16px; } } .services__item-wrap-two .nav-link:hover { border-color: #10113E; } .services__item-wrap-two .nav-link.active { background: var(--tg-theme-primary); border-color: var(--tg-theme-primary); border-left-color: var(--tg-color-white-default); color: var(--tg-color-white-default); } .services__item-top { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 15px; margin-bottom: 18px; } .services__item-top .title { margin-bottom: 0; font-size: 24px; font-weight: 600; } @media (max-width: 1199.98px) { .services__item-top .title { font-size: 20px; } } @media (max-width: 991.98px) { .services__item-top .title { font-size: 22px; } } .services__item-left { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 45px; } @media (max-width: 1199.98px) { .services__item-left { gap: 25px; } } @media (max-width: 991.98px) { .services__item-left { margin-bottom: 30px; } } @media (max-width: 767.98px) { .services__item-left { flex-wrap: wrap; gap: 45px; margin-bottom: 45px; } } .services__item-right { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 30px; justify-content: space-between; } @media (max-width: 767.98px) { .services__item-right { flex-wrap: wrap; gap: 20px; } } .services__item-right .right__arrow { width: 60px; height: 60px; flex: 0 0 auto; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; background: var(--tg-color-gray-1); color: var(--tg-theme-primary); } .services__item-right .right__arrow:hover { color: var(--tg-color-white-default); background: var(--tg-theme-primary); } .services__thumb { position: relative; } .services__thumb img { width: 100%; height: 250px; object-fit: cover; } .services__thumb-five { width: 268px; flex: 0 0 auto; } @media (max-width: 1199.98px) { .services__thumb-five { width: 210px; } } @media (max-width: 991.98px) { .services__thumb-five { width: 268px; } } @media (max-width: 767.98px) { .services__thumb-five { width: 100%; } } .services__thumb-five img { width: 100%; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; } .services__thumb-six { position: relative; margin-bottom: 20px; } .services__thumb-six img { width: 100%; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; height: 220px; object-fit: cover; } @media (max-width: 767.98px) { .services__thumb-six img { height: auto; } } .services__thumb-seven img { width: 100%; height: 400px; object-fit: cover; } @media (max-width: 991.98px) { .services__thumb-seven img { height: 300px; } } .services__thumb-eight { position: relative; z-index: 1; } .services__thumb-eight img { width: 100%; height: 220px; object-fit: cover; } @media only screen and (min-width: 576px) and (max-width: 767px) { .services__thumb-eight img { height: 250px; } } .services__thumb-eleven { position: relative; width: 218px; flex: 0 0 auto; } @media (max-width: 1199.98px) { .services__thumb-eleven { width: 190px; } } @media (max-width: 991.98px) { .services__thumb-eleven { width: 210px; } } @media (max-width: 767.98px) { .services__thumb-eleven { width: 100%; } } .services__thumb-eleven img { width: 100%; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; height: 200px; object-fit: cover; } @media (max-width: 767.98px) { .services__thumb-eleven img { height: auto; } } .services__thumb-thirteen img { width: 100%; height: 355px; object-fit: cover; } .services__icon { width: 70px; height: 70px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-theme-primary); color: var(--tg-color-white-default); font-size: 40px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; position: absolute; left: 37px; bottom: 21px; } .services__icon-two { font-size: 60px; color: var(--tg-theme-primary); position: relative; padding: 10px 0 0 17px; z-index: 1; margin-bottom: 20px; display: inline-block; } .services__icon-two::before { content: ""; position: absolute; left: 0; top: 0; width: 60px; height: 60px; background: #EAF0FF; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; z-index: -1; } .services__icon-two i { -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -ms-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; } .services__icon-three { font-size: 50px; color: var(--tg-theme-primary); display: inline-block; -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -ms-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; margin-bottom: 25px; } .services__icon-four { width: 70px; height: 70px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-color-gray-1); color: var(--tg-theme-primary); font-size: 40px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; flex: 0 0 auto; } .services__icon-four i { -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -ms-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; } .services__icon-six { width: 70px; height: 70px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-theme-primary); color: var(--tg-color-white-default); position: absolute; left: 0; bottom: 0; font-size: 40px; border-radius: 0px 15px 0px 10px; } .services__icon-six i { -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -ms-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; } .services__icon-seven { position: relative; font-size: 50px; color: var(--tg-theme-primary); padding: 8px 0 0 14px; display: inline-block; margin-bottom: 18px; } .services__icon-seven::before { content: ""; position: absolute; left: 0; top: 0; width: 50px; height: 50px; background: #EAF0FF; -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; z-index: -1; } .services__icon-seven i { -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -ms-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; } .services__icon-eight { width: 60px; height: 60px; background: var(--tg-theme-primary); color: var(--tg-color-white-default); display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 0px 10px 10px 0px; -moz-border-radius: 0px 10px 10px 0px; -o-border-radius: 0px 10px 10px 0px; -ms-border-radius: 0px 10px 10px 0px; border-radius: 0px 10px 10px 0px; font-size: 36px; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } .services__icon-eight i { -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -ms-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; } .services__icon-nine { width: 60px; height: 60px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-theme-primary); color: var(--tg-color-white-default); font-size: 30px; position: absolute; left: 34px; top: 0; } .services__icon-nine i { -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -ms-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; } .services__content { padding: 25px 40px 37px; } @media (max-width: 1199.98px) { .services__content { padding: 25px 20px 25px; } } .services__content .title { margin-bottom: 13px; font-size: 20px; font-weight: 600; } .services__content p { margin-bottom: 25px; } .services__content-two .title { margin-bottom: 15px; font-size: 22px; font-weight: 600; } .services__content-two p { margin-bottom: 20px; } .services__content-three .title { margin-bottom: 12px; font-size: 20px; } @media (max-width: 767.98px) { .services__content-three .title br { display: none; } } .services__content-three p { margin-bottom: 0; } .services__content-four p { margin-bottom: 0; } .services__content-five { position: relative; z-index: 1; } .services__content-five .title { margin-bottom: 0; font-size: 24px; font-weight: 600; } @media (max-width: 1199.98px) { .services__content-five .title { font-size: 22px; } } @media (max-width: 991.98px) { .services__content-five .title { font-size: 24px; } } .services__content-five .title a { display: inline; background-image: linear-gradient(var(--tg-heading-color), var(--tg-heading-color)), linear-gradient(var(--tg-heading-color), var(--tg-heading-color)); background-size: 0% 2px, 0 2px; background-position: 100% 100%, 0 100%; background-repeat: no-repeat; transition: background-size 0.4s linear; } .services__content-five .title a:hover { color: inherit; background-size: 0 2px, 100% 2px; } .services__content-five .number { font-size: 130px; font-weight: 300; line-height: 0.7; margin-bottom: 0; color: #F5F5F5; z-index: -1; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } @media (max-width: 1199.98px) { .services__content-five .number { font-size: 110px; } } .services__content-six .title { margin-bottom: 12px; font-size: 22px; font-weight: 600; text-transform: capitalize; } .services__content-six p { margin-bottom: 25px; } .services__content-six .tg-btn { background: var(--tg-color-gray-1); color: var(--tg-theme-primary); } .services__content-six .tg-btn::before { background: var(--tg-theme-primary); } .services__content-six .tg-btn:hover { color: var(--tg-color-white-default); } .services__content-seven .title { font-size: 20px; font-weight: 600; text-transform: capitalize; border-bottom: 1px solid #E6E6E6; padding-bottom: 20px; margin-bottom: 28px; } .services__content-seven .about__list-item { margin-bottom: 30px; } .services__content-seven .about__list-item li { margin-bottom: 12px; font-weight: 400; } .services__content-seven .about__list-item li:last-child { margin-bottom: 0; } .services__content-eight p { margin-bottom: 22px; } .services__content-nine { position: relative; z-index: 1; padding: 35px 70px 26px 35px; } @media (max-width: 991.98px) { .services__content-nine { padding: 25px 60px 26px 25px; } } .services__content-nine .title { margin-bottom: 10px; font-size: 24px; font-weight: 600; text-transform: capitalize; } @media (max-width: 991.98px) { .services__content-nine .title { font-size: 22px; } } .services__content-nine p { margin-bottom: 0; } .services__content-nine .tg-btn { border: none; padding: 0; width: 50px; height: 50px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-theme-primary); -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; position: absolute; right: 0; bottom: 0; } .services__content-nine .tg-btn:hover { background: var(--tg-theme-secondary); } .services__content-ten .title { margin-bottom: 16px; font-weight: 600; text-transform: capitalize; font-size: 20px; } .services__content-ten p { margin-bottom: 20px; } .services__content-ten .tg-btn { background: var(--tg-color-gray-1); color: var(--tg-theme-primary); } .services__content-ten .tg-btn:hover { background: var(--tg-color-gray-1); color: var(--tg-color-white-default); } .services__content-ten .tg-btn::before { background: var(--tg-theme-primary); } .services__content-eleven .title { margin-bottom: 12px; font-size: 22px; font-weight: 600; } @media (max-width: 1199.98px) { .services__content-eleven .title { font-size: 20px; margin-bottom: 10px; } } @media (max-width: 991.98px) { .services__content-eleven .title { font-size: 22px; } } .services__content-eleven p { margin-bottom: 20px; } @media (max-width: 1199.98px) { .services__content-eleven p { margin-bottom: 15px; } } .services__content-twelve { border: 1px solid #ededed; border-top: none; padding: 25px 30px 25px; box-shadow: 0 0 15px 0 #f0f0f0; } .services__content-twelve .title { margin-bottom: 8px; font-size: 20px; font-weight: 600; } .services__content-twelve p { margin-bottom: 0; } .services__content-thirteen { background: var(--tg-color-white-default); border: 1px solid #D6D6D6; border-top: none; padding: 16px 16px 16px 25px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: space-between; gap: 20px; } .services__content-thirteen .content-left { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 20px; } .services__content-thirteen .content-left .icon { font-size: 50px; color: var(--tg-theme-primary); } .services__content-thirteen .content-left .title { margin-bottom: 0; font-size: 20px; text-transform: capitalize; font-weight: 600; } .services__content-thirteen .arrow { width: 60px; height: 60px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-color-gray-4); border-radius: 0; border: none; color: var(--tg-theme-primary); flex: 0 0 auto; padding: 0; } .services__content-thirteen .arrow:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .services__bottom-content p { margin-bottom: 0; font-size: 14px; font-weight: 500; } .services__bottom-content p a { font-size: 15px; font-weight: 600; margin-left: 3px; position: relative; } .services__bottom-content p a::before { content: ""; position: absolute; left: 0; bottom: -1px; width: 100%; height: 1px; background: currentColor; transform-origin: right top; transform: scale(0, 1); transition: transform 0.4s cubic-bezier(0.74, 0.72, 0.27, 0.24); } .services__bottom-content p a:hover { color: var(--tg-theme-secondary); } .services__bottom-content p a:hover::before { -webkit-transform-origin: left top; -ms-transform-origin: left top; transform-origin: left top; -webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); transform: scale(1, 1); } .services__bottom-content-two p a { color: var(--tg-body-color); } .services__bottom-content-white p { color: var(--tg-color-white-default); } .services__bottom-content-white p a { color: var(--tg-color-white-default); } .services__bottom-content-white p a:hover { color: var(--tg-color-white-default); } .services__pagination { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 60px; } .services__pagination .swiper-pagination-bullet { width: 20px; height: 20px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; background: var(--tg-color-white-default); margin: 0 !important; border: 1px solid #CECFD7; opacity: 1; position: relative; box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.06); } .services__pagination .swiper-pagination-bullet::before { content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 12px; height: 12px; background: var(--tg-theme-primary); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; opacity: 0; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .services__pagination .swiper-pagination-bullet-active::before { opacity: 1; } .services__details-thumb { margin-bottom: 40px; } .services__details-thumb img { -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; width: 100%; min-height: 300px; object-fit: cover; } .services__details-content .title-two { margin-bottom: 15px; font-size: 30px; font-weight: 600; text-transform: capitalize; } @media (max-width: 767.98px) { .services__details-content .title-two { font-size: 26px; } } .services__details-content > p { margin-bottom: 15px; } .services__details-content-top .title { margin-bottom: 15px; font-size: 36px; text-transform: capitalize; } @media (max-width: 1199.98px) { .services__details-content-top .title { font-size: 34px; } } @media (max-width: 767.98px) { .services__details-content-top .title { font-size: 30px; } } .services__details-content-top > p { margin-bottom: 25px; } .services__details-content-bottom { text-align: center; margin-top: 50px; } .services__details-content-bottom .title { margin-bottom: 40px; font-size: 36px; text-transform: capitalize; } @media (max-width: 1199.98px) { .services__details-content-bottom .title { font-size: 34px; } } @media (max-width: 767.98px) { .services__details-content-bottom .title { font-size: 30px; } } .services__details-content-bottom .title span { display: block; font-weight: 500; font-size: 30px; } @media (max-width: 767.98px) { .services__details-content-bottom .title span { font-size: 26px; } } .services__details-quality { margin-top: 40px; margin-bottom: 50px; } .services__details-quality > p { margin-bottom: 30px; } .services__details-quality-inner { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 30px; justify-content: space-between; } @media (max-width: 767.98px) { .services__details-quality-inner { justify-content: flex-start; flex-wrap: wrap; } } .services__details-quality-inner .about__list-item-two { flex-grow: 1; } .services__details-client-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: space-between; gap: 20px; } @media (max-width: 1199.98px) { .services__details-client-wrap { flex-wrap: wrap; justify-content: flex-end; flex: 0 0; } } @media (max-width: 991.98px) { .services__details-client-wrap { flex-wrap: nowrap; justify-content: space-between; flex: 0 1; } } @media (max-width: 767.98px) { .services__details-client-wrap { flex-wrap: wrap; justify-content: flex-start; flex: auto; } } .services__details-inner-images { margin-bottom: 35px; } .services__details-inner-images img { width: 100%; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; } .services__details-inner-images .img-two { position: relative; } .services__details-inner-images .img-two .play__btn-two { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 70px; height: 70px; } .services__details-inner-images .img-two .play__btn-two svg { width: 18px; height: auto; } .services__sidebar { margin-right: 26px; } @media (max-width: 1199.98px) { .services__sidebar { margin-right: 0; } } @media (max-width: 991.98px) { .services__sidebar { margin-top: 100px; } } .services__shape-wrap img { position: absolute; z-index: -1; } .services__shape-wrap img:nth-child(1) { right: 0; top: 0; } @media (max-width: 1500px) { .services__shape-wrap img:nth-child(1) { max-width: 330px; } } @media (max-width: 991.98px) { .services__shape-wrap img:nth-child(1) { max-width: 250px; } } .services__shape-wrap img:nth-child(2) { left: 0; bottom: 0; } @media (max-width: 1500px) { .services__shape-wrap img:nth-child(2) { max-width: 330px; } } @media (max-width: 991.98px) { .services__shape-wrap img:nth-child(2) { max-width: 250px; } } .services__shape-wrap-two img { position: absolute; z-index: -1; left: 90px; top: 103px; } @media (max-width: 1500px) { .services__shape-wrap-two img { left: 70px; top: 30px; } } @media (max-width: 991.98px) { .services__shape-wrap-two img { display: none; } } .services__shape-wrap-three img { position: absolute; z-index: -1; } .services__shape-wrap-three img:nth-child(1) { right: 7%; top: 10%; } @media (max-width: 1800px) { .services__shape-wrap-three img:nth-child(1) { right: 3%; top: 5%; max-width: 120px; } } @media (max-width: 1500px) { .services__shape-wrap-three img:nth-child(1) { top: 3%; max-width: 100px; } } @media (max-width: 767.98px) { .services__shape-wrap-three img:nth-child(1) { display: none; } } .services__shape-wrap-three img:nth-child(2) { left: 15%; bottom: 13%; } @media (max-width: 1800px) { .services__shape-wrap-three img:nth-child(2) { left: 9%; } } @media (max-width: 1500px) { .services__shape-wrap-three img:nth-child(2) { left: 2%; } } @media (max-width: 991.98px) { .services__shape-wrap-three img:nth-child(2) { bottom: 8%; } } @media (max-width: 767.98px) { .services__shape-wrap-three img:nth-child(2) { bottom: 5%; } } .sidebar__widget { margin-bottom: 40px; } .sidebar__widget:last-child { margin-bottom: 0; } .sidebar__widget-title { margin-bottom: 20px; font-size: 20px; font-weight: 600; text-transform: capitalize; position: relative; padding-bottom: 15px; } .sidebar__widget-title::before { content: ""; position: absolute; left: 0; bottom: 0; width: 30px; height: 5px; background: var(--tg-theme-primary); -webkit-border-radius: 100px; -moz-border-radius: 100px; -o-border-radius: 100px; -ms-border-radius: 100px; border-radius: 100px; } .sidebar__cat-list .list-wrap li { margin-bottom: 9px; } .sidebar__cat-list .list-wrap li:last-child { margin-bottom: 0; } .sidebar__cat-list .list-wrap li a { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; border-radius: 8px; border: 1px solid #E8EBF5; background: var(--tg-color-gray-2); color: var(--tg-body-color); font-size: 18px; font-weight: 600; text-transform: capitalize; padding: 8px 9px 8px 30px; } .sidebar__cat-list .list-wrap li a span { width: 46px; height: 46px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-color-white-default); flex: 0 0 auto; -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; margin-left: auto; color: var(--tg-body-color); } .sidebar__cat-list .list-wrap li a:hover { background: var(--tg-theme-primary); border-color: var(--tg-theme-primary); color: var(--tg-color-white-default); } .sidebar__cat-list .list-wrap li a:hover span { color: var(--tg-theme-primary); } .sidebar__contact { background: #080A5B; -webkit-border-radius: 12px; -moz-border-radius: 12px; -o-border-radius: 12px; -ms-border-radius: 12px; border-radius: 12px; padding: 40px 35px; position: relative; overflow: hidden; z-index: 1; } .sidebar__contact .title { margin-bottom: 10px; color: var(--tg-color-white-default); font-size: 22px; } .sidebar__contact p { margin-bottom: 25px; font-size: 15px; font-weight: 500; color: var(--tg-color-gray-4); } .sidebar__contact .shape img { position: absolute; z-index: -1; } .sidebar__contact .shape img:nth-child(1) { left: -31px; top: -35px; } .sidebar__contact .shape img:nth-child(2) { right: 10px; bottom: -25px; } .sidebar__brochure > p { margin-bottom: 20px; } .sidebar__brochure a { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; border: 1px solid #E8EBF5; background: var(--tg-color-gray-2); padding: 9px 22px 9px 9px; gap: 16px; margin-bottom: 8px; } .sidebar__brochure a:last-child { margin-bottom: 0; } .sidebar__brochure a .icon { width: 45px; height: 45px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; background: var(--tg-theme-primary); color: var(--tg-color-white-default); -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; } .sidebar__brochure a .content { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: space-between; flex-grow: 1; } .sidebar__brochure a .content strong { margin-bottom: 0; font-weight: 500; color: var(--tg-body-color); -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .sidebar__brochure a .content svg { color: var(--tg-border-1); -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .sidebar__brochure a:hover .content strong { color: var(--tg-theme-primary); } .sidebar__brochure a:hover .content svg { color: var(--tg-theme-primary); } .col-70 { width: 70.7%; flex: 0 0 auto; } @media (max-width: 1199.98px) { .col-70 { width: 65%; } } @media (max-width: 991.98px) { .col-70 { width: 100%; } } .col-30 { width: 29.3%; flex: 0 0 auto; } @media (max-width: 1199.98px) { .col-30 { width: 35%; } } @media (max-width: 991.98px) { .col-30 { width: 100%; } } .shine__animate-link { display: block; overflow: hidden; position: relative; z-index: 1; } .shine__animate-link::before { position: absolute; top: 0; left: -100%; display: block; content: ""; width: 50%; height: 100%; background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%); background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, 0.3))); background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%); -webkit-transform: skewX(-25deg); -ms-transform: skewX(-25deg); transform: skewX(-25deg); pointer-events: none; } .shine__animate-item:hover .shine__animate-link::before { -webkit-animation: hoverShine 1.2s; animation: hoverShine 1.2s; } .services-active-three { margin-right: -410px; } @media (max-width: 1500px) { .services-active-three { margin-right: -350px; } } @media (max-width: 1199.98px) { .services-active-three { margin-right: -250px; } } @media (max-width: 991.98px) { .services-active-three { margin-right: -120px; } } @media (max-width: 767.98px) { .services-active-three { margin-right: 0px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .services-active-three { margin-right: -120px; } } /*============================= 07. CTA ===============================*/ .cta__area { background: var(--tg-theme-secondary); padding: 82px 0; position: relative; z-index: 1; overflow: hidden; } .cta__area-two { position: relative; z-index: 2; overflow: hidden; } .cta__area-three { position: relative; z-index: 2; margin-top: -85px; } .cta__area-four { background: var(--tg-theme-primary); position: relative; z-index: 1; padding: 97px 0; } @media (max-width: 1199.98px) { .cta__area-four { padding: 80px 0; } } @media (max-width: 991.98px) { .cta__area-four { padding: 60px 0; } } .cta__area-five { background: var(--tg-theme-primary); position: relative; z-index: 1; padding: 49px 0; } .cta__area-six { background: var(--tg-theme-secondary); } .cta__area-seven { background: var(--tg-theme-primary); position: relative; z-index: 1; padding: 78px 0; } @media (max-width: 1199.98px) { .cta__area-seven { padding: 55px 0; } } @media (max-width: 991.98px) { .cta__area-seven { padding: 40px 0; } } .cta__area-eight { background: var(--tg-color-gray-1); } .cta__inner-wrap { background: var(--tg-theme-secondary); padding: 63px 0 63px 75px; z-index: 1; position: relative; } @media (max-width: 1199.98px) { .cta__inner-wrap { padding: 63px 0 63px 40px; } } .cta__inner-wrap::before { content: ""; position: absolute; left: 0; top: 0; width: 500%; height: 100%; background: var(--tg-theme-secondary); z-index: -1; } .cta__inner-wrap-two { background: var(--tg-theme-primary); -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; padding: 65px 65px; position: relative; z-index: 1; overflow: hidden; } @media (max-width: 1199.98px) { .cta__inner-wrap-two { padding: 65px 30px; } } @media (max-width: 991.98px) { .cta__inner-wrap-two { padding: 45px 30px; text-align: center; } } .cta__inner-wrap-three { -webkit-border-radius: 10px 0px 0px 50px; -moz-border-radius: 10px 0px 0px 50px; -o-border-radius: 10px 0px 0px 50px; -ms-border-radius: 10px 0px 0px 50px; border-radius: 10px 0px 0px 50px; } .cta__inner-wrap-three::before { -webkit-border-radius: 10px 0px 0px 50px; -moz-border-radius: 10px 0px 0px 50px; -o-border-radius: 10px 0px 0px 50px; -ms-border-radius: 10px 0px 0px 50px; border-radius: 10px 0px 0px 50px; } .cta__inner-wrap-four { position: relative; z-index: 2; -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; } .cta__wrap { background: var(--tg-theme-primary); position: relative; z-index: 1; padding: 72px 60px; overflow: hidden; } @media (max-width: 1199.98px) { .cta__wrap { padding: 50px 35px; } } @media (max-width: 991.98px) { .cta__wrap { padding: 30px 35px; text-align: center; } } .cta__wrap .shape img { position: absolute; z-index: -1; } .cta__wrap .shape img:nth-child(1) { left: 0; bottom: 0; } .cta__wrap .shape img:nth-child(2) { right: 0; top: 0; } @media (max-width: 991.98px) { .cta__content { text-align: center; } } @media (max-width: 991.98px) { .cta__content-two { text-align: center; } } .cta__content-two .title { color: var(--tg-color-white-default); font-size: 30px; text-transform: capitalize; margin-bottom: 10px; } .cta__content-two p { margin-bottom: 0; font-weight: 500; color: var(--tg-color-white-default); } @media (max-width: 991.98px) { .cta__content-three { margin-bottom: 30px; } } .cta__content-three .title { margin-bottom: 0; color: var(--tg-color-white-default); font-size: 30px; font-weight: 600; text-transform: capitalize; width: 90%; } @media (max-width: 1199.98px) { .cta__content-three .title { width: 100%; } } .cta__content-right { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: flex-end; gap: 35px; } @media (max-width: 1199.98px) { .cta__content-right { gap: 25px; } } @media (max-width: 991.98px) { .cta__content-right { justify-content: center; text-align: left; } } @media (max-width: 767.98px) { .cta__content-right { flex-wrap: wrap; } } .cta__content-right-two { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: flex-end; gap: 30px 50px; } @media (max-width: 1199.98px) { .cta__content-right-two { gap: 20px 30px; } } @media (max-width: 991.98px) { .cta__content-right-two { justify-content: center; } } @media (max-width: 767.98px) { .cta__content-right-two { flex-wrap: wrap; } } .cta__content-right-three { gap: 15px; } @media (max-width: 991.98px) { .cta__content-four { text-align: center; margin-bottom: 30px; } } @media (max-width: 991.98px) { .cta__content-five { text-align: center; margin-bottom: 30px; } } .cta__content-five .title { margin-bottom: 0; color: var(--tg-color-white-default); text-transform: capitalize; font-size: 30px; } @media (max-width: 991.98px) { .cta__content-six { margin-bottom: 30px; } } .cta__content-six span { display: block; color: var(--tg-color-white-default); font-size: 16px; font-weight: 600; text-transform: capitalize; line-height: 1.2; margin-bottom: 10px; } .cta__content-six .title { margin-bottom: 0; color: var(--tg-color-white-default); font-size: 30px; } @media (max-width: 991.98px) { .cta__content-seven { text-align: center; } } .cta__content-seven .title { font-size: 38px; } @media (max-width: 1199.98px) { .cta__content-seven .title { font-size: 32px; } } .cta__contact { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 10px; } .cta__contact .icon { font-size: 50px; color: var(--tg-color-white-default); } .cta__contact .content span { display: block; line-height: 1; font-size: 16px; color: var(--tg-color-white-default); margin-bottom: 10px; } .cta__contact .content a { display: block; color: var(--tg-color-white-default); font-size: 28px; font-weight: 600; line-height: 1; } @media (max-width: 1199.98px) { .cta__contact .content a { font-size: 24px; } } .cta__btn { text-align: right; } @media (max-width: 991.98px) { .cta__btn { text-align: center; margin-top: 30px; } } .cta__btn-two { text-align: right; } @media (max-width: 991.98px) { .cta__btn-two { text-align: center; margin-top: 30px; } } @media (max-width: 991.98px) { .cta__btn-three { text-align: center !important; } } .cta__btn-four { text-align: right; } @media (max-width: 991.98px) { .cta__btn-four { text-align: center; } } .cta__btn-four .tg-btn { border: 1px solid var(--tg-color-white-default); } .cta__shape-wrap img { position: absolute; z-index: -1; } .cta__shape-wrap img:nth-child(1) { left: 0; bottom: 0; mix-blend-mode: luminosity; } .cta__shape-wrap img:nth-child(2) { right: 16%; bottom: 0; } .cta__shape-wrap img:nth-child(3) { right: 15%; top: 0; } .cta__shape-wrap-two img { position: absolute; z-index: -1; } .cta__shape-wrap-two img:nth-child(1) { left: 14%; top: 0; } @media (max-width: 1500px) { .cta__shape-wrap-two img:nth-child(1) { left: 1%; } } .cta__shape-wrap-two img:nth-child(2) { right: 7%; top: 0; } @media (max-width: 1500px) { .cta__shape-wrap-two img:nth-child(2) { right: -7%; } } @media (max-width: 991.98px) { .cta__shape-wrap-two img:nth-child(2) { display: none; } } .cta__shape-two img { position: absolute; right: 0; bottom: 0; z-index: 1; mix-blend-mode: luminosity; } @media (max-width: 767.98px) { .cta__shape-two img { display: none; } } .cta__shape-three img { position: absolute; left: 0; bottom: 0; z-index: -1; mix-blend-mode: luminosity; } @media (max-width: 1199.98px) { .cta__shape-four img { display: none; } } .cta__shape-five img { position: absolute; right: 35%; bottom: -10px; z-index: -1; } @media (max-width: 1500px) { .cta__shape-five img { right: 28%; } } @media (max-width: 1199.98px) { .cta__shape-five img { max-width: 160px; } } @media (max-width: 991.98px) { .cta__shape-five img { max-width: 120px; right: 8%; } } @media (max-width: 767.98px) { .cta__shape-five img { max-width: 100px; right: 4%; } } /*============================= 08. History ===============================*/ .history__area-two { position: relative; z-index: 1; } .history__area-two::before { content: ""; position: absolute; left: -300px; top: -200px; width: 560px; height: 560px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; background: #FF7438; filter: blur(150px); opacity: 0.1; z-index: -1; } @media (max-width: 991.98px) { .history__area-two::before { top: 0; } } .history__area-four { background: var(--tg-color-gray-2); } .history__area-five { position: relative; z-index: 1; } .history__bg-two { position: absolute; left: 0; top: 0; width: 85%; height: 100%; z-index: -1; border-radius: 0px 60px 20px 0px; background-size: cover; background-position: center; } @media (max-width: 1800px) { .history__bg-two { width: 89%; } } @media (max-width: 1500px) { .history__bg-two { width: 96%; } } @media (max-width: 1199.98px) { .history__bg-two { width: 98%; } } .history__img-wrap { position: relative; z-index: 1; text-align: right; padding-bottom: 50px; margin-right: -45px; } @media (max-width: 1199.98px) { .history__img-wrap { padding-left: 90px; } } @media (max-width: 991.98px) { .history__img-wrap { margin-right: 0; margin-bottom: 50px; } } @media (max-width: 767.98px) { .history__img-wrap { padding: 0; text-align: center; } } .history__img-wrap > img:nth-child(1) { -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; } .history__img-wrap > img:nth-child(2) { -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; border: 9px solid var(--tg-color-white-default); position: absolute; left: 0; bottom: 0; } @media (max-width: 767.98px) { .history__img-wrap > img:nth-child(2) { display: none; } } .history__img-wrap > img.shape { position: absolute; left: 0; top: 10%; z-index: -1; } @media (max-width: 1199.98px) { .history__img-wrap > img.shape { max-width: 80px; } } @media (max-width: 767.98px) { .history__img-wrap > img.shape { display: none; } } .history__img-wrap-two { position: relative; text-align: right; margin: 0 10px 0 40px; padding: 70px 0 70px 80px; z-index: 1; } @media (max-width: 1199.98px) { .history__img-wrap-two { margin: 0 30px 0 0; padding: 70px 0 70px 50px; } } @media (max-width: 991.98px) { .history__img-wrap-two { margin-bottom: 50px; } } @media (max-width: 767.98px) { .history__img-wrap-two { padding: 30px 0 30px 20px; margin-right: 0; } } .history__img-wrap-two::before { content: ""; position: absolute; left: 0; top: 0; width: 80%; height: 100%; background: var(--tg-color-white-default); -webkit-border-radius: 20px 20px 20px 107px; -moz-border-radius: 20px 20px 20px 107px; -o-border-radius: 20px 20px 20px 107px; -ms-border-radius: 20px 20px 20px 107px; border-radius: 20px 20px 20px 107px; z-index: -1; } @media (max-width: 767.98px) { .history__img-wrap-two::before { -webkit-border-radius: 20px 20px 20px 50px; -moz-border-radius: 20px 20px 20px 50px; -o-border-radius: 20px 20px 20px 50px; -ms-border-radius: 20px 20px 20px 50px; border-radius: 20px 20px 20px 50px; } } .history__img-wrap-two > img { -webkit-border-radius: 30px; -moz-border-radius: 30px; -o-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; } @media (max-width: 767.98px) { .history__img-wrap-two > img { -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; } } .history__img-wrap-two .shape img { position: absolute; } .history__img-wrap-two .shape img:nth-child(1) { -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; right: -10%; bottom: 8%; border: 1px solid #D0D4E7; } @media (max-width: 767.98px) { .history__img-wrap-two .shape img:nth-child(1) { max-width: 180px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .history__img-wrap-two .shape img:nth-child(1) { max-width: 220px; } } .history__img-wrap-two .shape img:nth-child(2) { right: -12%; top: 0%; } @media (max-width: 1199.98px) { .history__img-wrap-two .shape img:nth-child(2) { right: -11%; top: 5%; max-width: 80px; } } @media (max-width: 767.98px) { .history__img-wrap-two .shape img:nth-child(2) { display: none; } } .history__img-wrap-three { position: relative; z-index: 1; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-wrap: wrap; gap: 20px 20px; align-items: flex-start; } @media (max-width: 991.98px) { .history__img-wrap-three { margin-bottom: 50px; } } @media (max-width: 767.98px) { .history__img-wrap-three { justify-content: center; } } .history__img-wrap-three::before { content: ""; position: absolute; right: 0; bottom: 0; width: 210px; height: 225px; background: var(--tg-theme-primary); z-index: -2; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; } @media (max-width: 767.98px) { .history__img-wrap-three::before { display: none; } } .history__img-wrap-three img:nth-child(1) { border-radius: 20px; } @media (max-width: 1199.98px) { .history__img-wrap-three img:nth-child(1) { max-width: 350px; } } @media (max-width: 767.98px) { .history__img-wrap-three img:nth-child(1) { max-width: 100%; } } .history__img-wrap-three img:nth-child(2) { border-radius: 20px; margin-left: -52px; } @media (max-width: 1199.98px) { .history__img-wrap-three img:nth-child(2) { max-width: 250px; margin-left: -20px; } } @media (max-width: 767.98px) { .history__img-wrap-three img:nth-child(2) { display: none; } } .history__img-wrap-three img:nth-child(3) { border-radius: 15px; border: 8px solid var(--tg-color-white-default); } @media (max-width: 1199.98px) { .history__img-wrap-three img:nth-child(3) { max-width: 200px; } } @media (max-width: 767.98px) { .history__img-wrap-three img:nth-child(3) { display: none; } } .history__img-wrap-three img.shape { position: absolute; z-index: -1; right: 35%; bottom: 0; } @media (max-width: 767.98px) { .history__img-wrap-three img.shape { right: 2%; bottom: -30px; } } .history__img-wrap-four { position: relative; z-index: 1; margin-right: 42px; -webkit-border-radius: 30px; -moz-border-radius: 30px; -o-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; overflow: hidden; } @media (max-width: 1199.98px) { .history__img-wrap-four { margin-right: 0; } } @media (max-width: 991.98px) { .history__img-wrap-four { margin-bottom: 50px; } } .history__img-wrap-four > img { width: 100%; } .history__img-wrap-four > img.shape { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .history__img-wrap-five { margin-right: 60px; padding-right: 26px; padding-bottom: 23px; position: relative; z-index: 1; } @media (max-width: 1199.98px) { .history__img-wrap-five { margin-right: 0; } } @media (max-width: 991.98px) { .history__img-wrap-five { margin-bottom: 50px; } } .history__img-wrap-five::before { content: ""; position: absolute; right: 0; bottom: 0; width: 290px; height: 280px; -webkit-border-radius: 30px; -moz-border-radius: 30px; -o-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; background: var(--tg-theme-primary); z-index: -1; } .history__img-wrap-five img { -webkit-border-radius: 30px 50px; -moz-border-radius: 30px 50px; -o-border-radius: 30px 50px; -ms-border-radius: 30px 50px; border-radius: 30px 50px; } @media (max-width: 991.98px) { .history__img-wrap-six { margin-bottom: 50px; text-align: center; } } .history__img-wrap-six img { -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; } .history__content { margin-right: 75px; } @media (max-width: 1500px) { .history__content { margin-left: 55px; } } @media (max-width: 1199.98px) { .history__content { margin-left: 48px; } } @media (max-width: 991.98px) { .history__content { margin-left: 0; } } .history__content p { margin-bottom: 35px; } .history__content-two { margin-right: 75px; } @media (max-width: 1199.98px) { .history__content-two { margin-right: 0; } } .history__content-two > p { font-size: 18px; margin-bottom: 35px; } .history__content-three { margin-left: 35px; } @media (max-width: 1199.98px) { .history__content-three { margin-left: 0; } } .history__content-three > p { margin-bottom: 25px; position: relative; padding-left: 20px; width: 90%; } @media (max-width: 1199.98px) { .history__content-three > p { width: 100%; } } .history__content-three > p::before { content: ""; position: absolute; left: 0; top: 0; width: 4px; height: 100%; background: var(--tg-theme-primary); -webkit-border-radius: 2px; -moz-border-radius: 2px; -o-border-radius: 2px; -ms-border-radius: 2px; border-radius: 2px; } .history__content-four p { margin-bottom: 25px; } .history__content-five { width: 90%; } @media (max-width: 1199.98px) { .history__content-five { width: 100%; } } .history__content-five p { margin-bottom: 25px; position: relative; padding-left: 20px; width: 95%; } @media (max-width: 1199.98px) { .history__content-five p { width: 100%; } } .history__content-five p::before { content: ""; position: absolute; left: 0; top: 0; width: 4px; height: 100%; background: var(--tg-theme-primary); -webkit-border-radius: 2px; -moz-border-radius: 2px; -o-border-radius: 2px; -ms-border-radius: 2px; border-radius: 2px; } .history__content-five .about__inner-wrap-three { margin: 0 0 25px; } .history__content-five .about__list-item-two li { margin-bottom: 14px; } .history__content-five .about__list-item-two li:last-child { margin-bottom: 0; } .history__content-five .profit__wrap-two { padding: 24px 23px; -webkit-border-radius: 10px 20px; -moz-border-radius: 10px 20px; -o-border-radius: 10px 20px; -ms-border-radius: 10px 20px; border-radius: 10px 20px; } .history__content-six .section__title { width: 78%; } @media (max-width: 1199.98px) { .history__content-six .section__title { width: 100%; } } .history__content-six .info-one { margin-bottom: 12px; font-size: 18px; font-weight: 500; color: var(--tg-theme-secondary); } .history__content-six .info-two { margin-bottom: 26px; } .history__content-six .about__list-item li { margin-bottom: 15px; } .history__content-six .about__list-item li:last-child { margin-bottom: 0; } .history__content-inner { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 20px 60px; margin-bottom: 50px; } @media (max-width: 1199.98px) { .history__content-inner { gap: 20px 30px; margin-bottom: 30px; } } @media (max-width: 767.98px) { .history__content-inner { flex-wrap: wrap; } } .history__content-inner-two { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 25px; flex-wrap: wrap; margin-bottom: 30px; } .history__content-inner-three { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: flex-start; gap: 30px; } @media (max-width: 1199.98px) { .history__content-inner-three { gap: 20px; } } .history__content-bottom { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 20px 70px; margin-bottom: 50px; } @media (max-width: 1199.98px) { .history__content-bottom { gap: 20px 30px; margin-bottom: 30px; } } @media (max-width: 767.98px) { .history__content-bottom { flex-wrap: wrap; } } .history__inner-img { width: 260px; flex: 0 0 auto; position: relative; z-index: 1; padding-top: 72px; } @media (max-width: 767.98px) { .history__inner-img { display: none; } } .history__inner-img::before { content: ""; position: absolute; right: 0; top: 0; width: 200px; height: 292px; background: var(--tg-theme-primary); z-index: -1; -webkit-border-radius: 20px 15px 15px 0px; -moz-border-radius: 20px 15px 15px 0px; -o-border-radius: 20px 15px 15px 0px; -ms-border-radius: 20px 15px 15px 0px; border-radius: 20px 15px 15px 0px; } .history__inner-img img { -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; } .history__rating { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; background: var(--tg-color-white-default); position: absolute; left: 17%; bottom: 50px; gap: 12px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; padding: 30px 25px; } @media (max-width: 1199.98px) { .history__rating { left: 9%; } } @media (max-width: 767.98px) { .history__rating { left: 18%; display: block; text-align: center; bottom: 30px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .history__rating { left: 14%; display: flex; text-align: left; bottom: 40px; } } .history__rating span { font-size: 16px; font-weight: 500; color: var(--tg-theme-secondary); text-transform: capitalize; display: block; line-height: 1.4; } @media (max-width: 767.98px) { .history__rating span { margin-top: 10px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .history__rating span { margin-top: 0; } } .history__rating span strong { font-weight: 600; font-size: 24px; line-height: 1; } .history__play-btn { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 500; text-transform: capitalize; line-height: 1.3; color: var(--tg-heading-color); position: relative; } .history__play-btn::before { content: ""; position: absolute; left: -32px; top: 50%; transform: translateY(-50%); width: 3px; height: 45px; background: #CDCED8; -webkit-border-radius: 3px; -moz-border-radius: 3px; -o-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px; } @media (max-width: 1199.98px) { .history__play-btn::before { left: -15px; } } .history__play-btn .icon { width: 50px; height: 50px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-theme-primary); color: var(--tg-color-white-default); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; flex: 0 0 auto; } .history__play-btn .icon svg { width: 15px; height: auto; } .satisfied__clients-wrap { background: var(--tg-color-white-default); -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; position: absolute; left: 37%; bottom: 20%; text-align: left; padding: 15px 25px; } .satisfied__clients-wrap span { display: block; font-size: 14px; font-weight: 600; margin-bottom: 5px; } .progress__wrap { overflow: hidden; } .progress__item { margin-bottom: 25px; } .progress__item:last-child { margin-bottom: 0; } .progress__item .title { margin-bottom: 12px; font-size: 16px; font-weight: 600; } .progress__item .progress { height: 8px; background-color: var(--tg-color-gray-3); border-radius: 8px; overflow: inherit; } .progress__item .progress-bar { background: var(--tg-color-gradient); position: relative; overflow: inherit; border-radius: 8px; } .progress__item .progress-bar span { display: block; position: absolute; right: 3px; bottom: 20px; color: var(--tg-color-white-default); line-height: 1; font-weight: 600; font-size: 11px; border-radius: 2px; background: var(--tg-theme-secondary); padding: 4px 5px; } .progress__item .progress-bar span::before { content: ""; position: absolute; right: 0; bottom: -5px; width: 8px; height: 8px; background: var(--tg-theme-secondary); clip-path: polygon(100% 0, 0 0, 100% 100%); } .progress__item-two .title { color: var(--tg-color-white-default); } .progress__item-two .progress-bar span { color: var(--tg-heading-color); background: var(--tg-color-white-default); } .progress__item-two .progress-bar span::before { background: var(--tg-color-white-default); } .planning__box { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; background: var(--tg-color-white-default); border: 1px solid #DEE0EB; -webkit-border-radius: 12px; -moz-border-radius: 12px; -o-border-radius: 12px; -ms-border-radius: 12px; border-radius: 12px; gap: 20px; padding: 22px 40px 22px 20px; } @media (max-width: 1199.98px) { .planning__box { padding: 22px 15px 22px 15px; } } .planning__box .icon { font-size: 45px; color: var(--tg-theme-primary); } .planning__box .icon i { -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -ms-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; } .planning__box .content .title { margin-bottom: 0; font-size: 18px; font-weight: 500; } .planning__box:hover .icon i { transform: rotateY(180deg); } .planning__box-two { padding: 28px 30px 28px 30px; } .planning__box-two .title { line-height: 1.4; } /*============================= 09. Counter ===============================*/ .counter__area { position: relative; z-index: 2; } .counter__area-two { position: relative; z-index: 1; } .counter__area-two::before { content: ""; position: absolute; right: 30%; top: -50px; width: 400px; height: 400px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; background: #7838FF; filter: blur(200px); opacity: 0.1; z-index: -1; } .counter__area-four { position: relative; z-index: 1; background: var(--tg-color-gray-2); padding: 300px 0 130px; overflow: hidden; margin-top: -210px; } @media (max-width: 767.98px) { .counter__area-four { padding: 300px 0 100px; } } .counter__area-four::before { content: ""; position: absolute; top: 50%; transform: translateY(-50%); width: 285px; height: 285px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; background: #DFD2FB; filter: blur(150px); left: -116px; z-index: -1; } .counter__area-four::after { content: ""; position: absolute; top: 50%; transform: translateY(-50%); width: 325px; height: 325px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; background: #C3CEFA; filter: blur(150px); right: -154px; z-index: -1; } .counter__area-five { padding-top: 110px; } @media (max-width: 767.98px) { .counter__area-five { padding-top: 80px; } } .counter__area-six { background: var(--tg-color-gray-1); } .counter__area-seven { background: var(--tg-theme-secondary); padding: 295px 0 130px; margin-top: -155px; } .counter__area-eight { background: var(--tg-color-gray-2); } .counter__area-nine { background: var(--tg-color-gray-2); } .counter__wrap { background: var(--tg-theme-primary); position: relative; z-index: 1; padding: 80px 30px 45px; } .counter__wrap::before { content: ""; position: absolute; right: 0; top: 0; width: 300%; height: 100%; background: var(--tg-theme-primary); z-index: -1; } .counter__wrap-two { z-index: 2; } .counter__item { margin-bottom: 30px; text-align: center; } .counter__item .count { margin-bottom: 5px; color: #fbca00;; font-size: 60px; font-weight: 700; line-height: 0.8; } @media (max-width: 1500px) { .counter__item .count { font-size: 55px; } } @media (max-width: 767.98px) { .counter__item .count { font-size: 50px; } } .counter__item p { margin-bottom: 0; color: var(--tg-color-gray-4); font-weight: 500; } .counter__item-two { background: var(--tg-color-white-default); box-shadow: 0px 11px 30px 0px #E9EAF2; border: 1px solid var(--tg-color-white-default); -webkit-border-radius: 30px; -moz-border-radius: 30px; -o-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; text-align: center; padding: 40px 30px 35px; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .counter__item-two:hover { transform: translateY(-5px); } .counter__item-two:hover .counter__icon i { transform: rotateY(180deg); } .counter__item-three { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 20px; } .counter__item-three:hover .counter__icon-two i { transform: rotateY(180deg); } .counter__item-four { text-align: center; } .counter__item-four p { margin-bottom: 20px; font-size: 20px; font-weight: 500; line-height: 1; } .counter__item-four .count { margin-bottom: 0; font-size: 100px; font-weight: 600; line-height: 0.8; display: inline-flex; align-items: center; color: var(--tg-theme-primary); } @media (max-width: 1500px) { .counter__item-four .count { font-size: 90px; } } @media (max-width: 1199.98px) { .counter__item-four .count { font-size: 70px; } } .counter__item-five { text-align: center; } .counter__item-five p { margin-bottom: 12px; font-size: 20px; font-weight: 500; color: var(--tg-color-gray-4); } .counter__item-five .count { margin-bottom: 0; line-height: 0.8; font-size: 100px; font-weight: 600; text-transform: uppercase; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; color: transparent; -webkit-text-stroke: 2px var(--tg-color-gray-4); justify-content: center; } @media (max-width: 1199.98px) { .counter__item-five .count { font-size: 75px; line-height: 0.9; } } @media (max-width: 767.98px) { .counter__item-five .count { font-size: 70px; } } .counter__item-six { width: 50%; flex: 0 0 auto; text-align: left; } @media (max-width: 991.98px) { .counter__item-six { text-align: center; } } @media (max-width: 767.98px) { .counter__item-six { width: 100%; } } .counter__item-six .count { line-height: 0.9; font-size: 90px; margin-bottom: 12px; justify-content: flex-start; } @media (max-width: 1199.98px) { .counter__item-six .count { font-size: 72px; } } @media (max-width: 991.98px) { .counter__item-six .count { justify-content: center; } } .counter__item-six p { margin-bottom: 0; line-height: 1.2; } .counter__item-seven .counter__icon-two::before { -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; } .counter__item-wrap { margin-left: 80px; flex-wrap: wrap; gap: 60px 0; position: relative; } @media (max-width: 1199.98px) { .counter__item-wrap { margin-left: 0; } } @media (max-width: 991.98px) { .counter__item-wrap { gap: 30px 0; } } .counter__item-wrap::before { content: ""; position: absolute; left: 43%; top: 0%; width: 1px; height: 125px; background: #1F2042; } @media (max-width: 991.98px) { .counter__item-wrap::before { display: none; } } .counter__item-wrap::after { content: ""; position: absolute; left: 43%; bottom: 0%; width: 1px; height: 125px; background: #1F2042; } @media (max-width: 991.98px) { .counter__item-wrap::after { display: none; } } .counter__item-wrap .line-one { position: absolute; left: 0%; top: 50%; width: 190px; height: 1px; background: #1F2042; } @media (max-width: 991.98px) { .counter__item-wrap .line-one { display: none; } } .counter__item-wrap .line-two { position: absolute; right: 13%; top: 50%; width: 190px; height: 1px; background: #1F2042; } @media (max-width: 991.98px) { .counter__item-wrap .line-two { display: none; } } .counter__icon { position: relative; display: inline-block; z-index: 1; font-size: 60px; color: var(--tg-theme-primary); padding: 10px 0 0 17px; margin-bottom: 18px; } .counter__icon::before { content: ""; position: absolute; left: 0; top: 0; width: 60px; height: 60px; background: var(--tg-color-gray-1); -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; z-index: -1; } .counter__icon i { -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -ms-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; } .counter__icon-two { font-size: 70px; } @media (max-width: 1199.98px) { .counter__icon-two { font-size: 60px; } } .counter__icon-two::before { width: 70px; height: 70px; background: #EAF0FF; } @media (max-width: 1199.98px) { .counter__icon-two::before { width: 60px; height: 60px; } } .counter__content .count { margin-bottom: 8px; font-size: 36px; line-height: 0.9; } .counter__content p { margin-bottom: 0; font-weight: 500; color: var(--tg-color-gray-11); } .counter__content-two .count { margin-bottom: 10px; line-height: 0.8; font-size: 60px; } @media (max-width: 1199.98px) { .counter__content-two .count { font-size: 50px; } } @media (max-width: 767.98px) { .counter__content-two .count { font-size: 45px; } } .counter__content-two p { margin-bottom: 0; font-weight: 500; color: var(--tg-color-gray-11); line-height: 1; } @media (max-width: 991.98px) { .counter__content-three { margin-top: 50px; } } .counter__content-three p { color: var(--tg-color-gray-4); margin-bottom: 40px; width: 85%; } @media (max-width: 1199.98px) { .counter__content-three p { width: 95%; } } @media (max-width: 991.98px) { .counter__content-three p { width: 100%; } } .counter__content-bottom { gap: 40px; flex-wrap: wrap; } @media (max-width: 1199.98px) { .counter__content-bottom { gap: 25px; } } .counter__shape img { position: absolute; z-index: -1; right: 0; bottom: 120px; max-width: 276px; } @media (max-width: 1800px) { .counter__shape img { max-width: 200px; } } @media (max-width: 991.98px) { .counter__shape img { display: none; } } /*============================= 10. Video ===============================*/ .video__area { position: relative; z-index: 1; padding: 335px 0 220px; margin-top: -120px; } @media (max-width: 1199.98px) { .video__area { padding: 285px 0 160px; } } @media (max-width: 767.98px) { .video__area { padding: 240px 0 100px; } } .video__area-two { position: relative; padding: 270px 0; } @media (max-width: 1500px) { .video__area-two { padding: 220px 0; } } @media (max-width: 1199.98px) { .video__area-two { padding: 200px 0; } } .video__area-three { position: relative; z-index: 2; } .video__area-four { position: relative; z-index: 1; height: 700px; padding: 100px 0; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; overflow: hidden; } @media (max-width: 1500px) { .video__area-four { height: 550px; } } @media (max-width: 991.98px) { .video__area-four { height: 500px; } } @media (max-width: 767.98px) { .video__area-four { height: 460px; } } .video__area-four::before { content: ""; position: absolute; left: 7.3%; bottom: 0; width: 80px; height: 70px; background: rgba(0, 42, 150, 0.9); clip-path: polygon(35% 0%, 100% 0%, 65% 100%, 0% 100%); } @media (max-width: 1800px) { .video__area-four::before { left: 5.3%; } } @media (max-width: 1199.98px) { .video__area-four::before { left: 0.3%; } } @media (max-width: 991.98px) { .video__area-four::before { display: none; } } .video__area-five { position: relative; height: 650px; z-index: 1; } @media (max-width: 1500px) { .video__area-five { height: 550px; } } @media (max-width: 991.98px) { .video__area-five { height: 500px; } } .video__area-six { height: auto; height: 750px; margin-top: -115px; } @media (max-width: 1500px) { .video__area-six { height: 700px; } } @media (max-width: 1199.98px) { .video__area-six { height: 650px; } } @media (max-width: 991.98px) { .video__area-six { height: 600px; } } .video__bg { background-size: cover; background-position: center; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1; background-attachment: fixed; mix-blend-mode: luminosity; } .video__bg::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0.8; background: linear-gradient(99deg, #01022E 27.88%, #000 75.46%); } .video__bg-two { background-size: cover; background-position: center; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1; background-attachment: fixed; } .video__bg-three { background-size: cover; background-position: center; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1; background-attachment: fixed; background-blend-mode: luminosity; background-color: var(--tg-theme-secondary); } .video__bg-three::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0.4; background: #111; } .video__bg-four { background-size: cover; background-position: center; position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1; background-attachment: fixed; background-blend-mode: luminosity; } .video__bg-four::before { content: ""; position: absolute; left: 18%; top: 50%; transform: translateY(-50%) rotate(20deg); width: 215px; height: 200%; background: rgba(0, 71, 255, 0.9); } @media (max-width: 1500px) { .video__bg-four::before { width: 170px; } } @media (max-width: 1199.98px) { .video__bg-four::before { width: 140px; } } @media (max-width: 991.98px) { .video__bg-four::before { width: 100px; } } .video__bg-four::after { content: ""; position: absolute; left: 24%; bottom: 0; width: 158px; height: 240px; background: rgba(0, 42, 150, 0.9); clip-path: polygon(56% 0%, 100% 0%, 44% 100%, 0% 100%); } @media (max-width: 1800px) { .video__bg-four::after { left: 25%; } } @media (max-width: 1500px) { .video__bg-four::after { left: 25%; } } @media (max-width: 1199.98px) { .video__bg-four::after { left: 24%; } } @media (max-width: 991.98px) { .video__bg-four::after { width: 135px; height: 200px; left: 21%; } } @media (max-width: 767.98px) { .video__bg-four::after { left: 28%; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .video__bg-four::after { left: 24%; } } .video__bg-five { background-size: cover; background-position: center; object-fit: cover; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: -1; background-attachment: fixed; } .video__inner-wrap { position: relative; z-index: 1; height: 570px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 200px 20px; -moz-border-radius: 200px 20px; -o-border-radius: 200px 20px; -ms-border-radius: 200px 20px; border-radius: 200px 20px; overflow: hidden; } @media (max-width: 1199.98px) { .video__inner-wrap { height: 460px; } } @media (max-width: 991.98px) { .video__inner-wrap { height: 420px; -webkit-border-radius: 150px 20px; -moz-border-radius: 150px 20px; -o-border-radius: 150px 20px; -ms-border-radius: 150px 20px; border-radius: 150px 20px; } } @media (max-width: 767.98px) { .video__inner-wrap { height: 400px; -webkit-border-radius: 100px 20px; -moz-border-radius: 100px 20px; -o-border-radius: 100px 20px; -ms-border-radius: 100px 20px; border-radius: 100px 20px; } } @media (max-width: 991.98px) { .video__content { text-align: center; } } .video__content .sub-title { display: block; color: var(--tg-color-white-default); font-size: 16px; font-weight: 500; text-transform: uppercase; margin-bottom: 10px; } .video__content .title { font-size: 40px; text-transform: capitalize; color: var(--tg-color-white-default); margin-bottom: 20px; } @media (max-width: 767.98px) { .video__content .title { font-size: 32px; } } .video__content p { margin-bottom: 0; color: var(--tg-color-gray-1); width: 78%; } @media (max-width: 1199.98px) { .video__content p { width: 90%; } } @media (max-width: 991.98px) { .video__content p { width: 100%; } } .video__btn { margin-right: 100px; } @media (max-width: 1199.98px) { .video__btn { margin-right: 80px; } } @media (max-width: 991.98px) { .video__btn { margin: 0; } } .video__btn-two { margin-right: 0; text-align: center; } .video__btn-two .play__btn { background: var(--tg-theme-primary); margin: 0 auto; } .video__btn-four .play-btn { width: 102px; height: 102px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background: var(--tg-color-white-default); color: var(--tg-theme-primary); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } .video__btn-four .play-btn:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .video__btn-five .play-btn { margin-top: 50px; } .video__shape img { position: absolute; z-index: -1; } .video__shape img:nth-child(1) { left: -17px; top: -17px; } @media (max-width: 991.98px) { .video__shape img:nth-child(1) { left: -30px; top: -30px; } } @media (max-width: 767.98px) { .video__shape img:nth-child(1) { left: -37px; top: -47px; } } .video__shape img:nth-child(2) { bottom: 0; right: 0; } @media (max-width: 767.98px) { .video__shape img:nth-child(2) { right: -53px; } } .play__btn { width: 160px; height: 160px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: rgba(255, 255, 255, 0.1); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; margin-left: auto; position: relative; } @media (max-width: 991.98px) { .play__btn { margin: 0 auto 50px; } } .play__btn img { transform: translateY(-2px); } .play__btn-two { width: 80px; height: 80px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; color: var(--tg-theme-primary); background: var(--tg-color-white-default); align-items: center; justify-content: center; margin: 0 auto; position: relative; } .play__btn-two::after { content: ""; position: absolute; left: 50%; top: 50%; width: 100%; height: 100%; border: 1px solid var(--tg-color-white-default); border-radius: 50%; transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); animation: pulse-border 1500ms ease-out infinite; } .play__btn-two:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .play__btn-three { width: 100px; height: 100px; position: relative; } .play__btn-three::after { content: ""; position: absolute; left: 50%; top: 50%; width: 100%; height: 100%; border: 1px solid var(--tg-color-white-default); border-radius: 50%; transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); animation: pulse-border 1500ms ease-out infinite; } .play__btn-three svg { width: 25px; height: auto; } .play-btn::after { content: ""; position: absolute; left: 50%; top: 50%; width: 100%; height: 100%; border: 1px solid var(--tg-color-white-default); border-radius: 50%; transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1); animation: pulse-border 1500ms ease-out infinite; } /*============================= 11. Project ===============================*/ .project__area-five { background: var(--tg-color-gray-2); position: relative; z-index: 1; overflow: hidden; } .project__area-five::before { content: ""; position: absolute; right: 125px; top: -260px; width: 400px; height: 400px; background: #D2DBFF; filter: blur(150px); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; z-index: -1; } .project__area-five::after { content: ""; position: absolute; bottom: -300px; left: 50px; width: 500px; height: 500px; background: #F0DCFF; filter: blur(150px); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; z-index: -1; } .project__area-seven { position: relative; z-index: 1; } .project__area-seven::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 60%; background: var(--tg-theme-secondary); z-index: -1; } .project-active { padding: 0 24px; position: relative; } @media (max-width: 767.98px) { .project-active { padding: 0 10px; } } .project-active .swiper-slide { transform: scale(0.9); transition: all 200ms linear; } .project-active .swiper-slide-active { transform: scale(1); } .project-active .swiper-slide-active .project__thumb img { filter: grayscale(0); } .project-active .swiper-slide-active .project__content { opacity: 1; overflow: visible; } @media (max-width: 1500px) { .project-active-three { margin: 0 -180px; } } @media (max-width: 991.98px) { .project-active-three { margin: 0 -165px; } } @media (max-width: 767.98px) { .project-active-three { margin: 0 0; } } .project-active-three .swiper-slide-active .project__thumb-four .project__mask-img img { filter: grayscale(0); } .project-active-four { margin-right: -416px; } @media (max-width: 991.98px) { .project-active-four { margin-right: -320px; } } @media (max-width: 767.98px) { .project-active-four { margin-right: 0; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .project-active-four { margin-right: -60px; } } .project-active-four .swiper-slide-active .project__content-five { opacity: 1; visibility: visible; margin-bottom: 0; } .project-active-five .swiper-slide { transform: scale(0.86); transition: all 200ms linear; } .project-active-five .swiper-slide-active { transform: scale(1); } .project-active-five .swiper-slide-active .project__content-seven .arrow { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .project-active-seven { margin-right: -382px; } @media (max-width: 991.98px) { .project-active-seven { margin-right: -260px; } } @media (max-width: 767.98px) { .project-active-seven { margin-right: 0; } } .project__item { position: relative; } .project__item-two { position: relative; -webkit-border-radius: 30px; -moz-border-radius: 30px; -o-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; overflow: hidden; } .project__item-two:hover .project__thumb-two::before { opacity: 0.9; visibility: visible; } .project__item-two:hover .project__content-two { margin-top: 0; opacity: 1; visibility: visible; } .project__item-two:hover .shape img { opacity: 1; visibility: visible; right: 0; } .project__item-two .shape img { position: absolute; right: -20px; bottom: 0; mix-blend-mode: luminosity; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; opacity: 0; visibility: hidden; } .project__item-three { background: var(--tg-color-white-default); border: 1px solid var(--tg-border-10); -webkit-border-radius: 25px; -moz-border-radius: 25px; -o-border-radius: 25px; -ms-border-radius: 25px; border-radius: 25px; } .project__item-four { position: relative; } .project__item-five { position: relative; overflow: hidden; } .project__item-five:hover .project__content-five { opacity: 1; visibility: visible; margin-bottom: 0; } .project__item-six:hover .project__thumb-six .shape img:nth-child(1) { transform: translateZ(0); opacity: 1; } .project__item-six:hover .project__thumb-six .shape img:nth-child(2) { transform: translateZ(0); opacity: 1; } .project__item-eight { position: relative; overflow: hidden; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; } .project__item-eight:hover .project__thumb-eight img { filter: grayscale(0); } .project__item-eight:hover .project__content-eight { transform: translateY(0); opacity: 1; visibility: visible; } .project__item-nine { position: relative; z-index: 1; } .project__item-nine:hover .project__content-nine .arrow-btn { opacity: 1; visibility: visible; } .project__item-ten { -webkit-border-radius: 0px; -moz-border-radius: 0px; -o-border-radius: 0px; -ms-border-radius: 0px; border-radius: 0px; } .project__item-ten .project__content-two a { -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; } .project__item-wrap { position: relative; padding: 50px 0 80px; z-index: 1; } @media (max-width: 767.98px) { .project__item-wrap { padding: 35px 0 60px; } } .project__item-wrap::before { content: ""; position: absolute; left: 50%; top: 0%; transform: translateX(-50%); background: var(--tg-color-gray-10); width: 75%; height: 100%; z-index: -1; -webkit-border-radius: 30px; -moz-border-radius: 30px; -o-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; } @media (max-width: 767.98px) { .project__item-wrap::before { width: 80%; } } .project__thumb img { -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; filter: grayscale(1); background-color: #000; } .project__thumb-two { position: relative; } .project__thumb-two::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: var(--tg-theme-secondary); pointer-events: none; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; opacity: 0; visibility: hidden; } .project__thumb-two img { width: 100%; height: 390px; object-fit: cover; } .project__thumb-three img { -webkit-border-radius: 25px 25px 0 0; -moz-border-radius: 25px 25px 0 0; -o-border-radius: 25px 25px 0 0; -ms-border-radius: 25px 25px 0 0; border-radius: 25px 25px 0 0; width: 100%; } .project__thumb-four { position: relative; } .project__thumb-five img { -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; width: 100%; height: 475px; object-fit: cover; } @media (max-width: 1199.98px) { .project__thumb-five img { height: 420px; } } .project__thumb-six { position: relative; z-index: 1; overflow: hidden; -webkit-border-radius: 30px; -moz-border-radius: 30px; -o-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; margin-bottom: 25px; } .project__thumb-six a > img { width: 100%; max-height: 360px; object-fit: cover; } .project__thumb-six .shape img { position: absolute; } .project__thumb-six .shape img:nth-child(1) { right: 0; top: 0; transform: translate3d(100px, -100px, 0); opacity: 0; -webkit-transition: all 0.4s ease-out 0s; -moz-transition: all 0.4s ease-out 0s; -ms-transition: all 0.4s ease-out 0s; -o-transition: all 0.4s ease-out 0s; transition: all 0.4s ease-out 0s; } .project__thumb-six .shape img:nth-child(2) { bottom: 0; left: 0; transform: translate3d(-100px, 100px, 0); opacity: 0; -webkit-transition: all 0.4s ease-out 0s; -moz-transition: all 0.4s ease-out 0s; -ms-transition: all 0.4s ease-out 0s; -o-transition: all 0.4s ease-out 0s; transition: all 0.4s ease-out 0s; } .project__thumb-seven { margin-bottom: 20px; } .project__thumb-seven img { -webkit-border-radius: 30px; -moz-border-radius: 30px; -o-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; width: 100%; height: 475px; object-fit: cover; } .project__thumb-eight img { width: 100%; height: 470px; object-fit: cover; filter: grayscale(1); } .project__thumb-nine { position: relative; z-index: 1; } .project__thumb-nine::before { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 70%; background: linear-gradient(180deg, rgba(1, 2, 46, 0) 48.5%, rgba(0, 0, 0, 0.8) 100%); pointer-events: none; } .project__thumb-nine img { width: 100%; height: 390px; object-fit: cover; } .project__content { border-radius: 20px; background: var(--tg-color-white-default); box-shadow: 0px 4px 30px 0px rgba(0, 0, 0, 0.1); display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 20px; justify-content: space-between; padding: 40px 40px; margin: 0 70px; margin-top: -80px; position: relative; -webkit-transition: all 0.4s ease-out 0s; -moz-transition: all 0.4s ease-out 0s; -ms-transition: all 0.4s ease-out 0s; -o-transition: all 0.4s ease-out 0s; transition: all 0.4s ease-out 0s; opacity: 0; overflow: hidden; } @media (max-width: 1800px) { .project__content { padding: 40px 30px; margin: -80px 30px 0; } } @media (max-width: 1500px) { .project__content { padding: 30px 25px; margin: -65px 20px 0; } } .project__content-left span { display: inline-block; font-size: 14px; font-weight: 500; color: var(--tg-color-white-default); background: var(--tg-theme-primary); text-transform: capitalize; line-height: 1; padding: 8px 13px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; margin-bottom: 8px; } .project__content-left .title { margin-bottom: 0; font-size: 26px; font-weight: 600; } @media (max-width: 1500px) { .project__content-left .title { font-size: 22px; } } .project__content-left-two .title { margin-bottom: 12px; font-size: 24px; font-weight: 600; } .project__content-arrow a { width: 60px; height: 40px; background: var(--tg-color-gray-4); -webkit-border-radius: 100px; -moz-border-radius: 100px; -o-border-radius: 100px; -ms-border-radius: 100px; border-radius: 100px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; color: var(--tg-theme-primary); } .project__content-arrow a:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .project__content-two { text-align: center; position: absolute; left: 0; top: 50%; transform: translateY(-50%); right: 0; padding: 20px; margin-top: 80px; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .project__content-two .title { margin-bottom: 5px; font-size: 22px; color: var(--tg-color-white-default); } .project__content-two span { display: block; color: var(--tg-color-gray-4); margin-bottom: 10px; } .project__content-two > a { width: 60px; height: 40px; display: flex; align-items: center; justify-content: center; margin: 0 auto; background: var(--tg-theme-primary); color: var(--tg-color-white-default); -webkit-border-radius: 80px; -moz-border-radius: 80px; -o-border-radius: 80px; -ms-border-radius: 80px; border-radius: 80px; } .project__content-two > a:hover { background: var(--tg-color-sky-blue); } .project__content-three { padding: 35px 40px; } @media (max-width: 1500px) { .project__content-three { padding: 35px 25px; } } @media (max-width: 1199.98px) { .project__content-three { padding: 30px 25px; } } .project__content-three .title { margin-bottom: 0; font-size: 22px; font-weight: 600; line-height: 1.36; } @media (max-width: 1199.98px) { .project__content-three .title { font-size: 20px; } } .project__content-three .title a { display: inline; background-image: linear-gradient(var(--tg-heading-color), var(--tg-heading-color)), linear-gradient(var(--tg-heading-color), var(--tg-heading-color)); background-size: 0% 2px, 0 2px; background-position: 100% 100%, 0 100%; background-repeat: no-repeat; transition: background-size 0.4s linear; } .project__content-three .title a:hover { color: inherit; background-size: 0 2px, 100% 2px; } .project__content-four { position: absolute; left: 0; bottom: 10px; width: 51%; } @media (max-width: 1800px) { .project__content-four { bottom: 6px; width: 52%; } } @media (max-width: 767.98px) { .project__content-four { bottom: 0; width: 80%; -webkit-border-radius: 0 20px 0 20px; -moz-border-radius: 0 20px 0 20px; -o-border-radius: 0 20px 0 20px; -ms-border-radius: 0 20px 0 20px; border-radius: 0 20px 0 20px; background: var(--tg-color-gray-1); padding: 10px 10px 10px 0; } } .project__content-four .title { margin-bottom: 0; font-size: 22px; font-weight: 600; line-height: 1.36; } @media (max-width: 1800px) { .project__content-four .title { font-size: 20px; } } .project__content-five { position: absolute; left: 20px; right: 20px; bottom: 18px; -webkit-border-radius: 18px; -moz-border-radius: 18px; -o-border-radius: 18px; -ms-border-radius: 18px; border-radius: 18px; border: 1px solid var(--tg-color-white-default); background: rgb(255, 235, 155); backdrop-filter: blur(10px); padding: 10px 24px 10px; /*-webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; margin-bottom: -90px; opacity: 0; visibility: hidden;*/ } .project__content-five span { font-size: 14px; display: block; font-weight: 500; color: var(--tg-theme-primary); margin-bottom: 5px; } .project__content-five .title { margin-bottom: 0; font-size: 24px; font-weight: 600; } .project__content-five .arrow { width: 50px; height: 50px; padding: 0; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 12px; -moz-border-radius: 12px; -o-border-radius: 12px; -ms-border-radius: 12px; border-radius: 12px; border: none; background: var(--tg-theme-primary); color: var(--tg-color-white-default); position: absolute; right: 0; top: -33px; } .project__content-five .arrow:hover { background: var(--tg-theme-secondary); color: var(--tg-color-white-default); } .project__content-six { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: space-between; } .project__content-six .content-left .title { margin-bottom: 8px; font-size: 22px; font-weight: 600; text-transform: capitalize; } .project__content-six .content-left span { display: block; line-height: 1; color: var(--tg-theme-primary); text-transform: capitalize; } .project__content-six .arrow { background: transparent; border: none; padding: 0; width: 48px; height: 48px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; border: 1px solid #D7DAEB; color: var(--tg-theme-primary); } .project__content-six .arrow:hover { background: var(--tg-theme-primary); border-color: var(--tg-theme-primary); color: var(--tg-color-white-default); } .project__content-seven { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 20px; justify-content: space-between; } .project__content-seven .arrow { width: 50px; height: 50px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; padding: 0; justify-content: center; background: var(--tg-color-gray-4); border: none; color: var(--tg-border-1); } .project__content-seven .arrow:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .project__content-eight { position: absolute; left: 10px; bottom: 10px; right: 10px; z-index: 1; background: var(--tg-color-white-default); padding: 24px 24px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; transform: translateY(60px); opacity: 0; visibility: visible; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .project__content-eight .title { font-size: 24px; font-weight: 600; margin-bottom: 8px; text-transform: capitalize; } @media (max-width: 1500px) { .project__content-eight .title { font-size: 22px; } } .project__content-eight span { display: block; line-height: 1; font-size: 14px; font-weight: 500; color: var(--tg-theme-primary); } .project__content-eight .arrow { width: 60px; height: 40px; padding: 0; align-items: center; justify-content: center; position: absolute; right: 30px; top: -19px; } .project__content-nine { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 15px; justify-content: space-between; position: absolute; left: 30px; right: 30px; bottom: 30px; z-index: 2; } .project__content-nine .title { margin-bottom: 14px; color: var(--tg-color-white-default); font-weight: 600; font-size: 24px; text-transform: capitalize; } .project__content-nine .title a { display: inline; background-image: linear-gradient(var(--tg-color-white-default), var(--tg-color-white-default)), linear-gradient(var(--tg-color-white-default), var(--tg-color-white-default)); background-size: 0% 2px, 0 2px; background-position: 100% 100%, 0 100%; background-repeat: no-repeat; transition: background-size 0.4s linear; } .project__content-nine .title a:hover { color: inherit; background-size: 0 2px, 100% 2px; } .project__content-nine span { display: block; color: var(--tg-color-white-default); line-height: 1; font-weight: 500; font-size: 14px; text-transform: capitalize; } .project__content-nine .arrow-btn { width: 60px; height: 60px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex: 0 0 auto; align-items: center; justify-content: center; border: 1px solid var(--tg-color-white-default); color: var(--tg-color-white-default); opacity: 0; visibility: hidden; } .project__content-nine .arrow-btn:hover { background: var(--tg-theme-primary); border-color: var(--tg-theme-primary); } .project__mask-img { -webkit-mask-image: url(../img/project/project_mask_img.svg); mask-image: url(../img/project/project_mask_img.svg); -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; width: 602px; height: 483px; margin: 0 auto; } @media (max-width: 1800px) { .project__mask-img { width: 498px; height: 400px; } } @media (max-width: 767.98px) { .project__mask-img { width: 100%; height: 350px; mask-image: none; -webkit-mask-image: none; } } .project__mask-img img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1); } @media (max-width: 767.98px) { .project__mask-img img { -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; } } .project__tag { font-size: 14px; font-weight: 500; color: var(--tg-theme-primary); background: var(--tg-color-gray-4); display: inline-block; padding: 8px 15px; line-height: 1; -webkit-border-radius: 100px; -moz-border-radius: 100px; -o-border-radius: 100px; -ms-border-radius: 100px; border-radius: 100px; margin-bottom: 15px; } .project__tag:hover { color: var(--tg-color-white-default); background: var(--tg-theme-primary); } .project__tag-two { font-size: 14px; font-weight: 500; background: var(--tg-color-white-default); color: var(--tg-theme-primary); position: absolute; left: 30px; top: 30px; -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; display: block; padding: 6px 15px; } .project__tag-two:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .project__tag-three { display: inline-block; background: var(--tg-color-gray-1); font-size: 14px; font-weight: 500; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; padding: 11px 20px; line-height: 1; } .project__tag-three:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } @media (max-width: 767.98px) { .project__nav-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 40px; } } .project__nav-wrap button { position: absolute; left: 0; top: 50%; transform: translateY(-50%); z-index: 3; width: 60px; height: 60px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; border: none; background: var(--tg-color-white-default); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; color: var(--tg-theme-primary); } @media (max-width: 767.98px) { .project__nav-wrap button { position: inherit; transform: translateY(0); } } .project__nav-wrap button.project-button-prev { left: 25%; transform: translateY(-50%) rotate(180deg); } @media (max-width: 1199.98px) { .project__nav-wrap button.project-button-prev { left: 13%; } } @media (max-width: 991.98px) { .project__nav-wrap button.project-button-prev { left: 4%; } } @media (max-width: 767.98px) { .project__nav-wrap button.project-button-prev { transform: translateY(0) rotate(180deg); } } .project__nav-wrap button.project-button-next { left: auto; right: 25%; } @media (max-width: 1199.98px) { .project__nav-wrap button.project-button-next { right: 13%; } } @media (max-width: 991.98px) { .project__nav-wrap button.project-button-next { right: 4%; } } .project__nav-wrap button:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .project__nav-wrap-two { position: relative; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; gap: 80px; margin-top: 55px; } .project__nav-wrap-two button { -webkit-border-radius: 100px; -moz-border-radius: 100px; -o-border-radius: 100px; -ms-border-radius: 100px; border-radius: 100px; border: 1px solid #D1D4E2; background: var(--tg-color-white-default); box-shadow: 0px 9px 20px 0px rgba(0, 0, 0, 0.1); width: 74px; height: 50px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; color: var(--tg-theme-secondary); padding: 0; position: relative; } .project__nav-wrap-two button svg { width: 28px; height: auto; } .project__nav-wrap-two button:hover { background: var(--tg-theme-primary); border-color: var(--tg-theme-primary); color: var(--tg-color-white-default); } .project__nav-wrap-two button.project-button-prev svg { transform: rotate(180deg); } .project__nav-wrap-two button.project-button-prev::before { content: ""; position: absolute; right: -67px; top: 50%; transform: translateY(-50%); width: 54px; height: 2px; background: #D1D4E2; -webkit-border-radius: 2px; -moz-border-radius: 2px; -o-border-radius: 2px; -ms-border-radius: 2px; border-radius: 2px; } .project__nav-two { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 50px; position: absolute; left: 50%; transform: translateX(-50%); bottom: -22px; } .project__nav-two button { width: 74px; height: 50px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; border: 1px solid #D1D4E2; background: var(--tg-color-white-default); -webkit-border-radius: 100px; -moz-border-radius: 100px; -o-border-radius: 100px; -ms-border-radius: 100px; border-radius: 100px; padding: 0 0; color: var(--tg-theme-secondary); box-shadow: 0px 9px 20px 0px rgba(0, 0, 0, 0.1); } .project__nav-two button.project-button-prev svg { transform: rotate(180deg); } .project__nav-two button:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); border: var(--tg-theme-primary); } .project__nav-three { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: flex-end; margin-bottom: 30px; } @media (max-width: 767.98px) { .project__nav-three { justify-content: flex-start; } } .project__nav-three button { width: 60px; height: 60px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; border: none; color: var(--tg-color-white-default); padding: 0 0; background: var(--tg-theme-primary); } .project__nav-three button.project-button-next { background: #1f5dff; } .project__nav-three button:hover { background: var(--tg-theme-secondary); } .project__pagination { background: var(--tg-color-white-default); border-radius: 20px; max-width: 120px; height: 40px; margin: 0 auto; display: flex; align-items: center; justify-content: center; margin-top: 50px; box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.06); gap: 6px; border: 1px solid #DFE1ED; } .project__pagination .swiper-pagination-bullet { width: 10px; height: 10px; background: #C9C9C9; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; margin: 0 !important; opacity: 1; -webkit-transition: all 0.2s ease-out 0s; -moz-transition: all 0.2s ease-out 0s; -ms-transition: all 0.2s ease-out 0s; -o-transition: all 0.2s ease-out 0s; transition: all 0.2s ease-out 0s; } .project__pagination .swiper-pagination-bullet-active { width: 15px; height: 15px; background: var(--tg-theme-primary); } .project__details-thumb { margin-bottom: 30px; } .project__details-thumb img { width: 100%; max-height: 500px; object-fit: cover; min-height: 300px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; } .project__details-content > .title { margin-bottom: 15px; font-size: 36px; text-transform: capitalize; } @media (max-width: 1199.98px) { .project__details-content > .title { font-size: 34px; } } @media (max-width: 767.98px) { .project__details-content > .title { font-size: 30px; } } .project__details-content > p { margin-bottom: 0; } .project__details-content .title-two { margin-bottom: 15px; font-weight: 600; font-size: 30px; } .project__details-challenge { margin-top: 40px; margin-bottom: 50px; } .project__details-challenge > p { margin-bottom: 30px; } .project__details-report > p { margin-bottom: 20px; } .project__details-report-inner { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 50px; margin-bottom: 30px; } @media (max-width: 1199.98px) { .project__details-report-inner { gap: 20px; } } @media (max-width: 767.98px) { .project__details-report-inner { flex-wrap: wrap; gap: 30px; } } .project__details-report-inner .progress__wrap { flex-grow: 1; } .project__details-report-inner .inner-img { width: 342px; flex: 0 0 auto; } @media (max-width: 1199.98px) { .project__details-report-inner .inner-img { width: 270px; } } @media (max-width: 767.98px) { .project__details-report-inner .inner-img { width: 100%; } } .project__details-report-inner .inner-img img { width: 100%; height: 220px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; object-fit: cover; } .project__details-info-wrap { -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; border: 1px solid var(--tg-color-gray-4); padding: 30px 40px 40px; } @media (max-width: 1199.98px) { .project__details-info-wrap { padding: 30px 30px 40px; } } .project__details-info-wrap > .list-wrap > li { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; border-bottom: 1px solid #DEE0EC; color: var(--tg-body-color); text-transform: capitalize; gap: 10px; margin-bottom: 13px; padding-bottom: 13px; } .project__details-info-wrap > .list-wrap > li span { font-weight: 600; min-width: 82px; } .project__details-info-wrap > .list-wrap > li:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: none; } .project__details-info-wrap > .list-wrap > li.social .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 10px; } .project__details-info-wrap > .list-wrap > li.social .list-wrap li a { color: var(--tg-body-color); } .project__details-info-wrap > .list-wrap > li.social .list-wrap li a svg { width: 18px; height: 18px; } .project__details-info-wrap > .list-wrap > li.social .list-wrap li a:hover { color: var(--tg-theme-primary); } .project__details-contact a { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; font-size: 18px; font-weight: 500; color: var(--tg-color-white-default); background: var(--tg-theme-primary); -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; gap: 15px; padding: 15px 20px; margin-bottom: 8px; } .project__details-contact a:last-child { margin-bottom: 0; } .project__details-contact a i { font-size: 24px; } .project__details-contact a:hover { background: var(--tg-theme-secondary); } .project__sidebar { margin-left: 26px; } @media (max-width: 1199.98px) { .project__sidebar { margin-left: 0; } } @media (max-width: 991.98px) { .project__sidebar { margin-top: 50px; } } .project__shape img { position: absolute; left: 110px; top: -103px; z-index: -1; } @media (max-width: 1500px) { .project__shape img { width: 180px; height: 180px; } } @media (max-width: 767.98px) { .project__shape img { width: 140px; height: 140px; left: 50px; top: -76px; } } .project__shape-two img { position: absolute; right: 0; top: 0; z-index: -1; } @media (max-width: 767.98px) { .section__btn { text-align: left !important; margin-bottom: 50px; } } /*============================= 12. Team ===============================*/ .team__area { background: var(--tg-theme-primary); position: relative; z-index: 1; } .team__area-two { position: relative; z-index: 1; } .team__area-two::before { content: ""; position: absolute; left: -300px; top: 0; width: 560px; height: 560px; background: #FF7438; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; filter: blur(150px); opacity: 0.1; z-index: -1; } .team__area-three { position: relative; z-index: 1; } .team__area-three::before { content: ""; position: absolute; left: -235px; top: 0; width: 450px; height: 450px; background: #38CFFF; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; filter: blur(150px); opacity: 0.1; z-index: -1; } .team__area-three::after { content: ""; position: absolute; right: -244px; bottom: -350px; width: 560px; height: 560px; background: #FF7438; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; filter: blur(150px); opacity: 0.1; z-index: -1; } .team__area-five { position: relative; z-index: 1; } .team__area-five::before { content: ""; position: absolute; right: -180px; top: 100px; width: 400px; height: 400px; background: #C3CEFA; filter: blur(150px); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; z-index: -1; } .team__area-six { position: relative; z-index: 1; background: var(--tg-theme-secondary); } .team__item { background: var(--tg-color-white-default); padding: 25px 0 0; overflow: hidden; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; height: 100%; position: relative; } .team__item:hover .team__thumb img { filter: grayscale(0); } .team__item:hover .team__shape img { filter: grayscale(0); } .team__item-two { text-align: center; } @keyframes float { 0%, 100% { transform: translateY(0px); } 50% { transform: translateY(-10px); } } .team__item-three { background: var(--tg-color-white-default); box-shadow: 10px 10px 20px 0px rgba(0, 0, 0, 0.06); border: 1px solid #DFE1ED; text-align: center; border-radius: 20px; padding: 40px 20px; height: 100%; display: flex; flex-direction: column; justify-content: center; animation: float 3s ease-in-out infinite; transition: all 0.3s ease-out 0s; } .team__item-three:hover .team__thumb-three img { filter: grayscale(0); } .team__item-four { position: relative; z-index: 1; height: 100%; display: flex; flex-direction: column; justify-content: space-between; padding: 20px 50px 0; } @media (max-width: 1199.98px) { .team__item-four { padding: 20px 30px 0; } } @media (max-width: 991.98px) { .team__item-four { padding: 20px 50px 0; } } .team__item-four:hover .team__thumb-four img { filter: grayscale(0); } .team__item-six { position: relative; padding-bottom: 34px; height: 100%; } .team__item-eight { text-align: center; } .team__item-shape { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1; } .team__item-shape svg { width: 100%; height: 100%; overflow: visible; display: block; stroke-width: 1px; stroke: #E2E2E2; } .team__thumb { padding: 0 20px 0; text-align: center; } .team__thumb img { filter: grayscale(1); } .team__thumb-two { background: var(--tg-color-white-default); text-align: center; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; position: relative; padding: 30px 0 0 0; margin-bottom: 18px; min-height: 345px; display: flex; align-items: flex-end; justify-content: center; } .team__thumb-three { width: 200px; height: 200px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; margin: 0 auto; background: var(--tg-color-gray-12); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; overflow: hidden; margin-bottom: 20px; } .team__thumb-three img { margin-bottom: -25px; filter: grayscale(1); } .team__thumb-four { text-align: center; margin-top: auto; } .team__thumb-four img { filter: grayscale(1); } .team__thumb-five { text-align: center; border-radius: 30px; border: 1px solid var(--tg-border-1); background: var(--tg-color-white-default); overflow: hidden; min-height: 350px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: flex-end; justify-content: center; position: relative; z-index: 1; } .team__thumb-five .shape img { position: absolute; left: 50%; transform: translateX(-50%); top: 0; z-index: -1; } .team__thumb-six { position: relative; background: var(--tg-color-white-default); text-align: center; padding: 30px 0 20px; border-radius: 8px 20px; } .team__thumb-seven { background: var(--tg-color-gray-1); } .team__thumb-eight { position: relative; z-index: 1; margin-bottom: 18px; } .team__thumb-eight img { -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; border: 1px solid #E2E4F0; width: 100%; } .team__thumb-nine { background: var(--tg-color-gray-1); -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; margin-bottom: 0; } .team__content { position: relative; z-index: 1; margin-top: -10px; padding: 0 30px 20px; } .team__content::before { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 150px; background: var(--tg-color-white-default); filter: blur(25px); z-index: -1; } .team__content .title { font-size: 24px; font-weight: 600; margin-bottom: 8px; } .team__content span { display: block; line-height: 1; } .team__content-two .title { font-size: 24px; font-weight: 600; margin-bottom: 5px; } .team__content-two span { display: block; line-height: 1; color: var(--tg-theme-primary); } .team__content-three .title { margin-bottom: 8px; font-size: 24px; font-weight: 600; } .team__content-three span { display: block; line-height: 1; margin-bottom: 25px; } .team__content-four { padding: 0px 0px 0px 25px; margin-bottom: 30px; } .team__content-four .title { font-size: 24px; margin-bottom: 7px; } @media (max-width: 1199.98px) { .team__content-four .title { font-size: 22px; } } .team__content-four span { display: block; color: var(--tg-theme-primary); line-height: 1; } .team__content-five { text-align: center; margin-top: 30px; } .team__content-five .title { margin-bottom: 6px; font-size: 24px; font-weight: 600; } .team__content-five span { display: block; color: var(--tg-theme-primary); line-height: 1; } .team__content-six { position: absolute; text-align: center; left: 24px; right: 24px; background: var(--tg-theme-primary); border-radius: 4px 15px; padding: 12px 20px; bottom: 0; } .team__content-six .title { color: var(--tg-color-white-default); font-size: 22px; font-weight: 600; margin-bottom: 5px; } .team__content-six .title a:hover { color: var(--tg-color-white-default); } .team__content-six span { display: block; color: #F5F6FC; } .team__content-eight .title { margin-bottom: 0; font-size: 24px; text-transform: capitalize; font-weight: 600; } .team__content-eight span { line-height: 1; color: var(--tg-theme-primary); } .team__content-nine { background: var(--tg-theme-secondary); text-align: center; padding: 17px 15px; } .team__content-nine .title { color: var(--tg-color-white-default); font-size: 22px; font-weight: 600; text-transform: capitalize; margin-bottom: 6px; } .team__content-nine .title a:hover { color: var(--tg-color-white-default); } .team__content-nine span { display: block; color: var(--tg-color-gray-1); line-height: 1; } .team__social { position: absolute; right: 20px; top: 25px; background: var(--tg-color-gray-5); -webkit-border-radius: 30px; -moz-border-radius: 30px; -o-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; } .team__social .social-toggle-icon { width: 45px; height: 45px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-color-gray-5); cursor: pointer; font-size: 18px; color: var(--tg-theme-primary); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } .team__social .list-wrap { display: flex; align-items: center; flex-direction: column; gap: 5px; padding: 0 0 15px; display: none; text-align: center; } .team__social .list-wrap li a { font-size: 18px; color: var(--tg-theme-primary); } .team__social .list-wrap li a:hover { color: var(--tg-theme-secondary); } .team__social .list-wrap li a svg { width: 18px; height: 18px; } .team__social-two { position: absolute; right: 0; top: 25px; z-index: 1; padding: 36px 14px; } .team__social-two .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; flex-direction: column; gap: 15px; } .team__social-two .list-wrap li { line-height: 1; } .team__social-two .list-wrap li a { font-size: 15px; color: var(--tg-theme-primary); } .team__social-two .list-wrap li a svg { width: 18px; height: 18px; } .team__social-two .list-wrap li a:hover { color: var(--tg-theme-secondary); } .team__social-three .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; gap: 22px; } .team__social-three .list-wrap li a { color: var(--tg-theme-primary); } .team__social-three .list-wrap li a:hover { color: var(--tg-theme-secondary); } .team__social-three .list-wrap li a svg { width: 18px; height: 18px; } .team__social-four .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; position: absolute; right: 16px; top: 31%; flex-direction: column; gap: 30px; } .team__social-four .list-wrap li { line-height: 1; } .team__social-four .list-wrap li a { display: block; color: var(--tg-border-1); } .team__social-four .list-wrap li a svg { width: 20px; height: 20px; } .team__social-four .list-wrap li a:hover { color: var(--tg-theme-primary); } .team__social-five { background: var(--tg-theme-primary); top: auto; bottom: 17px; right: 17px; } .team__social-five .social-toggle-icon { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .team__social-five .list-wrap { padding: 15px 0 0; } .team__social-five .list-wrap li a { color: var(--tg-color-white-default); } .team__social-five .list-wrap li a:hover { color: var(--tg-color-white-default); } .team__social-six .team__social-shape svg { color: var(--tg-theme-primary); } .team__social-six .list-wrap li a { color: var(--tg-color-white-default); } .team__social-six .list-wrap li a:hover { color: var(--tg-color-white-default); } .team__social-seven { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); padding: 14px 31px 10px 31px; } .team__social-seven .team__social-shape svg { width: 100%; height: 100%; display: block; position: absolute; left: 0; top: 0; z-index: -1; color: var(--tg-theme-primary); } .team__social-seven .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 15px; } .team__social-seven .list-wrap li { line-height: 1; } .team__social-seven .list-wrap li a { color: var(--tg-color-white-default); } .team__social-seven .list-wrap li a svg { width: 18px; height: 18px; } .team__social-eight { right: 10px; top: 10px; -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; background: var(--tg-color-white-default); } .team__social-eight .social-toggle-icon { width: 50px; height: 50px; background: var(--tg-color-white-default); -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; } .team__social-shape svg { width: 100%; height: 100%; display: block; position: absolute; left: 0; top: 0; z-index: -1; color: #E9ECFE; } .team__bottom-content { margin-top: 60px; } .team__bottom-content p { margin-bottom: 0; color: var(--tg-color-white-default); } .team__bottom-content p a { color: var(--tg-color-white-default); font-weight: 500; text-decoration: underline; } .team__details-img { text-align: center; margin-bottom: 40px; } .team__details-img img { -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; border: 1px solid var(--tg-color-gray-4); } .team__details-info-wrap { margin-left: 10px; border: 1px solid #E0E1E9; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; padding: 54px 55px; margin-bottom: 40px; } @media (max-width: 1199.98px) { .team__details-info-wrap { margin-left: 0; padding: 30px 30px; } } .team__details-info-wrap .title { margin-bottom: 15px; font-size: 36px; font-weight: 600; line-height: 1; } @media (max-width: 1199.98px) { .team__details-info-wrap .title { font-size: 34px; } } @media (max-width: 767.98px) { .team__details-info-wrap .title { font-size: 30px; } } .team__details-info-wrap > span { display: block; line-height: 1; font-size: 18px; position: relative; padding-bottom: 17px; margin-bottom: 30px; } .team__details-info-wrap > span::before { content: ""; position: absolute; left: 0; bottom: 0; width: 40px; height: 5px; background: var(--tg-theme-primary); -webkit-border-radius: 100px; -moz-border-radius: 100px; -o-border-radius: 100px; -ms-border-radius: 100px; border-radius: 100px; } .team__details-info-wrap > p { margin-bottom: 15px; } .team__details-social { margin-bottom: 30px; } .team__details-social .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 6px; } .team__details-social .list-wrap li a { width: 40px; height: 40px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-color-gray-4); -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; color: var(--tg-heading-color); } .team__details-social .list-wrap li a svg { width: 16px; height: 16px; } .team__details-social .list-wrap li a:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .team__details-inner { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-wrap: wrap; gap: 30px 0; margin-top: 40px; } @media (max-width: 1199.98px) { .team__details-inner { margin-top: 20px; } } .team__details-inner li { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 10px; width: 50%; flex: 0 0 auto; } @media (max-width: 767.98px) { .team__details-inner li { width: 100%; } } .team__details-inner li:first-child { width: 100%; } .team__details-inner li .icon { width: 40px; height: 40px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-theme-primary); flex: 0 0 auto; color: var(--tg-color-white-default); -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; font-size: 20px; } .team__details-inner li .content span { display: block; font-size: 14px; font-weight: 500; color: var(--tg-border-1); line-height: 1; margin-bottom: 8px; } .team__details-inner li .content p { font-size: 18px; margin-bottom: 0; font-weight: 500; line-height: 1; color: var(--tg-heading-color); } .team__details-inner li .content a { font-size: 18px; font-weight: 500; line-height: 1; color: var(--tg-heading-color); display: block; } .team__details-inner li .content a:hover { color: var(--tg-theme-primary); } .team__details-skill { border: 1px solid #E0E1E9; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; padding: 45px 50px; gap: 30px 110px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; margin-bottom: 40px; } @media (max-width: 1199.98px) { .team__details-skill { padding: 35px 30px; gap: 30px 30px; } } @media (max-width: 991.98px) { .team__details-skill { flex-wrap: wrap; } } .team__details-skill-content { width: 46%; flex: 0 0 auto; } @media (max-width: 991.98px) { .team__details-skill-content { width: 100%; } } .team__details-skill-content .title { margin-bottom: 22px; font-size: 30px; font-weight: 600; position: relative; padding-bottom: 20px; text-transform: capitalize; } @media (max-width: 991.98px) { .team__details-skill-content .title { font-size: 28px; } } .team__details-skill-content .title::before { content: ""; position: absolute; left: 0; bottom: 0; width: 40px; height: 5px; -webkit-border-radius: 100px; -moz-border-radius: 100px; -o-border-radius: 100px; -ms-border-radius: 100px; border-radius: 100px; background: var(--tg-theme-primary); } .team__details-skill-content > p { margin-bottom: 0; } .team__details-skill .progress__wrap { flex-grow: 1; } .team__details-contact { border: 1px solid #E0E1E9; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; padding: 50px 50px; gap: 65px; } @media (max-width: 1199.98px) { .team__details-contact { gap: 30px; padding: 35px 30px; } } @media (max-width: 991.98px) { .team__details-contact { flex-wrap: wrap; } } .team__details-contact-content { width: 44%; flex: 0 0 auto; } @media (max-width: 991.98px) { .team__details-contact-content { width: 100%; } } .team__details-contact-content .title { margin-bottom: 22px; font-size: 30px; font-weight: 600; position: relative; padding-bottom: 20px; text-transform: capitalize; } @media (max-width: 991.98px) { .team__details-contact-content .title { font-size: 28px; } } .team__details-contact-content .title::before { content: ""; position: absolute; left: 0; bottom: 0; width: 40px; height: 5px; -webkit-border-radius: 100px; -moz-border-radius: 100px; -o-border-radius: 100px; -ms-border-radius: 100px; border-radius: 100px; background: var(--tg-theme-primary); } .team__details-contact-content p { margin-bottom: 0; } .team__details-form .form-grp textarea, .team__details-form .form-grp input { background: #F8F8F8 !important; color: var(--tg-body-color) !important; } .team__details-form .form-grp textarea::placeholder, .team__details-form .form-grp input::placeholder { color: var(--tg-body-color) !important; } .team__details-form button { background: var(--tg-theme-primary) !important; color: var(--tg-color-white-default) !important; } .team__details-form button:hover { background: var(--tg-theme-secondary) !important; } .team__shape img { position: absolute; right: 0; bottom: 0; z-index: 2; filter: grayscale(1); } .team__shape-wrap img { position: absolute; z-index: -1; } .team__shape-wrap img:nth-child(1) { right: 0; top: 0; } @media (max-width: 1500px) { .team__shape-wrap img:nth-child(1) { max-width: 300px; } } .team__shape-wrap img:nth-child(2) { left: 0; bottom: 0; } @media (max-width: 1500px) { .team__shape-wrap img:nth-child(2) { max-width: 200px; } } .team__shape-wrap img:nth-child(3) { right: 9%; bottom: 24%; } @media (max-width: 1800px) { .team__shape-wrap img:nth-child(3) { right: 3%; } } @media (max-width: 1500px) { .team__shape-wrap img:nth-child(3) { bottom: 15%; } } @media (max-width: 767.98px) { .team__shape-wrap img:nth-child(3) { display: none; } } .team__shape-wrap-two img { position: absolute; z-index: -1; } .team__shape-wrap-two img:nth-child(1) { right: 0; top: 0; } @media (max-width: 1500px) { .team__shape-wrap-two img:nth-child(1) { max-width: 300px; } } .team__shape-wrap-two img:nth-child(2) { left: 0; bottom: 0; } @media (max-width: 1500px) { .team__shape-wrap-two img:nth-child(2) { max-width: 180px; } } .team__shape-wrap-two img:nth-child(3) { bottom: 24%; right: 8%; } @media (max-width: 1800px) { .team__shape-wrap-two img:nth-child(3) { bottom: 19%; right: 4%; } } @media (max-width: 1500px) { .team__shape-wrap-two img:nth-child(3) { bottom: 15%; right: 3%; } } .col-44 { width: 43.5%; flex: 0 0 auto; } @media (max-width: 991.98px) { .col-44 { width: 70%; } } @media (max-width: 767.98px) { .col-44 { width: 100%; } } .col-56 { width: 56.5%; flex: 0 0 auto; } @media (max-width: 991.98px) { .col-56 { width: 100%; } } /*============================= 13. FAQ ===============================*/ .faq__area-three { position: relative; z-index: 1; } .faq__content { margin-right: 50px; position: relative; } @media (max-width: 1199.98px) { .faq__content { margin-right: 0; } } @media (max-width: 991.98px) { .faq__content { margin-bottom: 80px; } } .faq__content p { margin-bottom: 25px; } .faq__content .shape img { position: absolute; left: -35px; bottom: -30px; } @media (max-width: 1199.98px) { .faq__content .shape img { left: -24px; bottom: -24px; max-width: 100px; } } @media (max-width: 767.98px) { .faq__content .shape img { left: -2px; bottom: -21px; max-width: 90px; } } .faq__content-two { position: relative; z-index: 1; } @media (max-width: 991.98px) { .faq__content-two { margin-bottom: 50px; text-align: center; } } .faq__content-two > p { margin-bottom: 25px; } .faq__content-two .shape img { position: absolute; left: -16%; bottom: -6%; z-index: -1; -webkit-animation-duration: 40s; animation-duration: 40s; } @media (max-width: 1500px) { .faq__content-two .shape img { left: -10%; bottom: -5%; max-width: 180px; } } @media (max-width: 991.98px) { .faq__content-two .shape img { left: 6%; bottom: -7%; } } @media (max-width: 767.98px) { .faq__content-two .shape img { display: none; } } .faq__img img { -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; } .faq__img-two { text-align: right; } @media (max-width: 991.98px) { .faq__img-two { text-align: center; margin-bottom: 50px; } } .faq__img-two img { -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; } .faq__mask-img { -webkit-mask-image: url(../img/images/faq_mask_img.svg); mask-image: url(../img/images/faq_mask_img.svg); -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; width: 491px; height: 311px; } @media (max-width: 1199.98px) { .faq__mask-img { width: 450px; height: 286px; } } @media (max-width: 991.98px) { .faq__mask-img { margin: 0 auto; } } @media (max-width: 767.98px) { .faq__mask-img { width: 340px; height: 215px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .faq__mask-img { width: 390px; height: 250px; } } .faq__mask-img img { width: 100%; height: 100%; object-fit: cover; } .faq__wrap .accordion-item { -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; border: none; border-bottom: 1px solid var(--tg-border-5); background-color: transparent; } .faq__wrap .accordion-item:first-child { border-top: 1px solid var(--tg-border-5); } .faq__wrap .accordion-button { font-size: 22px; font-weight: 600; padding: 30px 30px 30px 0; color: var(--tg-heading-color); background: transparent; position: relative; } @media (max-width: 767.98px) { .faq__wrap .accordion-button { font-size: 18px; } } .faq__wrap .accordion-button:not(.collapsed) { color: var(--tg-theme-primary); background: transparent; box-shadow: none; } .faq__wrap .accordion-button:not(.collapsed)::before { content: "\f10a"; color: var(--tg-theme-primary); } .faq__wrap .accordion-button:focus { border-color: none; box-shadow: none; } .faq__wrap .accordion-button::after { display: none; } .faq__wrap .accordion-button::before { content: "\f109"; position: absolute; right: 0; top: 28px; font-family: "flaticon_tg_default"; font-weight: 400; font-size: 20px; color: var(--tg-color-gray-6); } .faq__wrap .accordion-body { padding: 0 0 30px; } .faq__wrap .accordion-body p { margin-bottom: 0; } .faq__wrap-two { margin-left: 45px; } @media (max-width: 1199.98px) { .faq__wrap-two { margin-left: 0; } } .faq__wrap-two .accordion-item { -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; border: none; border-bottom: none; background-color: var(--tg-color-white-default); overflow: hidden; margin-bottom: 6px; } .faq__wrap-two .accordion-item:last-child { margin-bottom: 0; } .faq__wrap-two .accordion-item:first-child { border-top: none; } .faq__wrap-two .accordion-button { font-size: 20px; font-weight: 600; padding: 23px 75px 23px 30px; color: var(--tg-heading-color); background: var(--tg-color-white-default); position: relative; } @media (max-width: 767.98px) { .faq__wrap-two .accordion-button { font-size: 18px; padding: 23px 60px 23px 20px; } } .faq__wrap-two .accordion-button:not(.collapsed)::before { content: "\f10a"; color: var(--tg-color-white-default); background: var(--tg-theme-primary); } .faq__wrap-two .accordion-button::after { display: none; } .faq__wrap-two .accordion-button::before { content: "\f109"; position: absolute; width: 38px; height: 38px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; right: 30px; top: 16px; font-family: "flaticon_tg_default"; font-weight: 400; font-size: 16px; background: var(--tg-border-1); color: var(--tg-color-gray-4); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } @media (max-width: 767.98px) { .faq__wrap-two .accordion-button::before { right: 15px; } } .faq__wrap-two .accordion-body { padding: 0 30px 30px; } @media (max-width: 767.98px) { .faq__wrap-two .accordion-body { padding: 0 20px 25px; } } .faq__wrap-two .accordion-body p { margin-bottom: 0; } .faq__wrap-three .accordion-button::before { content: "\f109"; position: absolute; right: 0; top: 28px; font-family: "flaticon_tg_default"; font-weight: 700; font-size: 14px; color: var(--tg-theme-primary); border: 2px solid var(--tg-theme-primary); border-radius: 50%; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; } .faq__wrap-four .accordion-item { border: none; margin-bottom: 6px; } .faq__wrap-four .accordion-item:first-child { border: none; } .faq__wrap-four .accordion-item:last-child { margin-bottom: 0; } .faq__wrap-four .accordion-button { font-size: 18px; font-weight: 500; text-transform: capitalize; padding: 14px 52px 14px 20px; border: 1px solid var(--tg-color-gray-4); background: var(--tg-color-gray-2); -webkit-border-radius: 8px !important; -moz-border-radius: 8px !important; -o-border-radius: 8px !important; -ms-border-radius: 8px !important; border-radius: 8px !important; } .faq__wrap-four .accordion-button:not(.collapsed) { background: var(--tg-theme-primary); color: var(--tg-color-white-default); border-color: var(--tg-theme-primary); } .faq__wrap-four .accordion-button:not(.collapsed)::before { color: var(--tg-color-white-default); } .faq__wrap-four .accordion-button::before { right: 20px; top: 15px; font-size: 18px; color: var(--tg-theme-primary); } .faq__wrap-four .accordion-body { padding: 20px 20px 25px; } .faq__shape-wrap img { position: absolute; z-index: -1; } .faq__shape-wrap img:nth-child(1) { left: 0; top: 0; } .faq__shape-wrap img:nth-child(2) { right: 0; top: 0; } /*============================= 14. Testimonial ===============================*/ .testimonial__area { position: relative; z-index: 1; background: var(--tg-color-gray-1); padding: 245px 0 140px; margin-top: -105px; } @media (max-width: 767.98px) { .testimonial__area { padding: 210px 0 100px; } } .testimonial__area-two { position: relative; z-index: 1; } .testimonial__area-two::before { content: ""; position: absolute; right: -300px; top: 0; width: 560px; height: 560px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; background: #7838FF; filter: blur(150px); opacity: 0.1; z-index: -1; } .testimonial__area-three { position: relative; z-index: 1; } .testimonial__area-three::before { content: ""; position: absolute; left: -244px; top: 70px; width: 460px; height: 460px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; background: #7838FF; filter: blur(125px); opacity: 0.1; z-index: -1; } .testimonial__area-six { padding: 130px 0 130px; margin-top: 0; } @media (max-width: 767.98px) { .testimonial__area-six { padding: 100px 0; } } .testimonial__area-seven { position: relative; z-index: 1; } .testimonial__bg { background-position: center; background-size: cover; position: relative; z-index: 1; } .testimonial__bg-two { background-size: cover; background-position: center; position: relative; z-index: 1; padding: 140px 0 225px; } @media (max-width: 767.98px) { .testimonial__bg-two { padding: 100px 0 185px; } } .testimonial__bg-three { background-size: cover; background-position: center; position: relative; z-index: 1; } .testimonial__bg-four { background-size: cover; background-position: center; background-color: var(--tg-theme-primary); position: relative; z-index: 1; } .testimonial__wrap { padding: 0 110px; position: relative; } @media (max-width: 991.98px) { .testimonial__wrap { padding: 0 70px; } } @media (max-width: 767.98px) { .testimonial__wrap { padding: 0 0; } } .testimonial__wrap-two { padding: 0 120px; } @media (max-width: 991.98px) { .testimonial__wrap-two { padding: 0 70px; } } @media (max-width: 767.98px) { .testimonial__wrap-two { padding: 0 0; } } .testimonial__wrap-three { position: relative; } .testimonial__item { text-align: center; } .testimonial__item-two { background: var(--tg-color-white-default); border-radius: 20px; border: 1px solid var(--tg-border-9); padding: 35px 35px; position: relative; z-index: 1; } .testimonial__item-two > p { margin-bottom: 22px; } .testimonial__item-three { -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; border: 1px solid var(--tg-border-9); background: var(--tg-color-white-default); padding: 40px 35px; position: relative; overflow: hidden; z-index: 1; } @media (max-width: 767.98px) { .testimonial__item-three { padding: 30px 30px; } } .testimonial__item-five { border: none; box-shadow: -13px 10px 20px 0px rgba(0, 0, 0, 0.15); -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; } .testimonial__item-five > p { font-size: 16px; font-weight: 500; font-style: italic; margin-bottom: 15px; } .testimonial__item-five .testimonial__icon-two { color: #E3E3E3; } .testimonial__item-five .testimonial__author { gap: 10px; } .testimonial__item-five .testimonial__author .thumb { width: 50px; height: 50px; } .testimonial__item-six { border: 1px solid #E5E5E5; padding: 40px 40px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; background: var(--tg-color-white-default); } @media (max-width: 1199.98px) { .testimonial__item-six { padding: 30px 30px; } } .testimonial__item-seven { -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; } .testimonial__item-wrap-two { margin-right: 100px; } @media (max-width: 1199.98px) { .testimonial__item-wrap-two { margin-right: 0; } } .testimonial__item-wrap-three { position: relative; z-index: 1; } .testimonial__icon { width: 82px; height: 82px; margin: 0 auto 28px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-color-white-default); border: 1px solid var(--tg-border-5); -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; color: var(--tg-theme-primary); } .testimonial__icon-two svg { position: absolute; right: 35px; bottom: 45px; z-index: -1; } .testimonial__icon-three svg { position: absolute; right: 35px; bottom: -1px; z-index: -3; width: 56px; height: auto; } .testimonial__content > p { font-size: 20px; font-weight: 500; font-style: italic; text-transform: capitalize; margin-bottom: 30px; } .testimonial__content-bottom .title { font-size: 24px; font-weight: 600; margin-bottom: 5px; } .testimonial__content-bottom span { display: block; } .testimonial__content-bottom-two .title { color: var(--tg-color-white-default); } .testimonial__content-bottom-two span { color: #B3CCFF; } .testimonial__content-bottom-three .title { margin-bottom: 6px; font-size: 18px; font-weight: 600; text-transform: capitalize; } .testimonial__content-bottom-three span { display: block; line-height: 1; color: #7F838C; } .testimonial__content-top { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-bottom: 30px; } .testimonial__content-top .testimonial__rating-two { margin-bottom: 0; } .testimonial__content-two > p { margin-bottom: 0; font-size: 18px; line-height: 1.55; color: var(--tg-border-1); } .testimonial__content-three { text-align: center; } .testimonial__content-three > p { margin-bottom: 30px; font-size: 22px; font-weight: 500; color: var(--tg-color-white-default); font-style: italic; text-transform: capitalize; line-height: 1.63; } @media (max-width: 767.98px) { .testimonial__content-three > p { font-size: 20px; } } .testimonial__content-three .testimonial__rating { margin-bottom: 20px; } @media (max-width: 991.98px) { .testimonial__content-four { margin-bottom: 50px; } } .testimonial__content-four .section__title .title { font-size: 40px; } @media (max-width: 1199.98px) { .testimonial__content-four .section__title .title { font-size: 36px; } } @media (max-width: 767.98px) { .testimonial__content-four .section__title .title { font-size: 30px; } } .testimonial__content-four p { margin-bottom: 20px; width: 95%; } @media (max-width: 1199.98px) { .testimonial__content-four p { width: 100%; } } .testimonial__content-five p { margin-bottom: 12px; } .testimonial__content-six { margin-right: 90px; } @media (max-width: 1199.98px) { .testimonial__content-six { margin-right: 0; } } .testimonial__content-seven p { color: var(--tg-color-white-default); } .testimonial__author { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 20px; } .testimonial__author .thumb { width: 60px; height: 60px; flex: 0 0 auto; } .testimonial__author .thumb img { width: 100%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } .testimonial__author .content .title { margin-bottom: 8px; font-size: 18px; font-weight: 600; } .testimonial__author .content span { display: block; line-height: 1; font-weight: 500; font-size: 15px; } .testimonial__author .rating { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; color: var(--tg-color-yellow-light); gap: 4px; } .testimonial__author-two { gap: 15px; margin-bottom: 12px; } .testimonial__rating { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; font-size: 22px; color: var(--tg-color-yellow-light); gap: 5px; margin-bottom: 15px; } .testimonial__rating-two { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 4px; color: var(--tg-color-yellow-light); margin-bottom: 15px; } .testimonial__nav .swiper-wrapper { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 10px; margin-top: 30px; justify-content: center; } .testimonial__nav .swiper-wrapper .swiper-slide { width: auto !important; } .testimonial__nav .swiper-wrapper button { border: none; background: transparent; padding: 0; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; position: relative; width: 65px; } .testimonial__nav .swiper-wrapper button img { -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; width: 100%; filter: grayscale(1); } .testimonial__nav .swiper-slide-thumb-active button img { filter: grayscale(0); } @media (max-width: 767.98px) { .testimonial__nav-two { display: none; } } .testimonial__nav-two button { position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 60px; height: 60px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; border: none; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; background: var(--tg-color-white-default); color: var(--tg-theme-primary); } .testimonial__nav-two button.testimonial-button-next { left: auto; right: 0; } .testimonial__nav-two button.testimonial-button-prev { transform: translateY(-50%) rotate(180deg); } .testimonial__nav-two button:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .testimonial__nav-three .swiper-wrapper button { border: 3px solid var(--tg-color-white-default); width: 50px; } .testimonial__nav-four button { width: 50px; height: 50px; background: #0039CB; color: var(--tg-color-white-default); } .testimonial__nav-four button:hover { background: var(--tg-theme-secondary); } @media (max-width: 991.98px) { .testimonial__nav-five { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; margin-top: 50px; gap: 20px; } } .testimonial__nav-five button { width: 50px; height: 50px; background: #0039CB; color: var(--tg-color-white-default); display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; border: none; position: absolute; left: -85px; top: 50%; transform: translateY(-50%); z-index: 1; } @media (max-width: 1500px) { .testimonial__nav-five button { left: -55px; } } @media (max-width: 1199.98px) { .testimonial__nav-five button { left: -15px; } } @media (max-width: 991.98px) { .testimonial__nav-five button { position: inherit; transform: translateY(0); } } .testimonial__nav-five button:hover { background: var(--tg-theme-secondary); } .testimonial__nav-five button.testimonial-button-next { left: auto; right: -85px; } @media (max-width: 1500px) { .testimonial__nav-five button.testimonial-button-next { right: -55px; } } @media (max-width: 1199.98px) { .testimonial__nav-five button.testimonial-button-next { right: -15px; } } .testimonial__nav-five button.testimonial-button-prev { transform: translateY(-50%) rotate(-180deg); } @media (max-width: 991.98px) { .testimonial__nav-five button.testimonial-button-prev { transform: translateY(0) rotate(-180deg); } } .testimonial__nav-six { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 10px; } .testimonial__nav-six button { width: 60px; height: 60px; border: none; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; background: var(--tg-color-gray-1); color: var(--tg-theme-primary); padding: 0; } .testimonial__nav-six button svg { width: 26px; height: auto; } .testimonial__nav-six button.testimonial-button-prev { transform: rotate(-180deg); } .testimonial__nav-six button:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } @media (max-width: 991.98px) { .testimonial__nav-seven { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; margin-top: 30px; gap: 15px; } } .testimonial__nav-seven button { width: 60px; height: 60px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; border: none; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; padding: 0; background: var(--tg-color-gray-1); color: var(--tg-theme-primary); position: absolute; left: -85px; top: 50%; transform: translateY(-50%); z-index: 2; } @media (max-width: 1500px) { .testimonial__nav-seven button { left: -50px; } } @media (max-width: 1199.98px) { .testimonial__nav-seven button { left: -20px; } } @media (max-width: 991.98px) { .testimonial__nav-seven button { position: inherit; transform: translateY(0); } } .testimonial__nav-seven button:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .testimonial__nav-seven button.testimonial-button-next { left: auto; right: -85px; } @media (max-width: 1500px) { .testimonial__nav-seven button.testimonial-button-next { right: -50px; } } @media (max-width: 1199.98px) { .testimonial__nav-seven button.testimonial-button-next { right: -20px; } } .testimonial__nav-eight button { -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; } .testimonial__nav-eight button:hover { background: var(--tg-theme-secondary); } .testimonial__shape-wrap img { position: absolute; z-index: -1; } .testimonial__shape-wrap img:nth-child(1) { left: 0; top: 0; } @media (max-width: 1500px) { .testimonial__shape-wrap img:nth-child(1) { max-width: 230px; } } @media (max-width: 767.98px) { .testimonial__shape-wrap img:nth-child(1) { max-width: 160px; } } .testimonial__shape-wrap img:nth-child(2) { left: 10%; top: 0; } .testimonial__shape-wrap img:nth-child(3) { left: 0; bottom: 0; } @media (max-width: 991.98px) { .testimonial__shape-wrap img:nth-child(3) { max-width: 180px; } } @media (max-width: 767.98px) { .testimonial__shape-wrap img:nth-child(3) { max-width: 140px; } } .testimonial__shape-wrap img:nth-child(4) { right: 0; bottom: 0; } @media (max-width: 1500px) { .testimonial__shape-wrap img:nth-child(4) { max-width: 350px; } } @media (max-width: 991.98px) { .testimonial__shape-wrap img:nth-child(4) { max-width: 250px; } } @media (max-width: 767.98px) { .testimonial__shape-wrap img:nth-child(4) { max-width: 160px; } } .testimonial__shape-wrap img:nth-child(5) { right: 0; bottom: 26%; } @media (max-width: 1500px) { .testimonial__shape-wrap img:nth-child(5) { max-width: 130px; } } @media (max-width: 991.98px) { .testimonial__shape-wrap img:nth-child(5) { max-width: 90px; bottom: 13%; } } @media (max-width: 767.98px) { .testimonial__shape-wrap img:nth-child(5) { max-width: 60px; bottom: 8%; } } .testimonial__shape-wrap img:nth-child(6) { left: 50%; transform: translateX(-50%); bottom: 10%; } .testimonial__shape-wrap-two img { position: absolute; left: 115px; bottom: 0; z-index: -1; } @media (max-width: 767.98px) { .testimonial__shape-wrap-two img { left: 40px; } } .testimonial__shape-two img { position: absolute; z-index: -1; left: 50%; top: 18%; transform: translateX(-50%); } .testimonial__shape-three img { position: absolute; right: 19%; top: 0; z-index: -1; } @media (max-width: 1500px) { .testimonial__shape-three img { right: 8%; } } @media (max-width: 1199.98px) { .testimonial__shape-three img { right: 7%; width: 500px; } } .testimonial-active-four { margin-right: 1px; } .testimonial-active-five { height: 536px; } @media (max-width: 767.98px) { .testimonial-active-five { height: 355px; } } /*============================= 15. Blog ===============================*/ .blog__post-area-three { position: relative; z-index: 1; } .blog__post-area-three::before { content: ""; position: absolute; left: -340px; top: 110px; width: 560px; height: 560px; background: #FF7438; opacity: 0.1; filter: blur(150px); z-index: -1; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } .blog__post-area-four { background: var(--tg-color-gray-2); } .blog__post-area-six { background: var(--tg-color-gray-1); } .blog__post-area-eight { background: var(--tg-color-gray-2); } .blog__post-item { background: var(--tg-color-white-default); -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; overflow: hidden; } .blog__post-item-two { background: var(--tg-color-white-default); border: 1px solid var(--tg-border-6); -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; padding: 25px 30px; } @media (max-width: 767.98px) { .blog__post-item-two { padding: 25px 25px; } } .blog__post-item-three { background: var(--tg-color-white-default); display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; padding: 22px 22px; border: 1px solid var(--tg-border-6); -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; gap: 25px; } @media (max-width: 1199.98px) { .blog__post-item-three { gap: 20px; } } @media (max-width: 767.98px) { .blog__post-item-three { flex-wrap: wrap; } } .blog__post-item-four { background: var(--tg-color-white-default); border: 1px solid var(--tg-border-6); padding: 30px 30px 20px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; } @media (max-width: 1199.98px) { .blog__post-item-four { padding: 20px 20px 15px; } } .blog__post-item-five { margin-bottom: 40px; } .blog__post-thumb { position: relative; -webkit-border-radius: 15px 15px 0 0; -moz-border-radius: 15px 15px 0 0; -o-border-radius: 15px 15px 0 0; -ms-border-radius: 15px 15px 0 0; border-radius: 15px 15px 0 0; overflow: hidden; } .blog__post-thumb img { width: 100%; height: 280px; object-fit: cover; } @media (max-width: 1199.98px) { .blog__post-thumb img { height: auto; } } .blog__post-thumb-two { position: relative; margin-bottom: 15px; } .blog__post-thumb-two img { -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; height: 310px; object-fit: cover; width: 100%; } .blog__post-thumb-three { width: 215px; flex: 0 0 auto; } @media (max-width: 1199.98px) { .blog__post-thumb-three { width: 195px; } } @media (max-width: 991.98px) { .blog__post-thumb-three { width: 215px; } } @media (max-width: 767.98px) { .blog__post-thumb-three { width: 100%; } } .blog__post-thumb-three img { width: 100%; height: 206px; object-fit: cover; -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; } @media (max-width: 767.98px) { .blog__post-thumb-three img { height: 300px; } } .blog__post-thumb-four { margin-bottom: 22px; } .blog__post-thumb-four img { width: 100%; height: 258px; object-fit: cover; -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; } .blog__post-thumb-five { margin-bottom: 30px; } .blog__post-thumb-five img { -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; width: 100%; height: 452px; object-fit: cover; } @media (max-width: 1199.98px) { .blog__post-thumb-five img { height: 360px; } } @media (max-width: 767.98px) { .blog__post-thumb-five img { height: 320px; } } .blog__post-date { position: absolute; right: 0; bottom: 0; z-index: 1; } .blog__post-date span { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 6px; color: var(--tg-color-white-default); line-height: 1; font-weight: 500; padding: 13px 17px 13px 24px; font-size: 16px; } .blog__post-date span svg { width: 20px; height: 20px; } .blog__post-date .shape { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: -1; color: var(--tg-theme-primary); } .blog__post-date .shape svg { width: 100%; height: 100%; } .blog__post-date-two { position: absolute; left: 30px; top: 27px; } .blog__post-date-two span { display: block; background: var(--tg-theme-primary); color: var(--tg-color-white-default); display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 500; -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; padding: 5px 10px; } .blog__post-meta { margin-bottom: 10px; } .blog__post-meta .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 10px 25px; flex-wrap: wrap; } .blog__post-meta .list-wrap li { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 6px; font-size: 16px; font-weight: 400; } .blog__post-meta .list-wrap li svg { color: var(--tg-theme-primary); } .blog__post-meta .list-wrap li a { color: var(--tg-body-color); } .blog__post-meta .list-wrap li a:hover { color: var(--tg-theme-primary); } .blog__post-content { border: 1px solid var(--tg-border-6); -webkit-border-radius: 0 0 15px 15px; -moz-border-radius: 0 0 15px 15px; -o-border-radius: 0 0 15px 15px; -ms-border-radius: 0 0 15px 15px; border-radius: 0 0 15px 15px; padding: 32px 30px; } @media (max-width: 1199.98px) { .blog__post-content { padding: 24px 20px; } } .blog__post-content .title { margin-bottom: 20px; font-size: 22px; font-weight: 600; } .blog__post-content .title a { display: inline; background-image: linear-gradient(var(--tg-heading-color), var(--tg-heading-color)), linear-gradient(var(--tg-heading-color), var(--tg-heading-color)); background-size: 0% 2px, 0 2px; background-position: 100% 100%, 0 100%; background-repeat: no-repeat; transition: background-size 0.4s linear; } .blog__post-content .title a:hover { color: inherit; background-size: 0 2px, 100% 2px; } .blog__post-content-two .title { margin-bottom: 20px; font-size: 22px; font-weight: 600; } .blog__post-content-two .title a { display: inline; background-image: linear-gradient(var(--tg-heading-color), var(--tg-heading-color)), linear-gradient(var(--tg-heading-color), var(--tg-heading-color)); background-size: 0% 2px, 0 2px; background-position: 100% 100%, 0 100%; background-repeat: no-repeat; transition: background-size 0.4s linear; } .blog__post-content-two .title a:hover { color: inherit; background-size: 0 2px, 100% 2px; } .blog__post-content-three .title { margin-bottom: 10px; font-size: 20px; font-weight: 600; } .blog__post-content-three .title a { display: inline; background-image: linear-gradient(var(--tg-heading-color), var(--tg-heading-color)), linear-gradient(var(--tg-heading-color), var(--tg-heading-color)); background-size: 0% 2px, 0 2px; background-position: 100% 100%, 0 100%; background-repeat: no-repeat; transition: background-size 0.4s linear; } .blog__post-content-three .title a:hover { color: inherit; background-size: 0 2px, 100% 2px; } .blog__post-content-three p { margin-bottom: 15px; font-weight: 500; } .blog__post-content-four .blog__post-author { margin-bottom: 20px; } .blog__post-content-four .title { margin-bottom: 18px; font-size: 22px; font-weight: 600; } @media (max-width: 1199.98px) { .blog__post-content-four .title { font-size: 20px; } } .blog__post-content-four .title a { display: inline; background-image: linear-gradient(var(--tg-heading-color), var(--tg-heading-color)), linear-gradient(var(--tg-heading-color), var(--tg-heading-color)); background-size: 0% 2px, 0 2px; background-position: 100% 100%, 0 100%; background-repeat: no-repeat; transition: background-size 0.4s linear; } .blog__post-content-four .title a:hover { color: inherit; background-size: 0 2px, 100% 2px; } .blog__post-content-five .title { margin-bottom: 15px; font-size: 36px; font-weight: 600; text-transform: capitalize; } @media (max-width: 1199.98px) { .blog__post-content-five .title { font-size: 30px; } } @media (max-width: 767.98px) { .blog__post-content-five .title { font-size: 28px; } } .blog__post-content-five .title a { display: inline; background-image: linear-gradient(var(--tg-heading-color), var(--tg-heading-color)), linear-gradient(var(--tg-heading-color), var(--tg-heading-color)); background-size: 0% 2px, 0 2px; background-position: 100% 100%, 0 100%; background-repeat: no-repeat; transition: background-size 0.4s linear; } .blog__post-content-five .title a:hover { color: inherit; background-size: 0 2px, 100% 2px; } .blog__post-content-five p { margin-bottom: 25px; } .blog__post-tag { font-size: 14px; font-weight: 500; display: inline-block; background: var(--tg-color-gray-1); color: var(--tg-theme-primary); -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; -ms-border-radius: 4px; border-radius: 4px; padding: 8px 10px; line-height: 1; margin-bottom: 15px; } .blog__post-tag:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .blog__post-tag-two { font-size: 14px; font-weight: 500; display: block; background: var(--tg-theme-primary); color: var(--tg-color-white-default); position: absolute; left: 16px; top: 18px; line-height: 1; padding: 8px 10px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; -ms-border-radius: 4px; border-radius: 4px; } .blog__post-tag-two:hover { background: var(--tg-theme-secondary); color: var(--tg-color-white-default); } .blog__post-author { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 10px; } .blog__post-author img { width: 36px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } .blog__post-author span { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 5px; font-size: 16px; font-weight: 500; color: var(--tg-color-gray-7); } .blog__post-author span a { color: var(--tg-body-color); } .blog__post-author span a:hover { color: var(--tg-theme-primary); } .blog__details-content .title { margin-bottom: 15px; font-size: 36px; font-weight: 600; text-transform: capitalize; } @media (max-width: 1199.98px) { .blog__details-content .title { font-size: 30px; } } @media (max-width: 767.98px) { .blog__details-content .title { font-size: 28px; } } .blog__details-content > p { margin-bottom: 15px; } .blog__details-content .title-two { margin-bottom: 12px; font-size: 30px; font-weight: 600; text-transform: capitalize; } @media (max-width: 1199.98px) { .blog__details-content .title-two { font-size: 26px; } } .blog__details-inner { margin: 40px 0 55px; } .blog__details-inner .row .col-46 { width: 46%; flex: 0 0 auto; } @media (max-width: 767.98px) { .blog__details-inner .row .col-46 { width: 100%; } } .blog__details-inner .row .col-54 { width: 54%; flex: 0 0 auto; } @media (max-width: 767.98px) { .blog__details-inner .row .col-54 { width: 100%; } } .blog__details-inner-content .title { margin-bottom: 12px; font-weight: 600; text-transform: capitalize; font-size: 30px; } @media (max-width: 1199.98px) { .blog__details-inner-content .title { font-size: 26px; } } .blog__details-inner-content p { margin-bottom: 18px; width: 95%; } @media (max-width: 1199.98px) { .blog__details-inner-content p { width: 100%; } } .blog__details-inner-thumb { position: relative; } @media (max-width: 767.98px) { .blog__details-inner-thumb { margin-bottom: 30px; } } .blog__details-inner-thumb img { width: 100%; height: 287px; object-fit: cover; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; } @media (max-width: 767.98px) { .blog__details-inner-thumb img { height: 250px; } } .blog__details-inner-thumb .play-btn { width: 62px; height: 62px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-color-white-default); color: var(--tg-theme-primary); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .blog__details-inner-thumb .play-btn:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .blog__details-bottom { margin-top: 40px; margin-bottom: 70px; } @media (max-width: 767.98px) { .blog__details-bottom .post-tags { margin-bottom: 30px; } } .blog__details-bottom .post-tags .title { margin-bottom: 20px; font-size: 14px; font-weight: 500; color: var(--tg-body-color); } .blog__details-bottom .post-tags .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; gap: 7px; flex-wrap: wrap; } .blog__details-bottom .post-tags .list-wrap li a { background: var(--tg-color-white-default); padding: 5px 16px; display: block; border-radius: 4px; color: var(--tg-theme-primary); font-size: 14px; font-weight: 500; border: 1px solid var(--tg-color-gray-4); } .blog__details-bottom .post-tags .list-wrap li a:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); border-color: var(--tg-theme-primary); } .blog__details-bottom .post-share .title { margin-bottom: 20px; font-size: 14px; font-weight: 500; color: var(--tg-body-color); } .blog__details-bottom .post-share .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 15px; } .blog__details-bottom .post-share .list-wrap li a { font-size: 16px; color: var(--tg-theme-primary); width: 40px; height: 40px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; background: var(--tg-color-gray-4); } .blog__details-bottom .post-share .list-wrap li a svg { width: 16px; height: 16px; } .blog__details-bottom .post-share .list-wrap li a:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .blog__sidebar { margin-right: 26px; } @media (max-width: 1199.98px) { .blog__sidebar { margin-right: 0; } } @media (max-width: 991.98px) { .blog__sidebar { margin-top: 100px; } } .blog__sidebar-two { margin-left: 26px; margin-right: 0; } @media (max-width: 1199.98px) { .blog__sidebar-two { margin-left: 0; } } .blog__search input { padding: 15px 64px 15px 18px !important; height: 60px; } .blog__search button { width: 50px; height: 50px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-theme-primary) !important; color: var(--tg-color-white-default) !important; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; right: 6px !important; } .blog__search button:hover { background: var(--tg-theme-secondary) !important; } .blog__avatar-wrap { -webkit-border-radius: 12px; -moz-border-radius: 12px; -o-border-radius: 12px; -ms-border-radius: 12px; border-radius: 12px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: flex-start; padding: 42px 40px; background: var(--tg-color-gray-1); gap: 30px; } @media (max-width: 1199.98px) { .blog__avatar-wrap { padding: 35px 25px; } } @media (max-width: 767.98px) { .blog__avatar-wrap { flex-wrap: wrap; gap: 20px; padding: 30px 25px; } } .blog__avatar-img { width: 115px; flex: 0 0 auto; } .blog__avatar-img img { width: 100%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } .blog__avatar-info .designation { display: block; font-size: 15px; font-weight: 500; font-family: var(--tg-heading-font-family); line-height: 1; margin-bottom: 8px; } .blog__avatar-info .name { font-size: 20px; margin-bottom: 12px; color: var(--tg-theme-primary); } .blog__avatar-info p { margin-bottom: 0; } .rc-post-item { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 24px; margin-bottom: 30px; } .rc-post-item:last-child { margin-bottom: 0; } .rc-post-item .thumb { width: 90px; flex: 0 0 auto; } .rc-post-item .thumb img { width: 100%; height: 90px; object-fit: cover; -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; } .rc-post-item .content .date { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; font-size: 14px; font-weight: 500; gap: 7px; line-height: 1; margin-bottom: 14px; } .rc-post-item .content .date svg { color: var(--tg-theme-primary); } .rc-post-item .content .title { margin-bottom: 0; font-size: 18px; font-weight: 500; text-transform: capitalize; } .bs-cat-list .list-wrap li { border-bottom: 1px solid #DEE0EC; padding-bottom: 14px; margin-bottom: 14px; } .bs-cat-list .list-wrap li:last-child { margin-bottom: 0; } .bs-cat-list .list-wrap li a { font-size: 17px; font-weight: 500; color: var(--tg-body-color); display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: space-between; } .bs-cat-list .list-wrap li a span { font-weight: 400; font-size: 16px; } .bs-cat-list .list-wrap li a:hover { color: var(--tg-theme-primary); } .sidebar__tag-list .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 5px; flex-wrap: wrap; } .sidebar__tag-list .list-wrap li a { font-size: 14px; font-weight: 500; color: var(--tg-theme-primary); text-transform: capitalize; background: var(--tg-color-gray-4); display: block; padding: 13px 18px; line-height: 1; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; -ms-border-radius: 4px; border-radius: 4px; } .sidebar__tag-list .list-wrap li a:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } blockquote { margin: 40px 50px; background: var(--tg-color-gray-1); padding: 25px 25px 25px 30px; position: relative; z-index: 1; -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; overflow: hidden; } @media (max-width: 1199.98px) { blockquote { margin: 40px 0; } } blockquote::before { content: ""; position: absolute; left: 0; top: 0; width: 3px; height: 100%; background: var(--tg-theme-primary); } blockquote::after { content: "\f10e"; font-weight: 700; font-size: 42px; color: #DBDEF2; line-height: 1; font-family: var(--tg-icon-font-family); position: absolute; right: 32px; bottom: 26px; z-index: -1; } blockquote > p { margin-bottom: 8px; font-size: 17px; font-weight: 500; color: var(--tg-heading-color); font-style: italic; line-height: 1.6; } blockquote cite { font-style: normal; font-size: 18px; font-weight: 600; color: var(--tg-heading-color); } .comments-wrap-title { font-size: 30px; margin-bottom: 25px; font-weight: 600; text-transform: capitalize; } @media (max-width: 1199.98px) { .comments-wrap-title { font-size: 26px; } } .comments-wrap .latest-comments { margin-bottom: 80px; } .comments-wrap .latest-comments .children { margin: 0 0 0 45px; padding: 0; } @media (max-width: 767.98px) { .comments-wrap .latest-comments .children { margin: 0; } } .comments-box { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: flex-start; border-bottom: 1px solid #D6DCE9; padding-bottom: 30px; margin-bottom: 35px; gap: 25px; } @media (max-width: 767.98px) { .comments-box { flex-wrap: wrap; gap: 20px; } } .comments-avatar { width: 115px; flex: 0 0 auto; } .comments-avatar img { -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } .comments-text .avatar-name { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; } .comments-text .avatar-name .name { margin-bottom: 0; font-size: 20px; font-weight: 600; } .comments-text .avatar-name span { font-weight: 500; font-size: 15px; display: block; color: var(--tg-theme-primary); } .comments-text p { margin-bottom: 15px; } .comments-text .reply-btn { background: var(--tg-color-gray-1); font-weight: 500; font-size: 14px; display: inline-block; padding: 6px 17px; text-transform: uppercase; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; color: var(--tg-theme-primary); } .comments-text .reply-btn:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .comment-respond { -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; padding: 35px 40px 50px; background: var(--tg-color-gray-1); } @media (max-width: 1199.98px) { .comment-respond { padding: 35px 25px 35px; } } .comment-reply-title { margin-bottom: 10px; font-size: 30px; font-weight: 600; text-transform: capitalize; } @media (max-width: 1199.98px) { .comment-reply-title { font-size: 26px; } } @media (max-width: 767.98px) { .comment-reply-title { font-size: 26px; } } .comment-form .comment-notes { margin-bottom: 15px; } .comment-form .form-grp { margin-bottom: 15px; } .comment-form .form-grp textarea, .comment-form .form-grp input { width: 100%; border: 1px solid #E6EEFF; background: var(--tg-color-white-default); font-weight: 400; font-size: 16px; color: var(--tg-heading-color); padding: 12px 15px; height: 50px; display: block; -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; } .comment-form .form-grp textarea::placeholder, .comment-form .form-grp input::placeholder { font-weight: 400; font-size: 15px; color: var(--tg-border-1); } .comment-form .form-grp textarea { min-height: 130px; max-height: 130px; } .comment-form .checkbox-grp { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; margin: 25px 0; } .comment-form .checkbox-grp input { width: 22px; margin-right: 9px; height: 22px; cursor: pointer; } .comment-form .checkbox-grp label { font-weight: 400; font-size: 14px; color: var(--tg-body-color); user-select: none; } /*============================= 16. Call-Back ===============================*/ .call__back-area { background: var(--tg-theme-secondary); position: relative; z-index: 1; } .call__back-wrap { padding: 0 80px; } @media (max-width: 1199.98px) { .call__back-wrap { padding: 0 0; } } .call__back-wrap-two { background: var(--tg-theme-primary); -webkit-border-radius: 30px; -moz-border-radius: 30px; -o-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; position: relative; z-index: 1; overflow: hidden; padding: 70px 70px; box-shadow: 0px 16px 50px 0px rgba(0, 0, 0, 0.2); } @media (max-width: 1199.98px) { .call__back-wrap-two { padding: 50px 50px; } } @media (max-width: 767.98px) { .call__back-wrap-two { padding: 30px 30px; } } @media (max-width: 991.98px) { .call__back-img { text-align: center; margin-bottom: 50px; } } .call__back-img img { -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; } .call__back-content p { color: var(--tg-color-gray-4); margin-bottom: 20px; } .call__back-content-two { width: 80%; } @media (max-width: 1199.98px) { .call__back-content-two { width: 100%; } } @media (max-width: 991.98px) { .call__back-content-two { margin-bottom: 50px; } } .call__back-content-two .section__title .title { font-size: 40px; } @media (max-width: 1199.98px) { .call__back-content-two .section__title .title { font-size: 36px; } } @media (max-width: 767.98px) { .call__back-content-two .section__title .title { font-size: 30px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .call__back-content-two .section__title .title { font-size: 34px; } } .call__back-content-two p { color: var(--tg-color-white-default); margin-bottom: 25px; } .call__back-form .form-grp { margin-bottom: 10px; } .call__back-form .form-grp textarea, .call__back-form .form-grp input { border: none; } .call__back-form button { width: 100%; border: none; font-size: 18px; font-weight: 600; background: var(--tg-theme-primary); color: var(--tg-color-white-default); -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; padding: 12px 20px; } .call__back-form button:hover { background: var(--tg-color-sky-blue); } .call__back-form-two .row { --bs-gutter-x: 10px; } .call__back-form-two .form-grp { margin-bottom: 10px; } .call__back-form-two .form-grp textarea, .call__back-form-two .form-grp input { background: #1B5AFF; color: var(--tg-color-white-default); font-size: 14px; border: none; } .call__back-form-two .form-grp textarea::placeholder, .call__back-form-two .form-grp input::placeholder { color: var(--tg-color-white-default); font-size: 14px; } .call__back-form-two button { width: 100%; border: none; font-size: 16px; font-weight: 600; background: var(--tg-color-white-default); color: var(--tg-theme-secondary); -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; padding: 16px 20px; text-transform: uppercase; } .call__back-form-two button:hover { background: var(--tg-theme-secondary); color: var(--tg-color-white-default); } .call__back-shape img { position: absolute; z-index: -1; } .call__back-shape img:nth-child(1) { left: 0; top: 0; } @media (max-width: 1500px) { .call__back-shape img:nth-child(1) { max-width: 500px; } } .call__back-shape img:nth-child(2) { left: 11%; bottom: 0; } .call__back-shape img:nth-child(3) { left: 20%; bottom: 11%; } @media (max-width: 1500px) { .call__back-shape img:nth-child(3) { left: 8%; } } @media (max-width: 767.98px) { .call__back-shape img:nth-child(3) { display: none; } } .call__back-shape img:nth-child(4) { right: 11%; top: 18%; } @media (max-width: 1500px) { .call__back-shape img:nth-child(4) { right: 3%; } } @media (max-width: 1199.98px) { .call__back-shape img:nth-child(4) { right: 3%; top: 7%; } } .call__back-shape img:nth-child(5) { right: 0; bottom: 0; mix-blend-mode: luminosity; opacity: 0.5; } @media (max-width: 1500px) { .call__back-shape img:nth-child(5) { max-width: 200px; } } .call__back-shape-two img { position: absolute; z-index: -1; } .call__back-shape-two img:nth-child(1) { left: 0; bottom: 0; mix-blend-mode: luminosity; } .call__back-shape-two img:nth-child(2) { left: 0; top: 50%; transform: translateY(-50%); } .call__back-shape-two img:nth-child(3) { right: 0; top: 0; } /*============================= 18. Marquee ===============================*/ .marquee__area-two { position: relative; z-index: 1; margin: 73px 0; } @media (max-width: 1500px) { .marquee__area-two { margin: 55px 0; } } @media (max-width: 991.98px) { .marquee__area-two { margin: 33px 0; } } .marquee-wrap-two { background: var(--tg-theme-primary); padding: 17px 0 8px; transform: rotate(-4.333deg); position: relative; left: -5px; right: -5px; width: 105%; } .marquee-wrap-three { background: var(--tg-theme-secondary); padding: 17px 0 8px; transform: rotate(3.864deg); position: absolute; z-index: 1; left: -5px; right: -5px; top: 0; } @media (max-width: 1199.98px) { .marquee-wrap-three { padding: 12px 0 4px; } } .marquee-wrap-four { transform: rotate(0); } .marquee__item { margin-right: 20px; display: inline; line-height: 1; } .marquee__item a { font-size: 60px; font-weight: 800; letter-spacing: 5px; text-transform: uppercase; color: transparent; -webkit-text-stroke: 1.5px var(--tg-body-color); display: inline-flex; align-items: center; } @media (max-width: 1199.98px) { .marquee__item a { font-size: 50px; } } @media (max-width: 991.98px) { .marquee__item a { font-size: 45px; } } @media (max-width: 767.98px) { .marquee__item a { font-size: 40px; } } .marquee__item a svg { margin-right: 20px; color: var(--tg-theme-primary); } .marquee__item-two a { font-size: 32px; font-weight: 700; color: var(--tg-color-white-default); -webkit-text-stroke: unset; letter-spacing: 3.2px; line-height: 1; } @media (max-width: 1199.98px) { .marquee__item-two a { font-size: 24px; } } .marquee__item-two a svg { color: var(--tg-color-white-default); width: 36px; height: 36px; } /*============================= 19. Choose ===============================*/ .choose__area { position: relative; z-index: 1; } .choose__area::before { content: ""; position: absolute; left: -234px; bottom: -100px; width: 420px; height: 420px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; background: #38CFFF; filter: blur(150px); opacity: 0.1; z-index: -1; } .choose__area-two { position: relative; z-index: 1; } .choose__area-four { background: var(--tg-theme-secondary); position: relative; z-index: 1; } .choose__area-five { background: var(--tg-color-gray-1); } .choose__bg { background-size: cover; background-position: center; } .choose__img-wrap { position: relative; text-align: center; } @media (max-width: 991.98px) { .choose__img-wrap { margin-bottom: 50px; } } .choose__img-wrap img:nth-child(2) { left: 0; bottom: 0; position: absolute; } @media (max-width: 767.98px) { .choose__img-wrap img:nth-child(2) { max-width: 200px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .choose__img-wrap img:nth-child(2) { max-width: 240px; } } .choose__img-wrap img.shape-one { position: absolute; left: 6%; bottom: 44%; -webkit-animation-duration: 15s; animation-duration: 15s; } .choose__img-wrap img.shape-two { position: absolute; right: 33%; top: 3%; -webkit-animation-duration: 15s; animation-duration: 15s; } .choose__img-wrap img.shape-three { position: absolute; z-index: -1; right: 0; bottom: -19px; } .choose__img-wrap-two { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; justify-content: space-between; } @media (max-width: 991.98px) { .choose__img-wrap-two { margin-bottom: 50px; } } @media (max-width: 767.98px) { .choose__img-wrap-two { flex-wrap: wrap; gap: 30px; } } .choose__img-wrap-two .circle__wrap { margin: 75px 0 0; } @media (max-width: 767.98px) { .choose__img-wrap-two .circle__wrap { margin: 0 auto; } } .choose__img-wrap-two .mask__img { -webkit-mask-image: url(../img/images/h5_choose_mask_img.svg); mask-image: url(../img/images/h5_choose_mask_img.svg); -webkit-mask-size: 100%; mask-size: 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; width: 484px; height: 474px; } @media (max-width: 1199.98px) { .choose__img-wrap-two .mask__img { width: 330px; height: 325px; } } @media (max-width: 991.98px) { .choose__img-wrap-two .mask__img { width: 484px; height: 474px; } } @media (max-width: 767.98px) { .choose__img-wrap-two .mask__img { width: 330px; height: 325px; margin: 0 auto; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .choose__img-wrap-two .mask__img { width: 400px; height: 395px; } } .choose__img-wrap-two .mask__img img { width: 100%; height: 100%; object-fit: cover; } .choose__img-wrap-three { position: relative; text-align: right; z-index: 1; margin-left: 25px; } @media (max-width: 1199.98px) { .choose__img-wrap-three { margin-left: 0; padding-left: 50px; } } @media (max-width: 991.98px) { .choose__img-wrap-three { margin-bottom: 50px; } } @media (max-width: 767.98px) { .choose__img-wrap-three { padding-left: 0; text-align: center; } } .choose__img-wrap-three > img:nth-child(1) { border-radius: 24px; border: 10px solid var(--tg-color-white-default); } .choose__img-wrap-three > img:nth-child(2) { border-radius: 24px; border: 8px solid var(--tg-color-white-default); position: absolute; bottom: 40px; left: 0; } @media (max-width: 767.98px) { .choose__img-wrap-three > img:nth-child(2) { display: none; } } .choose__img-wrap-three .shape img { position: absolute; left: -16%; bottom: -2%; z-index: -1; } @media (max-width: 767.98px) { .choose__img-wrap-three .shape img { display: none; } } .choose__img-wrap-four { position: relative; z-index: 1; padding-left: 105px; } @media (max-width: 1199.98px) { .choose__img-wrap-four { padding-left: 30px; } } @media (max-width: 991.98px) { .choose__img-wrap-four { margin-bottom: 50px; } } @media (max-width: 767.98px) { .choose__img-wrap-four { padding-left: 0; } } .choose__img-wrap-four > img { -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; width: 100%; } .choose__img-wrap-four > img.shape { position: absolute; right: 0; top: 0; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; -ms-border-radius: 20px; border-radius: 20px; width: 100%; } .choose__img-wrap-four .circle__wrap { position: absolute; left: 28px; top: -23px; margin: 0; } @media (max-width: 1199.98px) { .choose__img-wrap-four .circle__wrap { left: -10px; top: -45px; } } @media (max-width: 767.98px) { .choose__img-wrap-four .circle__wrap { display: none; } } .choose__img-two { position: relative; } @media (max-width: 991.98px) { .choose__img-two { margin-bottom: 50px; } } .choose__img-two img { -webkit-border-radius: 30px; -moz-border-radius: 30px; -o-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; width: 100%; } .choose__img-two .play-btn { width: 80px; height: 80px; background: var(--tg-color-white-default); color: var(--tg-theme-primary); display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .choose__img-two .play-btn:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .choose__content { margin-right: 85px; } @media (max-width: 1199.98px) { .choose__content { margin-right: 0; } } .choose__content p { margin-bottom: 25px; } .choose__content .about__list-item-two { margin-bottom: 35px; } .choose__content-two > p { margin-bottom: 30px; } .choose__content-three .about__list-item-two { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex-wrap: wrap; gap: 18px 0; margin-bottom: 35px; } .choose__content-three .about__list-item-two li { width: 50%; flex: 0 0 auto; margin-bottom: 0; color: var(--tg-color-white-default); } @media (max-width: 767.98px) { .choose__content-three .about__list-item-two li { width: 100%; } } .choose__content-three p { margin-bottom: 30px; color: var(--tg-color-gray-4); width: 85%; } @media (max-width: 1199.98px) { .choose__content-three p { width: 100%; } } .choose__content-four { margin-left: 30px; width: 90%; } @media (max-width: 1199.98px) { .choose__content-four { margin-left: 0; width: 100%; } } .choose__content-four > p { margin-bottom: 25px; color: #E9EBF8; width: 90%; } @media (max-width: 1199.98px) { .choose__content-four > p { width: 100%; } } .choose__content-five p { margin-bottom: 35px; width: 95%; } @media (max-width: 1199.98px) { .choose__content-five p { width: 100%; } } .choose__content-five .about__list-item li { margin-bottom: 24px; } .choose__shape img { position: absolute; z-index: -1; } .choose__shape img:nth-child(1) { right: 0; top: 0; max-width: 277px; } @media (max-width: 1500px) { .choose__shape img:nth-child(1) { max-width: 220px; } } @media (max-width: 1199.98px) { .choose__shape img:nth-child(1) { max-width: 180px; } } @media (max-width: 767.98px) { .choose__shape img:nth-child(1) { max-width: 150px; } } .choose__shape img:nth-child(2) { left: 0; bottom: 0; max-width: 233px; } @media (max-width: 1500px) { .choose__shape img:nth-child(2) { max-width: 200px; } } @media (max-width: 1199.98px) { .choose__shape img:nth-child(2) { max-width: 160px; } } @media (max-width: 767.98px) { .choose__shape img:nth-child(2) { max-width: 130px; } } .profit__wrap-three { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; text-align: left; background: var(--tg-color-white-default); position: absolute; left: 0; top: 23%; gap: 10px; padding: 20px 25px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; } @media (max-width: 767.98px) { .profit__wrap-three { display: none; } } .profit__wrap-three .content .count { margin-bottom: 5px; font-size: 30px; line-height: 1; } .profit__wrap-three .content > p { margin-bottom: 0; font-size: 14px; color: #293736; text-transform: capitalize; font-weight: 600; line-height: 1; } .chart__wrap { background: var(--tg-color-white-default); display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 20px; position: absolute; left: 115px; bottom: 10px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; padding: 25px 28px; } @media (max-width: 1199.98px) { .chart__wrap { left: 40px; } } @media (max-width: 767.98px) { .chart__wrap { left: 10px; } } .chart__wrap .content span { display: block; text-transform: capitalize; font-weight: 500; font-size: 17px; line-height: 1; margin-bottom: 10px; } .chart__wrap .content .count { margin-bottom: 0; font-size: 36px; line-height: 1; } /*============================= 20. Core Value ===============================*/ .core__value-bg { background-size: cover; background-position: center; position: relative; z-index: 1; } .core__value-img { position: relative; margin-right: 90px; } @media (max-width: 1199.98px) { .core__value-img { margin-right: 0; } } @media (max-width: 991.98px) { .core__value-img { margin-bottom: 50px; } } .core__value-img img:nth-child(2) { position: absolute; right: 0; bottom: 0; -webkit-border-radius: 7px; -moz-border-radius: 7px; -o-border-radius: 7px; -ms-border-radius: 7px; border-radius: 7px; border: 8px solid var(--tg-color-white-default); width: 273px; height: 163px; object-fit: cover; } @media (max-width: 1199.98px) { .core__value-img img:nth-child(2) { width: 205px; height: 122px; } } @media (max-width: 991.98px) { .core__value-img img:nth-child(2) { width: 260px; height: 156px; } } @media (max-width: 767.98px) { .core__value-img img:nth-child(2) { display: none; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .core__value-img img:nth-child(2) { display: block; width: 232px; height: 140px; } } .core__value-img img.shape { position: absolute; top: 8%; left: 6%; } @media (max-width: 1199.98px) { .core__value-img img.shape { top: 2%; left: 2%; } } @media (max-width: 767.98px) { .core__value-img img.shape { display: none; } } .core__value-content { margin-left: -40px; } @media (max-width: 1199.98px) { .core__value-content { margin-left: 0; } } .core__value-content > p { margin-bottom: 50px; color: var(--tg-color-white-default); } .core__value-shape img { position: absolute; right: 13%; top: 13%; z-index: -1; } @media (max-width: 1500px) { .core__value-shape img { right: 5%; top: 6%; } } @media (max-width: 767.98px) { .core__value-shape img { right: 7%; top: 34%; max-width: 80px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .core__value-shape img { top: 3%; } } /*============================= 21. Work ===============================*/ .work__item { text-align: center; } .work__item-wrap { position: relative; z-index: 1; } .work__item-wrap .line__shape { position: absolute; left: 0; top: 93px; right: 0; } @media (max-width: 991.98px) { .work__item-wrap .line__shape { display: none; } } .work__item-wrap .line__shape img { width: 100%; } .work__item-wrap-two { position: relative; z-index: 1; } .work__item .step { display: inline-block; color: var(--tg-theme-primary); background: var(--tg-color-gray-1); -webkit-border-radius: 100px; -moz-border-radius: 100px; -o-border-radius: 100px; -ms-border-radius: 100px; border-radius: 100px; padding: 10px 17px; line-height: 1; position: relative; text-transform: capitalize; transition: 0.3s linear; margin-bottom: 50px; } @media (max-width: 991.98px) { .work__item .step { margin-bottom: 30px; } } .work__item .step::before { content: ""; position: absolute; left: 50%; transform: translateX(-50%); bottom: -30px; width: 16px; height: 16px; background: var(--tg-color-gray-1); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; border: 2.5px solid var(--tg-color-white-default); -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } @media (max-width: 991.98px) { .work__item .step::before { display: none; } } .work__item:hover .step { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .work__item:hover .step::before { background: var(--tg-theme-primary); } .work__item:hover .work__icon { color: var(--tg-theme-primary); } .work__item-two:hover .work__icon-two { transform: translateY(5px); } .work__item-two:hover .work__step { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .work__icon { font-size: 50px; color: var(--tg-border-1); -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; margin-bottom: 25px; } .work__icon-two { width: 120px; height: 120px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; margin: 0 auto 30px; background: var(--tg-color-gray-4); -webkit-border-radius: 40px; -moz-border-radius: 40px; -o-border-radius: 40px; -ms-border-radius: 40px; border-radius: 40px; font-size: 60px; color: var(--tg-theme-primary); -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .work__content .title { margin-bottom: 12px; font-size: 24px; font-weight: 600; } .work__content p { width: 85%; margin: 0 auto; } @media (max-width: 1199.98px) { .work__content p { width: 100%; } } .work__content-two .title { margin-bottom: 10px; font-size: 24px; font-weight: 600; text-transform: capitalize; } .work__content-two p { width: 85%; margin: 0 auto; } @media (max-width: 1199.98px) { .work__content-two p { width: 100%; } } .work__step { display: inline-block; font-size: 14px; font-weight: 500; color: var(--tg-theme-primary); background: var(--tg-color-gray-1); line-height: 1; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; padding: 8px 12px; margin-bottom: 20px; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .work__line-shape svg { position: absolute; left: 50%; transform: translateX(-50%); top: 50px; color: #BDC1DB; z-index: -1; } @media (max-width: 1199.98px) { .work__line-shape svg { width: 900px; } } @media (max-width: 991.98px) { .work__line-shape svg { display: none; } } @-webkit-keyframes dash_animation { to { stroke-dashoffset: 0; } } @keyframes dash_animation { to { stroke-dashoffset: 0; } } .has-animation.active-animation .work__line-shape .dashed1 { stroke-dashoffset: 1150; stroke-dasharray: 1150; -webkit-animation: dash_animation 3s linear forwards; animation: dash_animation 3s linear forwards; } /*============================= 22. Shop ===============================*/ .shop__sidebar { border: 1px solid var(--tg-border-14); padding: 30px 30px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; margin-right: 32px; } @media (max-width: 1199.98px) { .shop__sidebar { margin-right: 0; } } @media (max-width: 991.98px) { .shop__sidebar { margin-top: 100px; } } .shop__search { position: relative; } .shop__search input { border-color: var(--tg-border-14); padding: 11px 40px 11px 18px; } .shop__search button { border: none; background: none; position: absolute; right: 16px; top: 50%; transform: translateY(-50%); padding: 0; color: var(--tg-border-1); } .shop__search button:hover { color: var(--tg-theme-primary); } .shop__cat-list .list-wrap li { margin-bottom: 15px; } .shop__cat-list .list-wrap li:last-child { margin-bottom: 0; } .shop__cat-list .form-check { display: flex; align-items: center; line-height: 1; margin-bottom: 0; padding: 0; min-height: inherit; } .shop__cat-list .form-check-input { border-radius: 4px; border: 1px solid #9D9CAE; margin: 0 10px 0 0; width: 18px; height: 18px; padding: 0; } .shop__cat-list .form-check-input:checked { background-color: var(--tg-theme-primary); } .shop__cat-list .form-check-input:focus { box-shadow: none; border-color: var(--tg-theme-primary); } .shop__cat-list .form-check-label { flex-grow: 1; font-size: 15px; font-weight: 400; color: var(--tg-body-color); user-select: none; text-transform: capitalize; } .shop__cat-list .form-check .rating { display: flex; align-items: center; } .shop__cat-list .form-check .rating ul { display: flex; align-items: center; line-height: 1; color: var(--tg-color-yellow-light-2); gap: 4px; } .shop__cat-list .form-check .rating ul li { margin-bottom: 0; } .shop__cat-list .form-check .rating ul li.delete { color: #B5B5B5; } .shop__cat-list .form-check .rating span { color: #B2B8C4; margin-left: 5px; font-size: 14px; } .shop__top-wrap { background: var(--tg-color-gray-1); -webkit-border-radius: 8px; -moz-border-radius: 8px; -o-border-radius: 8px; -ms-border-radius: 8px; border-radius: 8px; padding: 10px 25px; margin-bottom: 25px; } @media (max-width: 767.98px) { .shop__top-left { text-align: center; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .shop__top-left { text-align: left; } } .shop__top-left p { margin-bottom: 0; font-size: 14px; } .shop__top-right { width: 150px; margin-left: auto; position: relative; } @media (max-width: 767.98px) { .shop__top-right { margin: 0 auto; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .shop__top-right { margin-left: auto; } } .shop__top-right select { background-color: transparent; border: none; color: var(--tg-body-color); font-weight: 400; font-size: 14px; text-transform: capitalize; border-radius: 4px; outline: none; padding: 5px 20px 5px 20px; -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 100%; line-height: 1.2; height: 40px; cursor: pointer; } .shop__top-right::after { content: "\f078"; position: absolute; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); font-family: "Font Awesome 5 Free"; font-weight: 700; right: 0; font-size: 14px; color: #596580; } .shop__price-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: flex-end; gap: 15px; } .shop__price-wrap .max-price span, .shop__price-wrap .min-price span { color: #A5ABB7; font-size: 14px; font-weight: 500; text-transform: capitalize; line-height: 1; display: block; margin-bottom: 8px; } .shop__price-wrap .max-price input, .shop__price-wrap .min-price input { background: var(--tg-color-gray-1); border: none; font-size: 14px; font-weight: 500; color: var(--tg-body-color); padding: 8px 10px; height: 40px; } .shop__price-wrap .divider { display: block; font-size: 14px; font-weight: 500; line-height: 1; color: var(--tg-border-1); transform: translateY(-12px); } .shop__price-btn { width: 100%; padding: 14px 25px; justify-content: center; margin-top: 25px; } .shop__item { background: var(--tg-color-white-default); border: 1px solid var(--tg-border-14); -webkit-border-radius: 12px; -moz-border-radius: 12px; -o-border-radius: 12px; -ms-border-radius: 12px; border-radius: 12px; overflow: hidden; height: 100%; } .shop__item:hover .shop__action li { opacity: 1; visibility: visible; transform: translateY(0); } .shop__item:hover .shop__thumb img { transform: scale(1.05); } .shop__thumb { position: relative; z-index: 1; overflow: hidden; } .shop__thumb img { transition: all 0.3s ease-in-out; width: 100%; } .shop__action { position: absolute; right: 17px; top: 19px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; flex-direction: column; gap: 8px; } .shop__action li { transition: visibility 0.3s ease-out 0.1s, opacity 0.3s ease-out 0.15s, transform 0.3s ease-out 0.1s; } .shop__action li:not(:first-child) { opacity: 0; visibility: hidden; transform: translateY(20px); } .shop__action li:nth-child(2) { transition-delay: 0.15s; } .shop__action li:nth-child(3) { transition-delay: 0.2s; } .shop__action li:nth-child(4) { transition-delay: 0.25s; } .shop__action li a { width: 30px; height: 30px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-color-gray-1); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; color: var(--tg-border-1); font-size: 15px; } .shop__action li a:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .shop__content { padding: 20px 24px 22px; } .shop__content .tag { display: block; font-size: 14px; color: #A5A5AC; text-transform: uppercase; line-height: 1; font-weight: 500; margin-bottom: 8px; } .shop__content .tag:hover { color: var(--tg-theme-primary); } .shop__content .title { font-size: 16px; font-weight: 500; text-transform: capitalize; margin-bottom: 8px; } .shop__content .rating { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; line-height: 1; font-size: 13px; gap: 3px; color: var(--tg-color-yellow-light-2); margin-bottom: 12px; } .shop__content .rating .avg { color: var(--tg-border-1); font-weight: 500; margin-left: 2px; } .shop__content .price { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 5px; margin-bottom: 0; font-size: 18px; font-weight: 600; color: var(--tg-theme-primary); } .shop__content .price del { font-size: 14px; font-weight: 500; color: #A5A5AC; } .shop__details-images-wrap { margin-right: 30px; } @media (max-width: 1199.98px) { .shop__details-images-wrap { margin-right: 0; } } @media (max-width: 991.98px) { .shop__details-images-wrap { margin-bottom: 50px; } } .shop__details-images-wrap .nav-tabs { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; border-bottom: none; gap: 30px; margin-top: 30px; } @media (max-width: 1199.98px) { .shop__details-images-wrap .nav-tabs { gap: 15px; } } .shop__details-images-wrap .nav-item { width: 120px; flex: 0 0 auto; } @media (max-width: 1199.98px) { .shop__details-images-wrap .nav-item { width: 100px; } } @media (max-width: 767.98px) { .shop__details-images-wrap .nav-item { width: 80px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .shop__details-images-wrap .nav-item { width: 100px; } } .shop__details-images-wrap .nav-link { margin-bottom: 0; padding: 0; border: 1px solid var(--tg-border-14); -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; overflow: hidden; box-shadow: none; } .shop__details-images-wrap .nav-link img { opacity: 0.5; } .shop__details-images-wrap .nav-link.active { border: 1px solid #FBCE99; } .shop__details-images-wrap .nav-link.active img { opacity: 1; } .shop__details-images-wrap .tab-content .tab-pane { position: relative; } .shop__details-images-wrap .tab-content .tab-pane img { border-radius: 15px; border: 1px solid var(--tg-border-14); } .shop__details-images-wrap .tab-content .tab-pane .expand-img { position: absolute; right: 24px; top: 22px; width: 45px; height: 45px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; border: 1px solid var(--tg-border-1); color: #8D95A8; } .shop__details-images-wrap .tab-content .tab-pane .expand-img svg { -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .shop__details-images-wrap .tab-content .tab-pane .expand-img:hover svg { transform: scale(1.08); } .shop__details-content > .title { margin-bottom: 20px; font-size: 30px; font-weight: 600; text-transform: capitalize; } @media (max-width: 1199.98px) { .shop__details-content > .title { font-size: 26px; } } @media (max-width: 767.98px) { .shop__details-content > .title { font-size: 24px; } } .shop__details-content .price { margin-bottom: 0; font-size: 24px; font-weight: 600; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 6px; color: var(--tg-theme-primary); margin-bottom: 20px; } .shop__details-content .price del { font-size: 16px; font-weight: 400; color: var(--tg-body-color); } .shop__details-content-inner { border-top: 1px solid #E6E8EC; padding-top: 17px; border-bottom: 1px solid #E6E8EC; padding-bottom: 22px; margin-bottom: 15px; } .shop__details-content-inner p { margin-bottom: 12px; } .shop__details-content-inner .list-wrap li { font-size: 15px; color: var(--tg-heading-color); position: relative; padding-left: 15px; } .shop__details-content-inner .list-wrap li::after { content: ""; width: 5px; height: 5px; background: var(--tg-heading-color); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } .shop__details-color { margin-bottom: 40px; } .shop__details-color .title { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; color: #394767; gap: 5px; font-size: 15px; font-weight: 500; margin-bottom: 5px; } .shop__details-color .title strong { font-weight: 400; color: var(--tg-heading-color); } .shop__details-color .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 4px; } .shop__details-color .list-wrap li { width: 24px; height: 24px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; background: var(--tg-color-white-default); border: 2px solid #D9D9D9; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; position: relative; cursor: pointer; } .shop__details-color .list-wrap li::before { content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background: #E4E4E4; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; width: 16px; height: 16px; } .shop__details-color .list-wrap li:nth-child(2)::before { background: #4E4E4E; } .shop__details-color .list-wrap li:nth-child(3)::before { background: #7A9FB1; } .shop__details-color .list-wrap li:nth-child(4)::before { background: #CBC9DF; } .shop__details-review-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 10px 20px; font-size: 15px; font-weight: 500; color: #394767; margin-bottom: 22px; flex-wrap: wrap; } .shop__details-review-wrap .product-review { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 8px; } .shop__details-review-wrap .product-review .rating { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; font-size: 14px; color: var(--tg-color-yellow-light); gap: 4px; } .shop__details-review-wrap .product-review span { font-size: 15px; color: #4A4C53; font-weight: 400; } .shop__details-review-wrap li { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 5px; position: relative; } .shop__details-review-wrap li::before { content: ""; position: absolute; right: -10px; top: 50%; transform: translateY(-50%); width: 1px; height: 11px; background: #4A4C53; } .shop__details-review-wrap li:last-child::before { display: none; } .shop__details-review-wrap li.product-sku span { font-weight: 400; color: var(--tg-heading-color); } .shop__details-review-wrap li.product-availability span { color: #27AE60; } .shop__details-qty { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 17px; margin-bottom: 25px; } .shop__details-qty .cart-btn { font-size: 16px; text-transform: uppercase; font-weight: 600; padding: 13px 25px; width: 60%; justify-content: center; } .shop__details-qty .cart-btn svg { width: 24px; height: 24px; } .shop__details-qty .cart-btn:hover svg path:nth-of-type(1) { transform: translateX(0); opacity: 1; } .shop__details-wishlist-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 10px; margin-bottom: 26px; } .shop__details-wishlist-wrap a { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 5px; font-size: 15px; font-weight: 500; border: 1px solid #E6E8EC; -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; padding: 16px 20px; line-height: 1; color: var(--tg-body-color); } .shop__details-wishlist-wrap a:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); border-color: var(--tg-theme-primary); } .shop__details-bottom .list-wrap .sd-social, .shop__details-bottom .list-wrap .sd-tag, .shop__details-bottom .list-wrap .sd-category { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 5px; margin-bottom: 7px; } .shop__details-bottom .list-wrap .sd-social:last-child, .shop__details-bottom .list-wrap .sd-tag:last-child, .shop__details-bottom .list-wrap .sd-category:last-child { margin-bottom: 0; } .shop__details-bottom .list-wrap .sd-social .title, .shop__details-bottom .list-wrap .sd-tag .title, .shop__details-bottom .list-wrap .sd-category .title { font-size: 16px; font-weight: 500; color: var(--tg-body-color); } .shop__details-bottom .list-wrap .sd-social > a, .shop__details-bottom .list-wrap .sd-tag > a, .shop__details-bottom .list-wrap .sd-category > a { color: #596580; } .shop__details-bottom .list-wrap .sd-social > a:hover, .shop__details-bottom .list-wrap .sd-tag > a:hover, .shop__details-bottom .list-wrap .sd-category > a:hover { color: var(--tg-theme-primary); } .shop__details-bottom .list-wrap .sd-social .list-wrap, .shop__details-bottom .list-wrap .sd-tag .list-wrap, .shop__details-bottom .list-wrap .sd-category .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 5px; } .shop__details-bottom .list-wrap .sd-social .list-wrap li a, .shop__details-bottom .list-wrap .sd-tag .list-wrap li a, .shop__details-bottom .list-wrap .sd-category .list-wrap li a { width: 40px; height: 40px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; border: 1px solid #E6E8EC; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; font-size: 16px; justify-content: center; color: var(--tg-heading-color); } .shop__details-bottom .list-wrap .sd-social .list-wrap li a svg, .shop__details-bottom .list-wrap .sd-tag .list-wrap li a svg, .shop__details-bottom .list-wrap .sd-category .list-wrap li a svg { width: 16px; height: 16px; } .shop__details-bottom .list-wrap .sd-social .list-wrap li a:hover, .shop__details-bottom .list-wrap .sd-tag .list-wrap li a:hover, .shop__details-bottom .list-wrap .sd-category .list-wrap li a:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); border: var(--tg-theme-primary); } .product-desc-wrap { margin-top: 100px; } .product-desc-wrap .tab-content p { margin-bottom: 0; } .product-desc-wrap .nav-tabs { border-bottom: 2px solid #E6E8EC; gap: 30px; margin-bottom: 25px; } .product-desc-wrap .nav-tabs .nav-link { margin-bottom: 0; background: transparent; border: none; border-radius: 0; padding: 0 5px 10px; font-weight: 500; font-size: 22px; color: var(--tg-border-1); position: relative; } .product-desc-wrap .nav-tabs .nav-link.active { color: var(--tg-heading-color); font-weight: 600; } .product-desc-wrap .nav-tabs .nav-link.active::before { opacity: 1; } .product-desc-wrap .nav-tabs .nav-link::before { content: ""; position: absolute; left: 0; bottom: -3px; width: 100%; height: 5px; background: var(--tg-theme-primary); transition: 0.3s linear; opacity: 0; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; } .product-desc-description > p { margin-bottom: 25px !important; } .product-desc-description > p:last-child { margin-bottom: 0 !important; } .product-desc-description .title { margin-bottom: 16px; font-size: 20px; font-weight: 600; } .product-desc-review { padding: 25px 30px; border: 1px solid #E6E8EC; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; } .product-desc-review .left-rc { margin-bottom: 10px; } .show-more { margin-top: 15px; } .show-more a { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 10px; color: #394767; font-size: 14px; font-weight: 500; text-transform: capitalize; } .show-more a svg { color: #B2B8C4; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } .show-more a:hover { color: var(--tg-theme-primary); } .show-more a:hover svg { color: var(--tg-theme-primary); } .flash-sale { font-size: 12px; font-weight: 600; background: var(--tg-color-red-light); display: block; color: var(--tg-color-white-default); -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; -ms-border-radius: 4px; border-radius: 4px; padding: 5px 8px; position: absolute; left: 30px; top: 24px; line-height: 1; } .flash-sale.new { background: #1ABC00; } .pagination__wrap ul { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px 10px; } .pagination__wrap ul li a { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; background: #F5F5F5; -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; font-size: 20px; color: var(--tg-heading-color); } .pagination__wrap ul li a:hover { color: var(--tg-color-white-default); background: var(--tg-body-color); } .pagination__wrap ul li.active a { color: var(--tg-color-white-default); background: var(--tg-body-color); } .cart-plus-minus { position: relative; width: 130px; flex: 0 0 auto; } .cart-plus-minus input { width: 100%; border: 1px solid #D7D7D7; border-radius: 5px; height: 50px; text-align: center; padding: 0 30px; font-weight: 500; font-size: 16px; color: var(--tg-heading-color); } .cart-plus-minus .qtybutton { position: absolute; top: 0; left: 0; width: 31px; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 600; color: #838383; cursor: pointer; border-right: 1px solid #D7D7D7; user-select: none; -moz-user-select: none; line-height: 0; } .cart-plus-minus .qtybutton.inc { left: auto; right: 0; border-right: none; border-left: 1px solid #D7D7D7; } .cart-plus-minus .qtybutton.dec { font-size: 26px; } .related__product-area { background: var(--tg-color-gray-1); padding: 90px 0; } .related__product-title .title { margin-bottom: 30px; font-size: 30px; font-weight: 600; position: relative; padding-bottom: 20px; } .related__product-title .title::before { content: ""; position: absolute; left: 0; bottom: 0; width: 40px; height: 5px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; background: var(--tg-theme-primary); } .related__product-nav { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: flex-end; gap: 5px; } @media (max-width: 767.98px) { .related__product-nav { justify-content: flex-start; margin-bottom: 30px; } } .related__product-nav button { width: 45px; height: 45px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; border: none; background: var(--tg-theme-primary); color: var(--tg-color-white-default); -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; padding: 0 0; } .related__product-nav button:hover { background: var(--tg-theme-secondary); } /*============================= 24. Estimate ===============================*/ .estimate__area { position: relative; z-index: 1; } .estimate__content { margin-right: 135px; } @media (max-width: 1199.98px) { .estimate__content { margin-right: 60px; } } @media (max-width: 991.98px) { .estimate__content { margin-right: 0; margin-bottom: 50px; } } .estimate__content .section__title .title { font-size: 40px; } @media (max-width: 1199.98px) { .estimate__content .section__title .title { font-size: 36px; } } @media (max-width: 767.98px) { .estimate__content .section__title .title { font-size: 30px; } } .estimate__content p { margin-bottom: 35px; } .estimate__contact { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 10px; } .estimate__contact .icon { width: 50px; height: 50px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; background: var(--tg-theme-primary); color: var(--tg-color-white-default); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; flex: 0 0 auto; font-size: 24px; } .estimate__contact .content p { margin-bottom: 6px; } .estimate__contact .content a { display: block; font-size: 20px; font-weight: 600; text-transform: capitalize; color: var(--tg-heading-color); line-height: 1; } .estimate__contact .content a:hover { color: var(--tg-theme-primary); } .estimate__tab-wrap { border-radius: 20px 40px; border: 1px solid #DFE1EB; background: var(--tg-color-gray-2); box-shadow: -17px 10px 30px 0px rgba(0, 0, 0, 0.1); padding: 20px; margin-left: 180px; } @media (max-width: 1199.98px) { .estimate__tab-wrap { margin-left: 30px; } } @media (max-width: 991.98px) { .estimate__tab-wrap { margin-left: 0; } } @media (max-width: 767.98px) { .estimate__tab-wrap { padding: 10px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .estimate__tab-wrap { padding: 20px; } } .estimate__tab-inner { border-radius: 15px 30px; border: 1px solid #DDDFEC; background: var(--tg-color-white-default); padding: 22px 22px; } @media (max-width: 767.98px) { .estimate__tab-inner { padding: 20px 15px; } } @media only screen and (min-width: 576px) and (max-width: 767px) { .estimate__tab-inner { padding: 22px 22px; } } .estimate__tab-inner .nav-tabs { border-radius: 6px; border: 1px solid var(--tg-color-gray-4); background: var(--tg-color-gray-1); padding: 5px; margin-bottom: 18px; } .estimate__tab-inner .nav-link { font-size: 15px; font-weight: 500; text-transform: capitalize; color: var(--tg-body-color); padding: 12px 16px; border: none; margin: 0; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; background: transparent; line-height: 1; } .estimate__tab-inner .nav-link.active { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .estimate__tab-inner .form-grp { margin-bottom: 10px; } .estimate__tab-inner .tg-btn { width: 100%; justify-content: center; } .estimate__img img { position: absolute; right: 33%; bottom: 0; z-index: -1; } @media (max-width: 1500px) { .estimate__img img { right: 24%; } } @media (max-width: 1199.98px) { .estimate__img img { right: 34%; max-width: 400px; } } @media (max-width: 991.98px) { .estimate__img img { display: none; } } .estimate__shape img { position: absolute; left: 0; bottom: 0; z-index: -1; } @media (max-width: 1199.98px) { .estimate__shape img { max-width: 300px; } } .range-slider-wrap { margin-bottom: 18px; } .range-slider-wrap .content-top { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; } .range-slider-wrap .content-top p { margin-bottom: 0; text-transform: capitalize; font-size: 16px; font-weight: 500; line-height: 1; } .range-slider-wrap .content-top span { font-size: 18px; font-weight: 600; color: var(--tg-heading-color); } .range-slider-wrap .content-top span strong { font-weight: 600; } .range-slider-wrap input { width: 100%; height: 15px; appearance: none; -webkit-appearance: none; background: #D9D9D9; outline: none; border-radius: 10px; overflow: hidden; padding: 0 0; border: none; } .range-slider-wrap input::-webkit-slider-thumb { -webkit-appearance: none; width: 15px; height: 15px; border-radius: 50%; background: var(--tg-theme-primary); cursor: pointer; border: none; box-shadow: -807px 0 0 800px #6699FF; } /*============================= 25. Benefit ===============================*/ .benefit__area { background: var(--tg-color-gray-2); } .benefit__img { position: relative; margin: 0 20px; z-index: 1; } @media (max-width: 1199.98px) { .benefit__img { margin: 0 0; } } @media (max-width: 991.98px) { .benefit__img { margin: 0 0 50px 0; } } .benefit__img img:nth-child(1) { width: 100%; } .benefit__img img:nth-child(2) { position: absolute; left: 0; top: 0; z-index: 1; width: 100%; } .benefit__img img:nth-child(3) { position: absolute; left: -12%; bottom: -8%; z-index: -1; } .benefit__content > p { margin-bottom: 30px; } .benefit__item { margin-bottom: 30px; } .benefit__item-top { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 20px; margin-bottom: 17px; } .benefit__item-top .title { font-size: 20px; font-weight: 600; text-transform: capitalize; margin-bottom: 0; line-height: 1.4; } .benefit__item p { margin-bottom: 0; } .benefit__icon { width: 70px; height: 70px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; flex: 0 0 auto; background: var(--tg-color-white-default); font-size: 40px; justify-content: center; color: var(--tg-theme-primary); } /*============================= 26. Loan ===============================*/ .loan__bg { background-size: cover; background-position: center; background-color: var(--tg-theme-primary); position: relative; z-index: 1; } .loan__form-wrap .form-grp.select-grp { position: relative; } .loan__form-wrap .form-grp.select-grp::after { content: "\f078"; position: absolute; bottom: 18px; font-family: "Font Awesome 5 Free"; font-weight: 700; right: 18px; font-size: 13px; color: var(--tg-color-white-default); line-height: 1; } .loan__form-wrap .form-grp label { display: block; color: var(--tg-color-white-default); font-size: 16px; font-weight: 500; margin-bottom: 10px; } .loan__form-wrap .form-grp select, .loan__form-wrap .form-grp input { background: rgba(255, 255, 255, 0.17); border: 1px solid var(--tg-color-white-default); -webkit-border-radius: 0; -moz-border-radius: 0; -o-border-radius: 0; -ms-border-radius: 0; border-radius: 0; font-size: 15px; font-weight: 400; color: var(--tg-color-white-default); } .loan__form-wrap .form-grp select::placeholder, .loan__form-wrap .form-grp input::placeholder { color: var(--tg-color-white-default); font-size: 15px; } .loan__form-wrap .form-grp select { width: 100%; height: 50px; padding: 11px 35px 11px 18px; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; } .loan__form-wrap .form-grp select option { color: var(--tg-heading-color); } .loan__form-wrap .form-grp select:focus { outline: none; } .loan__form-wrap button { width: 100%; background: var(--tg-color-white-default); color: var(--tg-theme-primary); border: none; margin-top: 24px; padding: 15px 20px; font-size: 17px; font-weight: 600; text-transform: capitalize; box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.25); } .loan__form-wrap button:hover { background: var(--tg-theme-secondary); color: var(--tg-color-white-default); } .loan__shape img { position: absolute; z-index: -1; } .loan__shape img:nth-child(1) { left: 0; top: 0; } .loan__shape img:nth-child(2) { right: 60px; bottom: 80px; } @media (max-width: 1800px) { .loan__shape img:nth-child(2) { right: 20px; bottom: 60px; max-width: 150px; } } @media (max-width: 1500px) { .loan__shape img:nth-child(2) { right: 10px; bottom: 45px; max-width: 100px; } } @media (max-width: 767.98px) { .loan__shape img:nth-child(2) { display: none; } } /*============================= 27. Features ===============================*/ .features__area { margin-top: -110px; } .features__item { border: 1px solid #E0E1E9; background: var(--tg-color-white-default); padding: 40px 40px; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s; } @media (max-width: 1199.98px) { .features__item { padding: 30px 25px; } } @media (max-width: 991.98px) { .features__item { padding: 35px 35px; } } .features__item-top { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 18px; margin-bottom: 20px; } .features__item-top .title { margin-bottom: 0; font-size: 20px; font-weight: 600; text-transform: capitalize; } .features__item:hover { transform: translateY(-5px); } .features__item:hover .features__icon i { transform: rotateY(180deg); } .features__icon { width: 70px; height: 70px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; justify-content: center; font-size: 40px; color: var(--tg-theme-primary); background: var(--tg-color-gray-1); flex: 0 0 auto; } .features__icon i { -webkit-transition: all 0.5s ease-out 0s; -moz-transition: all 0.5s ease-out 0s; -ms-transition: all 0.5s ease-out 0s; -o-transition: all 0.5s ease-out 0s; transition: all 0.5s ease-out 0s; } .features__content p { margin-bottom: 0; } /*============================= 23. Contact ===============================*/ .contact__area { padding: 85px 0 110px; } .contact__area-two { background: var(--tg-theme-secondary); position: relative; z-index: 1; } .contact__img { position: absolute; width: 45%; height: 100%; left: 0; top: 0; z-index: -1; clip-path: polygon(0 0, 100% 0, 90% 100%, 0% 100%); background-size: cover; background-position: center; } @media (max-width: 1500px) { .contact__img { clip-path: polygon(0 0, 100% 0, 80% 100%, 0% 100%); } } @media (max-width: 991.98px) { .contact__img { display: none; } } .contact__shape { width: 286px; height: 100%; position: absolute; left: 32%; top: 0; background-size: cover; background-position: center; } @media (max-width: 1800px) { .contact__shape { left: 30%; } } @media (max-width: 1500px) { .contact__shape { left: 26%; } } @media (max-width: 1199.98px) { .contact__shape { left: 20%; } } @media (max-width: 991.98px) { .contact__shape { display: none; } } .contact-map { width: 100%; height: 420px; } @media (max-width: 1199.98px) { .contact-map { height: 360px; } } .contact-map iframe { width: 100%; height: 100%; mix-blend-mode: luminosity; } .contact__info-item { position: relative; background: var(--tg-color-white-default); border: 1px solid #DEE0EE; padding: 45px 55px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; z-index: 1; overflow: hidden; margin-bottom: 18px; } @media (max-width: 1199.98px) { .contact__info-item { padding: 40px 30px; } } @media (max-width: 767.98px) { .contact__info-item { padding: 30px 30px; } } .contact__info-item:last-child { margin-bottom: 0; } .contact__info-item .title { font-size: 24px; margin-bottom: 6px; } .contact__info-item p { margin-bottom: 10px; font-size: 16px; font-weight: 500; } .contact__info-item .list-wrap li { margin-bottom: 3px; } .contact__info-item .list-wrap li:last-child { margin-bottom: 0; } .contact__info-item .list-wrap li a { color: var(--tg-body-color); font-size: 18px; font-weight: 500; line-height: 1.4; position: relative; } .contact__info-item .list-wrap li a::before { content: ""; position: absolute; left: 0; bottom: 0; width: 0%; height: 1px; background: var(--tg-theme-primary); -webkit-transition: all 0.4s ease-out 0s; -moz-transition: all 0.4s ease-out 0s; -ms-transition: all 0.4s ease-out 0s; -o-transition: all 0.4s ease-out 0s; transition: all 0.4s ease-out 0s; } .contact__info-item .list-wrap li a:hover { color: var(--tg-theme-primary); } .contact__info-item .list-wrap li a:hover::before { width: 100%; } .contact__info-item .shape { position: absolute; right: -19px; bottom: -13px; color: #F4F5F8; z-index: -1; } .contact__form-wrap { background: var(--tg-color-gray-1); padding: 50px 60px 55px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; -ms-border-radius: 15px; border-radius: 15px; margin-left: 30px; } @media (max-width: 1199.98px) { .contact__form-wrap { padding: 35px 35px 40px; } } @media (max-width: 991.98px) { .contact__form-wrap { margin-left: 0; margin-top: 50px; } } @media (max-width: 767.98px) { .contact__form-wrap { padding: 35px 30px 40px; } } .contact__form-wrap .title { margin-bottom: 20px; font-size: 30px; font-weight: 600; text-transform: capitalize; } @media (max-width: 767.98px) { .contact__form-wrap .title { font-size: 26px; } } .contact__form .form-grp { margin-bottom: 15px; } .contact__form .form-grp > label { font-size: 16px; font-weight: 500; color: var(--tg-body-color); line-height: 1; margin-bottom: 14px; } .contact__form .checkbox-grp { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: flex-start; margin: 20px 0; } .contact__form .checkbox-grp input { width: 18px; margin-right: 9px; height: 18px; cursor: pointer; flex: 0 0 auto; margin-top: 3px; } .contact__form .checkbox-grp label { font-weight: 400; font-size: 16px; color: var(--tg-body-color); user-select: none; margin-bottom: 0; line-height: 1.2; } .contact__form-two .row { --bs-gutter-x: 10px; } .contact__form-two .form-grp { margin-bottom: 10px; } .contact__form-two .form-grp textarea, .contact__form-two .form-grp input { border: none; } .contact__form-two button { width: 100%; background: var(--tg-theme-primary); border: none; font-size: 16px; font-weight: 600; text-transform: uppercase; -webkit-border-radius: 6px; -moz-border-radius: 6px; -o-border-radius: 6px; -ms-border-radius: 6px; border-radius: 6px; color: var(--tg-color-white-default); padding: 16px 20px; } .contact__form-two button:hover { background: var(--tg-color-gray-1); color: var(--tg-theme-primary); } .ajax-response.error, .ajax-response.success { margin: 20px 0 0 !important; } .ajax-response.error { color: red; } .ajax-response.success { color: green; } /*============================= 17. Footer ===============================*/ .footer__area { position: relative; z-index: 1; } .footer__area-two { background: #a1248a; position: relative; z-index: 1; } .footer__area-three { position: relative; z-index: 1; } .footer__area-three::before { content: ""; position: absolute; left: -240px; bottom: -200px; width: 520px; height: 520px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; background: #7838FF; filter: blur(125px); opacity: 0.1; z-index: -1; } .footer__area-four { background: var(--tg-theme-secondary); position: relative; z-index: 1; } .footer__area-five { padding-top: 88px; margin-top: -88px; } .footer__top { padding: 140px 0 100px; } @media (max-width: 767.98px) { .footer__top { padding: 100px 0 60px; } } .footer__top .row *:nth-child(2) .footer__widget { margin-left: 40px; } @media (max-width: 767.98px) { .footer__top .row *:nth-child(2) .footer__widget { margin-left: 0; } } .footer__top .row *:nth-child(4) .footer__widget { margin-left: 30px; } @media (max-width: 1199.98px) { .footer__top .row *:nth-child(4) .footer__widget { margin-left: 0; } } .footer__top-two { padding: 70px 0 20px; } @media (max-width: 767.98px) { .footer__top-two { padding: 60px 0 30px; } } .footer__top-two .row *:nth-child(2) .footer__widget { margin-left: 40px; } @media (max-width: 991.98px) { .footer__top-two .row *:nth-child(2) .footer__widget { margin-left: 0; } } .footer__top-two .row *:nth-child(4) .footer__widget { margin-left: 80px; } @media (max-width: 1199.98px) { .footer__top-two .row *:nth-child(4) .footer__widget { margin-left: 0; } } .footer__top-three { padding: 75px 0 60px; } .footer__top-three .row *:nth-child(2) .footer__widget { margin-left: 30px; } @media (max-width: 1199.98px) { .footer__top-three .row *:nth-child(2) .footer__widget { margin-left: 0; } } .footer__top-three .row *:nth-child(4) .footer__widget { margin-left: 50px; } @media (max-width: 1199.98px) { .footer__top-three .row *:nth-child(4) .footer__widget { margin-left: 0; } } .footer__logo { margin-bottom: 25px; } .footer__logo-two { margin-bottom: 30px; } .footer__content p { margin-bottom: 25px; font-size: 15px; } .footer__content-two p { margin-bottom: 25px; } .footer__content-three p { color: var(--tg-color-gray-4); } .footer__contact .list-wrap li { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: baseline; gap: 15px; color: var(--tg-color-gray-4); line-height: 1.6; margin-bottom: 15px; } .footer__contact .list-wrap li i { font-size: 24px; color: var(--tg-color-gray-4); transform: translateY(7px); } .footer__contact .list-wrap li a { color: var(--tg-color-gray-4); } .footer__contact .list-wrap li a:hover { color: var(--tg-theme-primary); } .footer__contact-two p { margin-bottom: 20px; } .footer__contact-two .list-wrap li { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 15px; font-size: 16px; margin-bottom: 20px; } .footer__contact-two .list-wrap li:last-child { margin-bottom: 0; } .footer__contact-two .list-wrap li i { font-size: 24px; color: var(--tg-theme-primary); } .footer__contact-two .list-wrap li a { color: var(--tg-body-color); } .footer__contact-two .list-wrap li a:hover { color: var(--tg-theme-primary); } .footer__widget { margin-bottom: 40px; } .footer__widget-title { margin-bottom: 20px; font-size: 20px; font-weight: 600; } .footer__widget-title-two { color: #fff; } .footer__widget-link li { margin-bottom:0; color:#fff !important; } .footer__widget-link li:last-child { margin-bottom: 0; } .footer__widget-link li a { color:#fff !important; position: relative; font-size: 14px; } .footer__widget-link li a::before { content: ""; position: absolute; left: 0; bottom: -1px; width: 100%; height: 1px; background: #fff; transform-origin: right top; transform: scale(0, 1); transition: transform 0.4s cubic-bezier(0.74, 0.72, 0.27, 0.24); } .footer__widget-link li a:hover { color: #fff; } .footer__widget-link li a:hover::before { -webkit-transform-origin: left top; -ms-transform-origin: left top; transform-origin: left top; -webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); transform: scale(1, 1); } .footer__widget-link-two li { color: #fff; } .footer__widget-link-two li a { color: #fff; } .footer__instagram .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; flex-wrap: wrap; gap: 15px; } .footer__instagram .list-wrap a img { -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; } .footer__newsletter span { display: block; margin-bottom: 20px; } .footer__newsletter-form { position: relative; } .footer__newsletter-form input { width: 100%; -webkit-border-radius: 100px; -moz-border-radius: 100px; -o-border-radius: 100px; -ms-border-radius: 100px; border-radius: 100px; background: #F4F6FC; padding: 15px 60px 15px 25px; height: 54px; } .footer__newsletter-form button { width: 48px; height: 48px; position: absolute; right: 4px; top: 50%; transform: translateY(-50%); background: var(--tg-theme-primary); color: var(--tg-color-white-default); border: none; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; } .footer__newsletter-form button:hover { background: var(--tg-theme-secondary); } .footer__newsletter-two span { color: var(--tg-color-gray-4); } .footer__social .list-wrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 12px; } .footer__social .list-wrap li a { width: 40px; height: 40px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; background: var(--tg-color-gray-8); -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; color: var(--tg-body-color); justify-content: center; } .footer__social .list-wrap li a svg { width: 16px; height: 16px; } .footer__social .list-wrap li a:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); } .footer__social-two .list-wrap { justify-content: flex-end; } @media (max-width: 767.98px) { .footer__social-two .list-wrap { justify-content: center; } } .footer__social-three .title { display: block; font-size: 14px; font-weight: 500; margin-bottom: 10px; } .footer__social-three .list-wrap li a { background: var(--tg-color-white-default); border: 1px solid #ADADAD; } .footer__social-three .list-wrap li a:hover { background: var(--tg-theme-primary); color: var(--tg-color-white-default); border-color: var(--tg-theme-primary); } .footer__social-four .list-wrap li a { color: var(--tg-color-white-default); border: 2px solid #494A67; background: transparent; } .footer__social-four .list-wrap li a:hover { border-color: var(--tg-theme-primary); } .footer__bottom { background: var(--tg-color-white-default); border-top: 1px solid var(--tg-border-8); padding: 40px 0; } .footer__bottom-two { border-top: 1px solid #232349; padding: 33px 0; } @media (max-width: 767.98px) { .footer__bottom-two { padding: 25px 0; } } .footer__bottom-three { border-top: 1px solid #D7DBEB; padding: 40px 0; } @media (max-width: 767.98px) { .footer__bottom-three { padding: 25px 0; } } @media (max-width: 991.98px) { .footer__bottom-four .copyright__content-two { margin-bottom: 15px; } } @media (max-width: 991.98px) { .footer__bottom-four .footer__social-two .list-wrap { justify-content: center; } } .footer__bottom-five { background: #040534; padding: 42px 0; } @media (max-width: 767.98px) { .footer__bottom-five { padding: 28px 0; } } @media (max-width: 767.98px) { .footer__bottom-logo { text-align: center; margin-bottom: 20px; } } @media (max-width: 991.98px) { .footer__bottom-logo-two { text-align: center; margin-bottom: 15px; } } .footer__inquiry { padding: 100px 0 65px; border-bottom: 1px solid #141543; } .footer__inquiry-content { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: center; gap: 30px 50px; } @media (max-width: 1199.98px) { .footer__inquiry-content { gap: 30px; } } @media (max-width: 991.98px) { .footer__inquiry-content { gap: 20px; flex-wrap: wrap; text-align: center; margin-bottom: 20px; } } .footer__inquiry-content .title { color: var(--tg-color-white-default); font-size: 40px; margin-bottom: 0; text-transform: capitalize; font-weight: 300; width: 41%; flex: 0 0 auto; } @media (max-width: 991.98px) { .footer__inquiry-content .title { width: 100%; } } .footer__inquiry-content .title span { font-weight: 600; display: block; } .footer__inquiry-content p { color: var(--tg-color-gray-4); margin-bottom: 0; font-weight: 500; text-transform: capitalize; } @media (max-width: 991.98px) { .footer__inquiry-btn { text-align: center !important; } } .footer__shape-wrap img { position: absolute; z-index: -1; } .footer__shape-wrap img:nth-child(1) { right: 0; top: 0; } .footer__shape-wrap img:nth-child(2) { left: 0; bottom: 0; } .footer__shape-wrap img:nth-child(3) { right: 4%; bottom: 14px; } @media (max-width: 767.98px) { .footer__shape-wrap img:nth-child(3) { right: 5%; bottom: 60px; max-width: 100px; } } .footer__shape-wrap-two img { position: absolute; z-index: -1; } .footer__shape-wrap-two img:nth-child(1) { left: 0; top: 0; } @media (max-width: 1500px) { .footer__shape-wrap-two img:nth-child(1) { max-width: 200px; } } .footer__shape-wrap-two img:nth-child(2) { bottom: 0; left: 0; mix-blend-mode: luminosity; opacity: 0.5; } @media (max-width: 1500px) { .footer__shape-wrap-two img:nth-child(2) { max-width: 130px; } } .footer__shape-wrap-two img:nth-child(3) { right: 0; bottom: 0; mix-blend-mode: luminosity; opacity: 0.3; } @media (max-width: 1500px) { .footer__shape-wrap-two img:nth-child(3) { max-width: 160px; } } .footer__shape-wrap-three img { position: absolute; z-index: -1; } .footer__shape-wrap-three img:nth-child(1) { bottom: 0; left: 0; mix-blend-mode: luminosity; opacity: 0.5; } @media (max-width: 1500px) { .footer__shape-wrap-three img:nth-child(1) { max-width: 130px; } } .footer__shape-wrap-three img:nth-child(2) { right: 0; bottom: 0; mix-blend-mode: luminosity; opacity: 0.3; } @media (max-width: 1500px) { .footer__shape-wrap-three img:nth-child(2) { max-width: 160px; } } .footer__shape-wrap-four img { position: absolute; z-index: -1; } .footer__shape-wrap-four img:nth-child(1) { left: 0; top: 120px; } @media (max-width: 1500px) { .footer__shape-wrap-four img:nth-child(1) { top: 25px; } } .footer__shape-wrap-four img:nth-child(2) { left: 0; bottom: 0; } .footer__shape-wrap-four img:nth-child(3) { right: -96px; bottom: 270px; } @media (max-width: 1500px) { .footer__shape-wrap-four img:nth-child(3) { bottom: 140px; } } .footer__shape-wrap-four img:nth-child(4) { right: 15%; bottom: 28%; } @media (max-width: 991.98px) { .footer__shape-wrap-four img:nth-child(4) { display: none; } } .copyright__content { text-align: center; } .copyright__content p { margin-bottom: 0; font-size: 15px; } @media (max-width: 767.98px) { .copyright__content-two { text-align: center; margin-bottom: 25px; } } .copyright__content-two p { color: #878BA8; margin-bottom: 0; font-size: 15px; } .copyright__content-three p { margin-bottom: 0; font-size: 15px; text-align: right; } @media (max-width: 767.98px) { .copyright__content-three p { text-align: center; } } .copyright__content-four p { margin-bottom: 0; font-size: 15px; text-align: center; color: #878BA8; } @media only screen and (min-width: 479px) { .mkyy1, * [aria-labelledby='mkyy1'] { display: none !important; max-height: none !important; overflow: visible !important; visibility: hidden; position:absolute; max-height: 0; } } .fonts142{ font-size: 98px !important; } @media only screen and (max-width: 479px) { .mobile-hide{ display: none !important; } } /*# sourceMappingURL=main.css.map */