/*! Theme Name: Bitrader - Crypto, Stock and Forex Trading WordPress Theme Template URI: Author: thetork Author URI: https://themeforest.net/user/thetork/portfolio Version: 1.0 Text Domain: bitrader Tags: Crypto, Forex, and Stocks Trading Business */ /* @@@@@@@@@@@@@ aditional Property CSS Writing Now @@@@@@@@@@@@@@ */ :root { --brand-color: #D9B240; --secondary-color:#0A4FD5; --tertiary-color: #E0FAF2; --tertiary-color2: #F5F7FC; --tertiary-color3: #F5F7FC; --tertiary-color4: #3863e0; --body-color:#FFFFFF; --header-bg-color: #0e352a; --header-bg-color2: #093d47; --border-color: #E6EDFB; --border-color-5: #F1F4FB; --border-color-6: #E5F9F3; --border-color-7: #9DB9EE; --border-color-8: rgba(189, 189, 189, 0.2); --border-color-9: rgba(5, 0, 26, 0.12); --border-color-10: rgba(20, 24, 33, 0.10); --border-color-11: #E6E6E6; --feature-bg-color: #00150F; --social-border-color: #F0F4FA; --social-border-color-2: #ECEFF2; --social-border-color-3: #ECEFF2; --form-border: #CFDEF1; --title-color:#0C263A; --title-color-style2:#0C263A; --text-color:#6B777F; --text-color-light: #6B6F7F; --text-color-2: rgba(255, 255, 255, 0.6); --text-color-3: rgba(255, 255, 255, 0.70); --text-color-4: #B0B3BF; --bg-color: #EDF2F8; --bg-color-trans: rgba(237, 242, 248, 0.22); --bg-grad-color: #FFF; --bg-grad-color-trans: rgba(255, 255, 255, 0.00); --bg-grad-color-2: #D5E5F9; --bg-grad-color-trans-2: rgba(255, 255, 255, 0.22); --bg-grad-color-3: #E9EFF7; --bg-grad-color-trans-3: rgba(240, 244, 250, 0.16); --bg-grad-color-4: rgba(0, 208, 148, 0.32); --bg-grad-color-trans-4: rgba(229, 237, 248, 0.00); --bg-color-2: #F5F8FC; --bg-color-3: #FFFFFF; --bg-color-4:linear-gradient(150.39deg, rgba(237, 242, 248, 0.22) 15.02%, #52eaf0 99.59%); --bg-color-5:linear-gradient(150.39deg, rgba(237, 242, 248, 0.22) 15.02%, #52eaf0 99.59%); --bg-color-6:#F5F7FC; --bg-color-7: #F1F4FB; --bg-color-8: #124D6D; --bg-color-9: #FFFF; --bg-color-10: #d7ff80; --bg-color-11: #141821; --bg-color-12: #141821; --bg-color-14: #FFF6E0; --bg-color-15: rgba(43, 40, 40, 0.15); --bg-color-17: rgb(220, 53, 69); --bg-color-18: rgba(5, 0, 26, 0.12); --bg-white: #ffffff; --bg-team: #d6e5ff; --form-focus-color: #366CD5; --wh-color:#fff; --black-color:#000; --floating-content-border-color: rgba(0, 0, 0, 0.02); --floating-content-bg-color: rgba(255, 255, 255, 0.95); --floating-content-bg-color-2: rgba(255, 255, 255, 0.50); --service-item-border-color: #fff; --service-item-bg-color: #fff; --faq-item-btn-border-color: #03314b12; --faq-bg-color: #fff; --extra-bg-color: #fff; --tag-bg-color: #EDFFFA; --bg-shape-color: #B8CFEB; --bg-shape-color-trans: rgba(255, 255, 255, 0.22); --bg-shape-color-2: #D5E5F9; --bg-shape-color-trans-2: rgba(255, 255, 255, 0.22); --footer-bg-color: #d9b34000; --faq-img-bg-shadow: #d9b240; --pagination-bg-color: #E0FAF2; --section-bg-color: #f8f8f8; --sec-bg-color-2: #fff; --account-bg-color: #F5F7FC; --account-bg-color2: #FFF; --arrow-color1: #B5CAF2; --arrow-icon-color: #0A4FD5; --header-border-color: #EBE9E1; --header-border-color2: rgba(255, 255, 255, 0.12); --banner2-bg-color: #0e241d; --about-img-bg-shadow: #d9b340ce; --cta-img-bg-shadow: #45554b; --warning-color:#F79009; } :root .accordion-button:after { --bs-accordion-btn-icon: url('data:image/svg+xml, '); --bs-accordion-btn-active-icon: url('data:image/svg+xml, '); } :root .accordion-button--style2:after { --bs-accordion-btn-icon: url('data:image/svg+xml, '); --bs-accordion-btn-active-icon: url('data:image/svg+xml, '); } :root .accordion-button--style3:after { --bs-accordion-btn-icon: url('data:image/svg+xml, '); --bs-accordion-btn-active-icon: url('data:image/svg+xml, '); } :root[data-bs-theme=dark] , [data-bs-theme=dark] { --brand-color:#D9B240; --secondary-color:#d9b240; --tertiary-color:#181619; --tertiary-color2:#181619; --tertiary-color3:#181619; --tertiary-color4:#3863e0; --body-color:#181619; --border-color:#E6EDFB1F; --border-color-5: rgba(255, 255, 255, 0.08); --border-color-6: rgba(255, 255, 255, 0.08); --border-color-7: #181619; --border-color-8: rgba(234, 219, 215, 0.06); --border-color-9: rgba(184, 182, 193, 0.12); --border-color-10: rgba(184, 182, 193, 0.12); --border-color-11: rgba(255, 255, 255, 0.1); --header-bg-color: #181619; --header-bg-color2: #093d47; --feature-bg-color: rgba(229, 237, 248, 0.087); --social-border-color:#ffffff14; --social-border-color-2:#FFFFFF14; --social-border-color-3:rgba(255, 255, 255, 0.1); --form-border:#DCDFE833; --title-color:#FFFFFF; --title-color-style2:#BBC2C7; --text-color:rgba(255, 255, 255, 0.6); --text-color-light:#FFFFFF; --text-color-2: rgba(255, 255, 255, 0.6); --text-color-3: rgba(255, 255, 255, 0.70); --text-color-4: #B0B3BF; --bg-color: rgba(237, 242, 248, 0.08); --bg-color-trans: rgba(237, 242, 248, 0.02); --bg-grad-color: #253A33; --bg-grad-color-trans: rgba(255, 255, 255, 0.00); --bg-grad-color-2: rgba(213, 229, 249, 0.16); --bg-grad-color-trans-2: rgba(255, 255, 255, 0.04); --bg-grad-color-3: rgba(32, 56, 51, 0.50); --bg-grad-color-trans-3: rgba(2, 29, 21, 0.00); --bg-grad-color-4: rgba(0, 208, 148, 0.24); --bg-grad-color-trans-4: rgba(0, 208, 148, 0.00); --bg-color-2:#2D2C2C; --bg-color-3:#D9B240; --bg-color-4:linear-gradient(150.39deg, rgba(237, 242, 248, 0.0264) 15.02%, rgba(237, 242, 248, 0.12) 99.59%); --bg-color-5:linear-gradient(150.39deg, rgba(237, 242, 248, 0.22) 15.02%, #EDF2F8 99.59%); --bg-color-6:#2D2C2C; --bg-color-7:#ffffff0a; --bg-color-8:#181619; --bg-color-9:#000; --bg-color-10:#d7ff80; --bg-color-11:#141821; --bg-color-12: rgba(237, 242, 248, 0.08); --bg-color-14: #181619; --bg-color-15: rgba(43, 40, 40, 0.308); --bg-color-17: rgb(220, 53, 69); --bg-color-18: rgba(255, 255, 255, 0.50); --bg-white:#ffffff; --bg-team:#181619; --form-focus-color:#366CD5; --wh-color:#181619; --black-color:#fff; --floating-content-border-color: rgba(0, 0, 0, 0.02); --floating-content-bg-color: rgba(63, 81, 75, 0.97); --floating-content-bg-color-2: rgba(255, 255, 255, 0.08); --service-item-border-color: #181619; --service-item-bg-color: #181619; --faq-item-btn-border-color: #FFFFFF14; --faq-bg-color: #181619; --extra-bg-color: #181619; --tag-bg-color: #181619; --bg-shape-color: rgba(213, 229, 249, 0.08); --bg-shape-color-trans: rgba(255, 255, 255, 0.02); --bg-shape-color-2: rgba(213, 229, 249, 0.16); --bg-shape-color-trans-2: rgba(255, 255, 255, 0.04); --footer-bg-color: #d9b34000; --faq-img-bg-shadow: #d9b240; --pagination-bg-color: #00150F; --section-bg-color: rgba(237, 242, 248, 0.02); --sec-bg-color-2: #081c17; --account-bg-color: #00150F; --account-bg-color2: #00150F; --arrow-color1: #2B4B43; --arrow-icon-color: #fff; --header-border-color: rgba(255, 255, 255, 0.16); --header-border-color2: rgba(255, 255, 255, 0.12); --banner2-bg-color: #181619; --about-img-bg-shadow: #d9b340ce; --cta-img-bg-shadow: #45554b; --warning-color:#F79009; } [data-bs-theme=dark] .accordion-button:after { --bs-accordion-btn-icon: url('data:image/svg+xml, '); --bs-accordion-btn-active-icon: url('data:image/svg+xml, '); } [data-bs-theme=dark] .accordion-button--style2:after { --bs-accordion-btn-icon: url('data:image/svg+xml, '); --bs-accordion-btn-active-icon: url('data:image/svg+xml, '); } [data-bs-theme=dark] .accordion-button--style3:after { --bs-accordion-btn-icon: url('data:image/svg+xml, '); --bs-accordion-btn-active-icon: url('data:image/svg+xml, '); } .about__content--style2 .about__content-inner, .roadmap--style2 .roadmap__upper-inner, .roadmap--style1 .roadmap__item-header, .accordion__button, .comment__author, .comment__head, .tags--style2 ul, .tags ul, .sidebar__categorie-body ul li, .sidebar__recentpost-inner, .testimonial__author, .testimonial__footer, .testimonial__item--style3 .testimonial__item-body, .blog-details__action-inner, .blog__writer, .floating-content__item--style4, .floating-content__item--style2, .social, .btn-group, .footer__end-links, .footer__app-inner, .footer__app, .account__check, .contact__item-inner, .subtitle, .section-header--style4, .menu, .header-wrapper .menu-area .header-btn, .header-wrapper .menu-area, .header-wrapper, .paginations ul li:not(:first-child, :last-child) a, .paginations ul li a, .swiper-nav { display: flex; flex-wrap: wrap; } .footer__app-inner, .account__social-btn, .banner--style4 .banner__content-btn, .subtitle--style2, .home-showcase__buttons, .paginations ul li:not(:first-child, :last-child) a, .paginations ul li a { justify-content: center; } .roadmap--style1 .roadmap__item-header, .accordion__button, .comment__head, .sidebar__categorie-body ul li, .testimonial__footer, .testimonial__item--style3 .testimonial__item-body, .blog-details__action-inner, .account__check, .section-header--style4, .header-wrapper { justify-content: space-between; } .about--style3 .about__content ul li, .roadmap--style2 .roadmap__upper-inner, .comment__author, .comment__head, .sidebar__categorie-body ul li, .sidebar__recentpost-inner, .testimonial__author, .testimonial__footer, .blog-details__action-inner, .blog-details__meta ul li, .blog__writer, .floating-content__item--style4, .floating-content__item--style2, .social, .btn-group, .text-btn, .trk-btn--outline5, .trk-btn--outline3, .trk-btn--outline22, .trk-btn--outline2, .trk-btn--left span, .trk-btn--left, .trk-btn--arrowplay, .trk-btn--defult, .footer__end-links, .footer__end-copyright, .footer__app-inner, .footer__app, .account__check, .contact__item-inner, .banner--style3 .banner__counter-inner, .subtitle, .section-header--style4, .home-showcase__buttons, .header-wrapper .menu-area .header-btn, .header-wrapper .menu-area, .header-wrapper, .playbtn, .paginations ul li:not(:first-child, :last-child) a, .paginations ul li a, .swiper-nav { align-items: center; } .about__icon-inner, .social__link--style4, .social__link--style6, .social__link--style5, .social__link--style3, .social__link--style222, .social__link--style22, .social__link--style2, .social__link--style1, .lightdark-switch .switch-btn, .contact__item-thumb span, .swiper-nav__btn { place-items: center; } .about--style3 .about__content h2, .about__content--style2 .about__content-inner h2, .about__content--style2 .about__content-details h5, .about__content-inner h2, .roadmap--style1 .roadmap__item-header h3, .accordion__button, .comment__action a, .counter__item-inner p, .service-details__team h5, .error__content h2, .tags--style2 ul li a, .tags ul li a, .cta__subscribe h2, .blog-details__segment-content h5, .blog-details__content h3, .blog__content h5, .feature--style1 .feature__item-content h6, .floating-content__item--style2 p, .text-btn, .account__check-forgot a, .contact__social h3, .banner--style5 .banner__content-heading, .banner--style4 .banner__content h1, .banner--style3 .banner__counter-item p, .banner__content-heading, .page-header__content h2, .section-header h2 { text-transform: capitalize; } /*=========<>=========*/ /*=========<>=========*/ .roadmap--style2 .roadmap__upper-inner::after, .cta__shape-item--2, .account__thumb img, .banner--style2 .banner__wrapper--style2::after, .playbtn__content, .swiper-nav--style2 .swiper-nav__btn { display: none; } .about--style3 .about__content ul li, .banner--style3 .banner__counter-inner, .header-wrapper .logo a { display: block; } .about__content--style2 .about__content-inner, .roadmap--style2 .roadmap__upper-inner, .roadmap--style1 .roadmap__item-header, .accordion__button, .comment__author, .comment__head, .tags--style2 ul, .tags ul, .sidebar__categorie-body ul li, .sidebar__recentpost-inner, .testimonial__author, .testimonial__footer, .testimonial__item--style3 .testimonial__item-body, .blog-details__action-inner, .blog__writer, .floating-content__item--style4, .floating-content__item--style2, .social, .btn-group, .footer__end-links, .footer__app-inner, .footer__app, .account__check, .contact__item-inner, .subtitle, .section-header--style4, .menu, .header-wrapper .menu-area .header-btn, .header-wrapper .menu-area, .header-wrapper, .paginations ul li:not(:first-child, :last-child) a, .paginations ul li a, .swiper-nav { display: flex; } .about__icon-inner, .blog-details__meta ul, .social__link--style4, .social__link--style6, .social__link--style5, .social__link--style3, .social__link--style222, .social__link--style22, .social__link--style2, .social__link--style1, .lightdark-switch .switch-btn, .contact__item-thumb span, .swiper-nav__btn { display: grid; } .blog__meta-tag, .trk-btn, .footer__linklist-item a, .account__switch a, .account__social-btn span, .header-bar span { display: inline-block; } .blog-details__meta ul li, .service__item-thumb, .trk-btn--outline5, .trk-btn--outline3, .trk-btn--outline22, .trk-btn--outline2, .trk-btn--left span, .trk-btn--left, .trk-btn--arrowplay, .trk-btn--defult, .footer__end-copyright, .playbtn { display: inline-flex; } /*=========<>=========*/ /*=========<>=========*/ .about__thumb--style3, .about__thumb--style2, .about__thumb-image img, .about__thumb-image, .about, .roadmap--style2 .roadmap__item-inner, .roadmap--style2 .roadmap__item, .roadmap--style2 .roadmap__upper-inner, .roadmap--style1 .roadmap__item-inner, .roadmap--style1 .roadmap__wrapper, .roadmap, .counter, .service-details__team, .faq, .sidebar__search form, .sidebar__head, .story__thumb-inner, .story__wrapper, .story, .cta--style2, .cta__thumb, .cta__newsletter-inner, .cta__wrapper, .testimonial__wrapper, .blog-details, .blog__wrapper, .blog, .team__item-thumb, .team__item-inner, .pricing__item-top, .pricing__item, .pricing, .service__item-inner, .service, .feature--style1 .feature__wrapper, .feature--style1 .feature, .feature, .partner--style2, .partner--gradient, .partner__wrapper, .social__link--style3, .text-btn, .trk-btn, .footer__linklist-item a, .footer__app-inner, .footer__wrapper, .footer, .account__divider--style1, .account__wrapper, .account, .contact__wrapper, .contact, .banner--style5 .banner__content, .banner--style5 .banner, .banner--style5, .banner--style4, .banner--style3 .banner, .banner--style3, .banner--style2 .banner__content, .banner--style2, .banner--style1, .page-header, .section-header, .home-showcase__image, .menu-item-has-children > a, .header-bar, .header-section, .paginations ul li:not(:first-child, :last-child) a, .paginations ul li a, .form-pass { position: relative; } .about__shape--style2 .about__shape-item, .about__shape--style1 .about__shape-item, .about__thumb--style3::after, .about__thumb--style2::after, .roadmap--style2 .roadmap__upper-inner::after, .roadmap--style1 .roadmap__shape-item, .faq__shape-item--3, .faq__shape-item--2, .faq__shape-item--1, .faq__shape-item, .sidebar__search form button, .story__shape-item, .story__thumb-playbtn, .cta__shape-item, .blog__shape-item, .blog__bg-element img, .team__item-shape3, .team__item-shape2, .team__item-shape1, .team__item-content, .pricing__shape-item--6, .pricing__shape-item--5, .pricing__shape-item, .service__shape-item--2, .service__shape-item, .feature--style2 .feature__shape-item, .feature--style1 .feature__shape-item, .partner--style2:before, .partner--gradient::after, .partner--gradient:before, .floating-content__bottom-right, .floating-content__bottom-left, .floating-content__left-top, .floating-content__top-right, .floating-content__top-left, .text-btn--style2::after, .text-btn::after, .trk-btn:after, .footer__shape-item, .footer__linklist-item a::after, .account__shape-item, .account__divider--style1:before, .account__divider--style1 span, .contact__shape-item, .banner--style5::after, .banner--style3 .banner__bg, .banner--style3 .banner__bg-element span, .banner--style3 .banner__bg-element img, .banner--style2 .banner__wrapper--style2::after, .banner--style1 .banner__bg-element span, .banner--style1 .banner__bg-element img, .banner__shape-item, .page-header__shape-item, .home-showcase__badge, .home-showcase__image::after, .home-showcase__buttons, .menu-item-has-children > a::after, .header-bar span, .header-section--style5, .header-section--style4, .header-section--style3, .header-section--style2, .swiper-nav--style2 .swiper-nav__btn-next, .swiper-nav--style2 .swiper-nav__btn-prev, .form-pass__ctoggle, .form-pass__toggle { position: absolute; } .lightdark-switch .switch-btn { position: fixed; } .story__thumb-playbtn { transform: translate(-50%, -50%); position: absolute; content: ""; top: 50%; left: 50%; } /*=========<>=========*/ /*=========<>=========*/ .accordion__button { text-align: start; } .about__icon-inner, .about__thumb--style2, .roadmap--style2 .roadmap__item-inner, .counter__item-inner, .faq__thumb--style1, .team__item-author, .social__link, .trk-btn--outline6, .trk-btn--outline5, .trk-btn--outline4, .trk-btn--outline3, .trk-btn--outline22, .trk-btn--outline2, .trk-btn--outline, .trk-btn--defult, .trk-btn, .account__switch, .banner--style5 .banner__thumb2-inner p, .banner--style4 .banner__content p, .banner--style4 .banner__content h1, .section-header--max65, .section-header--max57, .section-header--max50 { text-align: center; } .floating-content__top-left--style2, .floating-content__item--style4, .floating-content__item--style2 p { text-align: left; } .tags--style2 ul li a, .tags ul li a, .sidebar__categorie-body ul li span, .sidebar__categorie-body ul li a, .floating-content__item p, .text-btn.text-btn--small, .account__switch p a.style2, .account__switch p a, .account__switch p, .account__social-btn, .account__check-remember label, .playbtn__thumb i, .playbtn__thumb svg, .paginations ul li a { font-weight: 400; } .accordion__button, .comment__action a, .service-details__team h5, .sidebar__categorie-body ul li.active span, .sidebar__categorie-body ul li.active a, .sidebar__categorie-body ul li:hover span, .sidebar__categorie-body ul li:hover a, .sidebar__recentpost-content p, .testimonial__author-designation p, .blog-details__segment-content h5, .service__item-content h5, .footer__app-content p, .subtitle--style5, .subtitle--style4 p, .home-showcase__title a { font-weight: 500; } .about--style3 .about__content ul li, .roadmap--style1 .roadmap__item-header span, .comment__author-info h6, .counter__item-inner h3, .sidebar__head h6, .blog__meta-tag, .blog__writer-designation p, .blog__writer-designation h6, .blog__content h5, .team--details .team__content > span, .team--details .team__content h3, .team--details .team__content h4, .team__item-authorinfo h6, .pricing__item-top h3 span, .service__item--style3 .service__item-content h5, .service__item--style2 .service__item-content h5, .feature--style1 .feature__item-content h6, .floating-content__item--style4 p, .trk-btn, .footer__end-copyright a, .form-label, .account__divider--style1 span, .account__check-forgot a, .contact__item-content p, .banner--style5 .banner__content-heading, .banner--style4 .banner__content p, .banner--style4 .banner__content h1, .page-header .breadcrumb-item, .playbtn__content { font-weight: 600; } .team__item-author--style2 .team__item-authorinfo h6, .floating-content__item--style2 p, .floating-content__item p.style2, .floating-content__item h3, .account__switch a, .banner--style3 .banner__counter-item h4 span, .banner--style3 .banner__counter-item h4, .banner__content-social p, .playbtn, .paginations ul li:not(:first-child, :last-child) a, .swiper-nav__btn i, .swiper-nav__btn svg, .cta-form .cta-btn { font-weight: 700; } /*=========<>=========*/ /*=========<>=========*/ /*-------<< margin properties >>-------*/ .about__content--style2 .about__content-details h5, .roadmap--style2 .roadmap__item-content h5, .roadmap--style1 .roadmap__item-content p, .sidebar__recentpost-content p, .sidebar__head h4, .sidebar__head h6, .sidebar__head h3, .testimonial__author-designation p, .testimonial__author-designation h6, .team--details .team__content h3, .pricing__list, .feature--style1 .feature__item-content h6, .floating-content__item p, .social, .footer__app-content span, .account__switch p, .contact__item-content p, .banner--style5 .banner__thumb2-inner p, .banner--style3 .banner__counter-item p, .banner--style3 .banner__btn-group, .section-header h2, .menu, ul, ol { margin-block-end: 0; } /*-------<< margin properties >>-------*/ .about--style3 .about__content ul, .floating-content__item h3, .form-label { margin-block-end: 5px; } .trk-btn span i, .trk-btn span svg, .trk-btn span img, .account__switch a { margin-inline-start: 5px; } .about--style3 .about__content ul li span img, .sidebar__categorie-body ul li a i, .pricing__list-item span, .trk-btn svg, .trk-btn i, .account__switch p i, .account__switch p svg { margin-inline-end: 5px; } /*-------<< margin properties >>-------*/ .banner--style5 .banner__content, .banner--style3 .banner__counter-item p, .banner__content { margin-block-start: 10px; } .comment__author-info h6, .error__content h2, .blog-details__content h3, .team--details .team__content .designation, .feature--style2 .feature__item-content p, .feature--style2 .feature__item-content h5, .footer__linklist-item:not(:last-child), .account__header h2, .section-header--style2 { margin-block-end: 10px; } .text-btn span, .text-btn i, .text-btn svg { margin-inline-start: 10px; } .text-btn.text-btn--small span, .account__switch:hover p i, .account__switch:hover p svg, .account__social-btn span, .cta-form .form-control--style3, .cta-form .form-control--style2 { margin-inline-end: 10px; } /*-------<< margin properties >>-------*/ .comment__body-inner, .account__check, .progress { margin-block-start: 15px; } .about--style3 .about__content ul li:not(:last-child), .nav--feature .nav-link:not(:last-child), .sidebar__categorie-body ul li, .pricing__list-item:not(:last-child), .banner--style5 .banner__content p, .banner__content-social p, .page-header__content h2 { margin-block-end: 15px; } .text-btn:hover i, .text-btn:hover svg { margin-inline-start: 15px; } /*-------<< margin properties >>-------*/ .about__content { margin-block-start: 20px; } .footer__end-links, .footer__end-copyright, .footer__links-tittle h6, .footer__about-logo img, .banner--style5 .banner__content-moto, .banner__content-moto, .banner__content-coin { margin-block-end: 20px; } /*-------<< margin properties >>-------*/ .about--style3 .about__content ul, .team--details .team__content .info, .footer__end-links { margin-block-start: 25px; } /*-------<< margin properties >>-------*/ .about--style3 .about__content a, .about__content-inner a, .testimonial__footer, .account__switch { margin-block-start: 30px; } .about--style3 .about__content-icon, .about__content:not(:last-child), .error__thumb img, .sidebar__recentpost-body ul li, .cta__subscribe p, .footer__about-moto, .contact__item:not(:last-child), .banner__content-coin--style2 { margin-block-end: 30px; } .sidebar__comment-item--reply, .header-bar { margin-inline-start: 30px; } .account__divider--style2 { margin-block: 30px; } /*-------<< margin properties >>-------*/ .error__content a, .account__divider--style1 { margin-block-start: 35px; } .blog-details__segment-item, .blog-details__content, .blog-details__thumb, .account__check { margin-block-end: 35px; } /*-------<< margin properties >>-------*/ .sidebar__comment, .blog-details__commentform, .banner--style4 .banner__content-btn { margin-block-start: 40px; } .counter__item-inner img, .sidebar__comment-item, .account__header, .contact__social h3, .banner__btn-group, .section-header { margin-block-end: 40px; } /*-------<< margin properties >>-------*/ /*-------<< margin properties >>-------*/ /*-------<< margin properties >>-------*/ /*-------<< margin properties >>-------*/ .contact__social { margin-block-end: 60px; } /*-------<< margin properties >>-------*/ /*-------<< margin properties >>-------*/ .banner--style5 .banner__testimonial-inner { margin-block-start: 70px; } /*-------<< margin properties >>-------*/ /*-------<< margin properties >>-------*/ /*-------<< margin properties >>-------*/ /*-------<< margin properties >>-------*/ /*-------<< margin properties >>-------*/ /*-------<< margin properties >>-------*/ /*------<< Paddings >>---------*/ .pricing__list, .social, ul, ol { padding-inline-start: 0; } .lightdark-switch .switch-btn { padding: 5px; } .footer__app-inner { padding-block-start: 5px; } .paginations ul li { padding-inline: 5px; } .footer__app-inner { padding-block-end: 10px; } .cta-form .form-control--style3, .cta-form .form-control--style2, .cta-form .form-control--style1 { padding-block: 10px; } .footer__app-inner { padding-inline: 10px; } .comment__body-inner, .sidebar__search form input, .team__item-author--style2 .team__item-authorinfo, .contact__item-thumb span { padding: 15px; } .sidebar__head h6, .sidebar__head h3 { padding-block-end: 15px; } .blog__meta, .floating-content__item, .header-wrapper, .cta-form .cta-btn { padding-block: 15px; } .service__item-inner { padding-inline: 15px; } .error__inner, .account__content--style1 { padding: 20px; } .accordion--style3 .accordion__button, .accordion--style1 .accordion__button, .service-details__faq { padding-block: 20px; } .accordion--style3 .accordion__body, .accordion--style3 .accordion__button, .counter__item-inner, .service-details__faq, .team__item-author--style2 .team__item-authorsocial, .floating-content__item, .cta-form .form-control--style3, .cta-form .form-control--style2, .cta-form .form-control--style1 { padding-inline: 20px; } .roadmap--style2 .roadmap__item-inner, .accordion--style2 .accordion__button, .nav--feature .nav-link, .sidebar__tags, .sidebar__social, .sidebar__categorie, .sidebar__recentpost, .sidebar__search, .testimonial__item--style2 .testimonial__item-inner, .service__item-thumb, .banner--style3 .banner__counter-item { padding: 25px; } .sidebar__comment-body, .sidebar__tags-body, .sidebar__categorie-body, .sidebar__recentpost-body, .blog__item-inner { padding-block-start: 25px; } .accordion--style2 .accordion__body, .testimonial__item--style3 .testimonial__item-content p, .blog-details__meta, .team__item-author--style2 .team__item-authorsocial { padding-block-end: 25px; } .blog-details__action-inner, .footer__end { padding-block: 25px; } .accordion--style2 .accordion__body, .blog__item-inner, .pricing__item-inner, .cta-form .cta-btn { padding-inline: 25px; } .service-details__item-inner, .sidebar__comment, .testimonial__item--style3 .testimonial__item-inner, .blog-details__commentform, .blog-details__item-inner, .account__content--style2, .banner--style5 .banner__thumb2-inner { padding: 30px; } .testimonial__item-content p, .blog__item-inner { padding-block-end: 30px; } .pricing__item-inner, .partner { padding-block: 30px; } .cta__newsletter-inner { padding-inline: 30px; } .blog__item--style2, .account__divider--style1 { padding-block-end: 35px; } .service__item-inner { padding-block: 35px; } .testimonial__item--style4 .testimonial__item-inner, .testimonial__item--style1 .testimonial__item-inner { padding: 40px; } .testimonial__slider, .testimonial__slider2 { padding-block-end: 40px; } .counter__item-inner, .pricing__item-middle { padding-block: 40px; } .cta__newsletter-inner { padding-block: 45px; } .partner--style2 { padding-block: 50px; } /*=========<>=========*/ /*=========<>========= .blog, removed this class form line no: 379 & 381*/ .about, .roadmap--style1 .roadmap__wrapper, .roadmap, .accordion__item, .service-details, .sidebar__categorie-body ul li span, .sidebar__categorie-body ul li a, .sidebar__recentpost-thumb, .sidebar, .story, .cta, .testimonial, .blog-details__thumb, .blog-details, .blog__thumb, .blog__item-inner, .team--details .team__thumb, .team__item-thumb, .team__item-inner, .pricing, .service, .feature--style1 .feature, .feature, .lightdark-switch .switch-btn, .preloader, .trk-btn, .footer, .account, .contact, .banner--style5, .banner--style4, .banner--style3, .banner--style2, .banner--style1, .page-header, .home-showcase__image, .blog__content h5, .feature--style2 .feature__item-content h5, .sidebar__recentpost-content p a, .blog__content p { overflow: hidden; } .about, .roadmap--style1 .roadmap__wrapper, .roadmap, .accordion__item, .service-details, .sidebar__categorie-body ul li span, .sidebar__categorie-body ul li a, .sidebar__recentpost-thumb, .sidebar, .story, .cta, .testimonial, .blog-details__thumb, .blog-details, .blog__thumb, .blog__item-inner, .team--details .team__thumb, .team__item-thumb, .team__item-inner, .pricing, .service, .feature--style1 .feature, .feature, .lightdark-switch .switch-btn, .preloader, .trk-btn, .footer, .account, .contact, .banner--style5, .banner--style4, .banner--style3, .banner--style2, .banner--style1, .page-header, .home-showcase__image, .blog__content h5, .feature--style2 .feature__item-content h5, .sidebar__recentpost-content p a, .blog__content p { overflow: hidden; } /*=========<>=========*/ /*=========<>=========*/ .header-bar { cursor: pointer; } /*=========<>=========*/ /*=========<< Height-Width property extends start>>=========*/ .accordion__button, .sidebar__recentpost-thumb img, .blog-details__thumb img, .blog__thumb img, .blog__bg-element img, .team--details .team__thumb img, .team__item-thumb img, input, textarea, .account__social-btn, .banner--style3 .banner__bg-element span, .banner--style3 .banner__bg-element img, .banner--style1 .banner__bg-element span, .banner--style1 .banner__bg-element img, .header-bar span, .header-section.header-fixed { width: 100%; } /*=========<< Height-Width property extends end>>=========*/ /*=========<< List Style property extends start>>=========*/ .social, ul, ol { list-style: none; } /*=========<< List Style property extends end>>=========*/ /* @@@@@@@@@@@@@ Extend Property CSS Writing Now @@@@@@@@@@@@@@ */ .sidebar__recentpost-content p a, .blog__content p { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } .blog__content h5, .feature--style2 .feature__item-content h5 { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; text-overflow: ellipsis; } .m-l0 { margin-left: 0px; } .p-l0 { padding-left: 0px; } .m-r0 { margin-right: 0px; } .p-r0 { padding-right: 0px; } .m-t0 { margin-top: 0px; } .p-t0 { padding-top: 0px; } .m-b0 { margin-bottom: 0px; } .p-b0 { padding-bottom: 0px; } .m-0 { margin: 0px; } .p-0 { padding: 0px; } .m-l10 { margin-left: 10px; } .p-l10 { padding-left: 10px; } .m-r10 { margin-right: 10px; } .p-r10 { padding-right: 10px; } .m-t10 { margin-top: 10px; } .p-t10 { padding-top: 10px; } .m-b10 { margin-bottom: 10px; } .p-b10 { padding-bottom: 10px; } .m-10 { margin: 10px; } .p-10 { padding: 10px; } .m-l20 { margin-left: 20px; } .p-l20 { padding-left: 20px; } .m-r20 { margin-right: 20px; } .p-r20 { padding-right: 20px; } .m-t20 { margin-top: 20px; } .p-t20 { padding-top: 20px; } .m-b20 { margin-bottom: 20px; } .p-b20 { padding-bottom: 20px; } .m-20 { margin: 20px; } .p-20 { padding: 20px; } .m-l30 { margin-left: 30px; } .p-l30 { padding-left: 30px; } .m-r30 { margin-right: 30px; } .p-r30 { padding-right: 30px; } .m-t30 { margin-top: 30px; } .p-t30 { padding-top: 30px; } .m-b30 { margin-bottom: 30px; } .p-b30 { padding-bottom: 30px; } .m-30 { margin: 30px; } .p-30 { padding: 30px; } .m-l50 { margin-left: 50px; } .p-l50 { padding-left: 50px; } .m-r50 { margin-right: 50px; } .p-r50 { padding-right: 50px; } .m-t50 { margin-top: 50px; } .p-t50 { padding-top: 50px; } .m-b50 { margin-bottom: 50px; } .p-b50 { padding-bottom: 50px; } .m-50 { margin: 50px; } .p-50 { padding: 50px; } /*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ /* Document ========================================================================== */ /** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in iOS. */ html { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ } /* Sections ========================================================================== */ /** * Remove the margin in all browsers. */ body { margin: 0; } /** * Render the `main` element consistently in IE. */ main { display: block; } /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Firefox, and Safari. */ h1 { font-size: 2em; } /* Grouping content ========================================================================== */ /** * 1. Add the correct box sizing in Firefox. * 2. Show the overflow in Edge and IE. */ hr { box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ pre { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /* Text-level semantics ========================================================================== */ /** * Remove the gray background on active links in IE 10. */ a { background-color: transparent; } /** * 1. Remove the bottom border in Chrome 57- * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */ abbr[title] { border-bottom: none; /* 1 */ text-decoration: underline; /* 2 */ text-decoration: underline dotted; /* 2 */ } /** * Add the correct font weight in Chrome, Edge, and Safari. */ b, strong { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ code, kbd, samp { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` elements from affecting the line height in * all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } /* Embedded content ========================================================================== */ /** * Remove the border on images inside links in IE 10. */ img { border-style: none; } /* Forms ========================================================================== */ /** * 1. Change the font styles in all browsers. * 2. Remove the margin in Firefox and Safari. */ button, input, optgroup, select, textarea { font-family: inherit; /* 1 */ font-size: 100%; /* 1 */ line-height: 1.15; /* 1 */ margin: 0; /* 2 */ } /** * Show the overflow in IE. * 1. Show the overflow in Edge. */ button, input { /* 1 */ overflow: visible; } /** * Remove the inheritance of text transform in Edge, Firefox, and IE. * 1. Remove the inheritance of text transform in Firefox. */ button, select { /* 1 */ text-transform: none; } /** * Correct the inability to style clickable types in iOS and Safari. */ button, [type=button], [type=reset], [type=submit] { -webkit-appearance: button; } /** * Remove the inner border and padding in Firefox. */ button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus styles unset by the previous rule. */ button:-moz-focusring, [type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring { outline: 1px dotted ButtonText; } /** * Correct the padding in Firefox. */ fieldset { padding: 0.35em 0.75em 0.625em; } /** * 1. Correct the text wrapping in Edge and IE. * 2. Correct the color inheritance from `fieldset` elements in IE. * 3. Remove the padding so developers are not caught out when they zero out * `fieldset` elements in all browsers. */ legend { box-sizing: border-box; /* 1 */ color: inherit; /* 2 */ display: table; /* 1 */ max-width: 100%; /* 1 */ padding: 0; /* 3 */ white-space: normal; /* 1 */ } /** * Add the correct vertical alignment in Chrome, Firefox, and Opera. */ progress { vertical-align: baseline; } /** * Remove the default vertical scrollbar in IE 10+. */ textarea { overflow: auto; } /** * 1. Add the correct box sizing in IE 10. * 2. Remove the padding in IE 10. */ [type=checkbox], [type=radio] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Chrome. */ [type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button { height: auto; } /** * 1. Correct the odd appearance in Chrome and Safari. * 2. Correct the outline style in Safari. */ [type=search] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Remove the inner padding in Chrome and Safari on macOS. */ [type=search]::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style clickable types in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* Interactive ========================================================================== */ /* * Add the correct display in Edge, IE 10+, and Firefox. */ details { display: block; } /* * Add the correct display in all browsers. */ summary { display: list-item; } /* Misc ========================================================================== */ /** * Add the correct display in IE 10+. */ template { display: none; } /** * Add the correct display in IE 10. */ [hidden] { display: none; } /** * Basic typography style for copy text */ body { background-color: var(--body-color); color: var(--text-color); font-size: 1rem; line-height: 1.625; font-family: "Open Sans", sans-serif; } h1, h2, h3, h4, h5, h6 { font-family: "Anek Telugu", sans-serif; color: var(--title-color); line-height: 1.25; font-weight: 600; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: inherit; font-family: inherit; } h1 { line-height: 1.067; } h1 { font-size: calc(1.5rem + 2.5714285714vw); } @media (min-width: 1400px) { h1 { font-size: 3.75rem; } } h2 { font-size: calc(1.425rem + 1.8vw); line-height: 56px; } @media (min-width: 1400px) { h2 { font-size: 3rem; } } h3 { font-size: calc(1.325rem + 0.7714285714vw); } @media (min-width: 1400px) { h3 { font-size: 2rem; } } h4 { font-size: calc(1.3rem + 0.5142857143vw); } @media (min-width: 1400px) { h4 { font-size: 1.75rem; } } h5 { font-size: calc(1.275rem + 0.2571428571vw); } @media (min-width: 1400px) { h5 { font-size: 1.5rem; } } h6 { font-size: 1.25rem; } img { max-width: 100%; height: auto; } a { color: var(--text-color); text-decoration: none; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } @media not all and (pointer: coarse) { a:hover { color: var(--brand-color); } } ul, ol { padding-left: 0; } /*===== keyframes for banner img ====*/ @-webkit-keyframes santa-ride { 0% { transform: translateX(0); } 100% { transform: translateX(100%); } } @-moz-keyframes santa-ride { 0% { transform: translateX(0); } 100% { transform: translateX(100%); } } @-ms-keyframes santa-ride { 0% { transform: translateX(0); } 100% { transform: translateX(100%); } } @-o-keyframes santa-ride { 0% { transform: translateX(0); } 100% { transform: translateX(100%); } } @keyframes santa-ride { 0% { transform: translateX(0); } 100% { transform: translateX(100%); } } @-webkit-keyframes floating { 0% { transform: translateY(30px); } 100% { transform: translateY(0px); } } @-moz-keyframes floating { 0% { transform: translateY(30px); } 100% { transform: translateY(0px); } } @-ms-keyframes floating { 0% { transform: translateY(30px); } 100% { transform: translateY(0px); } } @-o-keyframes floating { 0% { transform: translateY(30px); } 100% { transform: translateY(0px); } } @keyframes floating { 0% { transform: translateY(30px); } 100% { transform: translateY(0px); } } @-webkit-keyframes rotate { to { transform: rotate(360deg); } } @-moz-keyframes rotate { to { transform: rotate(360deg); } } @-ms-keyframes rotate { to { transform: rotate(360deg); } } @-o-keyframes rotate { to { transform: rotate(360deg); } } @keyframes rotate { to { transform: rotate(360deg); } } @-webkit-keyframes rotateX { to { transform: rotateX(360deg); } } @-moz-keyframes rotateX { to { transform: rotateX(360deg); } } @-ms-keyframes rotateX { to { transform: rotateX(360deg); } } @-o-keyframes rotateX { to { transform: rotateX(360deg); } } @keyframes rotateX { to { transform: rotateX(360deg); } } @-webkit-keyframes rotateY { to { transform: rotateY(360deg); } } @-moz-keyframes rotateY { to { transform: rotateY(360deg); } } @-ms-keyframes rotateY { to { transform: rotateY(360deg); } } @-o-keyframes rotateY { to { transform: rotateY(360deg); } } @keyframes rotateY { to { transform: rotateY(360deg); } } @-webkit-keyframes rotateZ { to { transform: rotateZ(360deg); } } @-moz-keyframes rotateZ { to { transform: rotateZ(360deg); } } @-ms-keyframes rotateZ { to { transform: rotateZ(360deg); } } @-o-keyframes rotateZ { to { transform: rotateZ(360deg); } } @keyframes rotateZ { to { transform: rotateZ(360deg); } } @-webkit-keyframes zoom { 0% { transform: scale(1); } 100% { transform: scale(0.8); } } @-moz-keyframes zoom { 0% { transform: scale(1); } 100% { transform: scale(0.8); } } @-ms-keyframes zoom { 0% { transform: scale(1); } 100% { transform: scale(0.8); } } @-o-keyframes zoom { 0% { transform: scale(1); } 100% { transform: scale(0.8); } } @keyframes zoom { 0% { transform: scale(1); } 100% { transform: scale(0.8); } } @-webkit-keyframes left-right { 0% { transform: translateX(30px); } 100% { transform: translateX(0px); } } @-moz-keyframes left-right { 0% { transform: translateX(30px); } 100% { transform: translateX(0px); } } @-ms-keyframes left-right { 0% { transform: translateX(30px); } 100% { transform: translateX(0px); } } @-o-keyframes left-right { 0% { transform: translateX(30px); } 100% { transform: translateX(0px); } } @keyframes left-right { 0% { transform: translateX(30px); } 100% { transform: translateX(0px); } } @-webkit-keyframes fade { 0% { opacity: 1; } 100% { opacity: 0; } } @-moz-keyframes fade { 0% { opacity: 1; } 100% { opacity: 0; } } @-ms-keyframes fade { 0% { opacity: 1; } 100% { opacity: 0; } } @-o-keyframes fade { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes fade { 0% { opacity: 1; } 100% { opacity: 0; } } @-webkit-keyframes light { 10%, 90% { opacity: 0.5; } 20%, 80% { opacity: 0.7; } 30%, 50%, 70% { opacity: 0.9; } 40%, 60% { opacity: 1; } } @-moz-keyframes light { 10%, 90% { opacity: 0.5; } 20%, 80% { opacity: 0.7; } 30%, 50%, 70% { opacity: 0.9; } 40%, 60% { opacity: 1; } } @-ms-keyframes light { 10%, 90% { opacity: 0.5; } 20%, 80% { opacity: 0.7; } 30%, 50%, 70% { opacity: 0.9; } 40%, 60% { opacity: 1; } } @-o-keyframes light { 10%, 90% { opacity: 0.5; } 20%, 80% { opacity: 0.7; } 30%, 50%, 70% { opacity: 0.9; } 40%, 60% { opacity: 1; } } @keyframes light { 10%, 90% { opacity: 0.5; } 20%, 80% { opacity: 0.7; } 30%, 50%, 70% { opacity: 0.9; } 40%, 60% { opacity: 1; } } @keyframes fadeInUp { from { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes fadeInDown { from { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .bg-image { background-repeat: no-repeat; } .of-hidden { overflow: hidden; } .scrollToTop { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; position: fixed; bottom: 5% !important; right: 5% !important; z-index: 9 !important; width: 40px !important; height: 40px !important; line-height: 40px; text-align: center; border-radius: 5px !important; color: #0C263A; } .scrollToTop--style1 { background-color: var(--brand-color) !important; } .scrollToTop--style2 { background-color: var(--tertiary-color4) !important; } .scrollToTop--style2 i, .scrollToTop--style2 svg { color: var(--bg-white); } .scrollToTop:hover { -webkit-transform: translateY(-5px); -moz-transform: translateY(-5px); -ms-transform: translateY(-5px); -o-transform: translateY(-5px); transform: translateY(-5px); color: #0C263A; } .cta-form { max-width: 500px; } @media (min-width: 576px) and (max-width: 575px) { .cta-form { max-width: 600px; } } @media (max-width: 767px) { .cta-form--style2 .cta-form__inner { justify-content: center; } } .cta-form .form-control { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; background-color: var(--tertiary-color); border: 1px solid var(--form-border); z-index: 1; } .cta-form .form-control ::placeholder { opacity: 999; } .cta-form .form-control:focus { box-shadow: none; border-color: var(--brand-color); } .cta-form .form-control--style1 { border-top-left-radius: 8px; border-bottom-left-radius: 8px; } @media (min-width: 576px) { .cta-form .form-control--style1 { padding: 16px 20px; } } .cta-form .form-control--style2 { background-color: var(--bg-white); border-color: var(--bg-white); color: #0C263A; } .cta-form .form-control--style2::placeholder { color: #6B777F; } @media (min-width: 576px) { .cta-form .form-control--style2 { max-width: 60%; padding: 11px 20px; } } @media (min-width: 992px) { .cta-form .form-control--style2 { max-width: 60%; padding: 16px 20px; } } @media (min-width: 992px) { .cta-form .form-control--style2 { max-width: 70%; } } .cta-form .form-control--style3 { background-color: var(--bg-white); border-color: var(--bg-white); color: #0C263A; } .cta-form .form-control--style3::placeholder { color: #6B777F; } .cta-form .form-control--style3:focus { box-shadow: none; border-color: var(--bg-color-11); } @media (min-width: 576px) { .cta-form .form-control--style3 { max-width: 60%; padding: 11px 20px; } } @media (min-width: 992px) { .cta-form .form-control--style3 { max-width: 60%; padding: 16px 20px; } } @media (min-width: 992px) { .cta-form .form-control--style3 { max-width: 70%; } } .cta-form .cta-btn { border-top-right-radius: 8px !important; border-bottom-right-radius: 8px !important; background: var(--brand-color); border-color: var(--brand-color); font-size: 1rem; } @media (min-width: 576px) { .cta-form .cta-btn { padding: 16px 32px; } } .form-pass__ctoggle, .form-pass__toggle { background: none; border: none; color: var(--text-color); font-weight: 600; right: 0.75em; top: 53px; z-index: 9; } .swiper-nav { gap: 15px; } @media (max-width: 767px) { .swiper-nav { margin-block-start: 15px; } } .swiper-nav__btn { width: 40px; height: 40px; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; border: 1px solid var(--border-color); border-radius: 99px; background-color: var(--wh-color); } @media (min-width: 576px) { .swiper-nav__btn { width: 46px; height: 46px; } } .swiper-nav__btn i, .swiper-nav__btn svg { font-size: 1.125rem; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; color: var(--title-color); } .swiper-nav__btn.active, .swiper-nav__btn:hover { background-color: var(--brand-color); border-color: var(--brand-color); } .swiper-nav__btn.active i, .swiper-nav__btn.active svg, .swiper-nav__btn:hover i, .swiper-nav__btn:hover svg { color: var(--title-color); } .swiper-nav__btn--style3 { border: 1px solid var(--tertiary-color4); } .swiper-nav__btn--style3.active, .swiper-nav__btn--style3:hover { background-color: var(--tertiary-color4); border-color: var(--tertiary-color4); } .swiper-nav__btn--style3.active i, .swiper-nav__btn--style3.active svg, .swiper-nav__btn--style3:hover i, .swiper-nav__btn--style3:hover svg { color: #FFFFFF; } .swiper-nav--style2 .swiper-nav__btn { background-color: var(--arrow-color1); border-color: var(--arrow-color1); } @media (min-width: 768px) { .swiper-nav--style2 .swiper-nav__btn { display: block; } } .swiper-nav--style2 .swiper-nav__btn i, .swiper-nav--style2 .swiper-nav__btn svg { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; color: var(--title-color); } .swiper-nav--style2 .swiper-nav__btn-prev { content: ""; top: 36%; left: -23px; z-index: 1; } .swiper-nav--style2 .swiper-nav__btn-prev i, .swiper-nav--style2 .swiper-nav__btn-prev svg { color: var(--title-color); } .swiper-nav--style2 .swiper-nav__btn-next { content: ""; top: 36%; right: -23px; z-index: 1; } .swiper-nav--style2 .swiper-nav__btn-next i, .swiper-nav--style2 .swiper-nav__btn-next svg { color: var(--bg-white); } .swiper-nav--style2 .swiper-nav__btn.active, .swiper-nav--style2 .swiper-nav__btn:hover { background-color: var(--secondary-color); border-color: var(--secondary-color); } .swiper-nav--style2 .swiper-nav__btn.active i, .swiper-nav--style2 .swiper-nav__btn.active svg, .swiper-nav--style2 .swiper-nav__btn:hover i, .swiper-nav--style2 .swiper-nav__btn:hover svg { color: var(--bg-white); } .progress-bar { background-color: #5370FF !important; } .progress-bar--style2 { background-color: #6084E0 !important; } .paginations { background-color: var(--wh-color); box-shadow: 0px -16px 48px rgba(6, 35, 63, 0.03), 0px 16px 48px rgba(6, 35, 63, 0.03); border-radius: 8px; padding: 12px 16px; max-width: 450px; margin: 0 auto; margin-top: 40px; } .paginations ul li a { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; font-size: 1rem; width: 70px; height: 36px; color: var(--text-color); opacity: 0.5; } .paginations ul li a.active, .paginations ul li a:hover { opacity: 1; color: var(--brand-color); } .paginations ul li a.active i, .paginations ul li a.active svg, .paginations ul li a:hover i, .paginations ul li a:hover svg { color: var(--brand-color); } .paginations ul li:not(:first-child, :last-child) a { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; width: 36px; height: 36px; background: var(--wh-color); color: var(--title-color); z-index: 1; border-radius: 4px; opacity: 1; } .paginations ul li:not(:first-child, :last-child) a.active, .paginations ul li:not(:first-child, :last-child) a:hover { color: var(--brand-color); background-color: var(--pagination-bg-color); } .paginations ul li:not(:first-child, :last-child) a.dot { color: var(--brand-color); font-weight: 700; } .paginations ul li:not(:first-child, :last-child) a.dot:hover { color: var(--brand-color); } .playbtn { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; font-family: "Open Sans", sans-serif; color: var(--title-color); gap: 10px; } .playbtn--style2 { color: var(--bg-white); } .playbtn__thumb { width: 46px; height: 46px; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; border-radius: 99px; background-color: #0A4FD5; display: grid; place-items: center; } @media (min-width: 576px) { .playbtn__thumb { width: 50px; height: 50px; } } .playbtn__thumb i, .playbtn__thumb svg { font-size: 1.25rem; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; margin-inline-start: 3px; color: var(--bg-white); } .playbtn__content { font-size: 1rem; color: var(--bg-white); } @media (min-width: 992px) { .playbtn__content { display: block; } } .playbtn:hover .playbtn { color: var(--brand-color); } .playbtn:hover .playbtn__thumb i, .playbtn:hover .playbtn__thumb svg { color: var(--brand-color); } .playbtn:hover .playbtn__content { color: var(--brand-color); } @media (min-width: 1200px) { .container { max-width: 1170px; } } @media (min-width: 1200px) { .home-4 .container, .home-5 .container { max-width: 1320px; } } @media (min-width: 768px) { .offset-md-6 { margin-inline-start: 50%; } } .accordion-item { border: none; border-radius: 0; background-color: transparent; } .accordion-body { padding: 0px; background-color: transparent; } .gradient-text--brand1 { background: -webkit-linear-gradient(var(--brand-color), var(--secondary-color)); -webkit-background-clip: text; -moz-background-clip: text; -ms-background-clip: text; -o-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; -moz-text-fill-color: transparent; -ms-text-fill-color: transparent; -o-text-fill-color: transparent; text-fill-color: transparent; } .bg-body-color { background-color: var(--body-color); } .bg-color { background: linear-gradient(152deg, var(--bg-color-trans) 0%, var(--bg-color) 100%); } .bg-grad-color { background: linear-gradient(219deg, var(--bg-grad-color-trans) 0%, var(--bg-grad-color) 100%); } .bg-color-1 { background-color: var(--secondary-color); } .bg-color-2 { background-color: var(--tertiary-color); } .bg-color-3 { background-color: var(--bg-color-3); } .bg-color-4 { background: var(--bg-color-4); } .bg-color-5 { background-image: var(--bg-color-5); } .section-bg-color { background-color: var(--section-bg-color); } .sec-bg-color2 { background-color: var(--sec-bg-color-2); } .feature-bg-color { background-color: var(--feature-bg-color); } .bg-color-7 { background-color: var(--bg-color-7); } .bg-color-8 { background-color: var(--bg-color-8); } .bg-color-9 { background-color: var(--bg-color-3); } .bg-color-10 { background-color: var(--bg-color-9); } .mt-minus-5 { margin-block-start: -5px; } .padding-top { padding-block-start: 80px; } @media (min-width: 992px) { .padding-top { padding-block-start: 120px; } } .padding-top--style2 { padding-block-start: 80px; } @media (min-width: 992px) { .padding-top--style2 { padding-block-start: 40px; } } .padding-bottom { padding-block-end: 80px; } @media (min-width: 992px) { .padding-bottom { padding-block-end: 120px; } } .padding-bottom-style2 { padding-block-end: 20px; } @media (min-width: 992px) { .padding-bottom-style2 { padding-block-end: 80px; } } h1, h2, h3, h4, h5, h6 { color: var(--title-color); } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: inherit; } .subtitle { font-size: 1.125rem; text-transform: capitalize; font-weight: bold; color: var(--title-color); } .bg--cover { background-repeat: no-repeat; background-size: cover; background-position: center; } .bg--full { background-repeat: no-repeat; background-size: 100% 100%; background-position: center; } .bg--defult { background-repeat: no-repeat; } .d-block { width: 100%; } .br-16 { border-radius: 16px; } /*=========<>=========*/ /*-------<< margin properties >>-------*/ .m-10 { margin: 10px !important; } .mt-10 { margin-block-start: 10px !important; } .mb-10 { margin-block-end: 10px !important; } .ms-10 { margin-inline-start: 10px !important; } .me-10 { margin-inline-end: 10px !important; } .my-10 { margin-block: 10px !important; } .mx-10 { margin-inline: 10px !important; } /*-------<< margin properties >>-------*/ .m-15 { margin: 15px !important; } .mt-15 { margin-block-start: 15px !important; } .mb-15 { margin-block-end: 15px !important; } .ms-15 { margin-inline-start: 15px !important; } .me-15 { margin-inline-end: 15px !important; } .my-15 { margin-block: 15px !important; } .mx-15 { margin-inline: 15px !important; } /*-------<< margin properties >>-------*/ .m-20 { margin: 20px !important; } .mt-20 { margin-block-start: 20px !important; } .mb-20, .subtitle { margin-block-end: 20px !important; } .ms-20 { margin-inline-start: 20px !important; } .me-20 { margin-inline-end: 20px !important; } .my-20 { margin-block: 20px !important; } .mx-20 { margin-inline: 20px !important; } /*-------<< margin properties >>-------*/ .m-25 { margin: 25px !important; } .mt-25 { margin-block-start: 25px !important; } .mb-25 { margin-block-end: 25px !important; } .ms-25 { margin-inline-start: 25px !important; } .me-25 { margin-inline-end: 25px !important; } .my-25 { margin-block: 25px !important; } .mx-25 { margin-inline: 25px !important; } /*-------<< margin properties >>-------*/ .m-30 { margin: 30px !important; } .mt-30 { margin-block-start: 30px !important; } .mb-30 { margin-block-end: 30px !important; } .ms-30 { margin-inline-start: 30px !important; } .me-30 { margin-inline-end: 30px !important; } .my-30 { margin-block: 30px !important; } .mx-30 { margin-inline: 30px !important; } /*-------<< margin properties >>-------*/ .m-35 { margin: 35px !important; } .mt-35 { margin-block-start: 35px !important; } .mb-35 { margin-block-end: 35px !important; } .ms-35 { margin-inline-start: 35px !important; } .me-35 { margin-inline-end: 35px !important; } .my-35 { margin-block: 35px !important; } .mx-35 { margin-inline: 35px !important; } /*-------<< margin properties >>-------*/ .m-40 { margin: 40px !important; } .mt-40 { margin-block-start: 40px !important; } .mb-40 { margin-block-end: 40px !important; } .ms-40 { margin-inline-start: 40px !important; } .me-40 { margin-inline-end: 40px !important; } .my-40 { margin-block: 40px !important; } .mx-40 { margin-inline: 40px !important; } /*-------<< margin properties >>-------*/ .m-45 { margin: 45px !important; } .mt-45 { margin-block-start: 45px !important; } .mb-45 { margin-block-end: 45px !important; } .ms-45 { margin-inline-start: 45px !important; } .me-45 { margin-inline-end: 45px !important; } .my-45 { margin-block: 45px !important; } .mx-45 { margin-inline: 45px !important; } /*-------<< margin properties >>-------*/ .m-50 { margin: 50px !important; } .mt-50 { margin-block-start: 50px !important; } .mb-50 { margin-block-end: 50px !important; } .ms-50 { margin-inline-start: 50px !important; } .me-50 { margin-inline-end: 50px !important; } .my-50 { margin-block: 50px !important; } .mx-50 { margin-inline: 50px !important; } /*-------<< margin properties >>-------*/ .m-55 { margin: 55px !important; } .mt-55 { margin-block-start: 55px !important; } .mb-55 { margin-block-end: 55px !important; } .ms-55 { margin-inline-start: 55px !important; } .me-55 { margin-inline-end: 55px !important; } .my-55 { margin-block: 55px !important; } .mx-55 { margin-inline: 55px !important; } /*-------<< margin properties >>-------*/ .m-60 { margin: 60px !important; } .mt-60 { margin-block-start: 60px !important; } .mb-60 { margin-block-end: 60px !important; } .ms-60 { margin-inline-start: 60px !important; } .me-60 { margin-inline-end: 60px !important; } .my-60 { margin-block: 60px !important; } .mx-60 { margin-inline: 60px !important; } /*-------<< margin properties >>-------*/ .m-65 { margin: 65px !important; } .mt-65 { margin-block-start: 65px !important; } .mb-65 { margin-block-end: 65px !important; } .ms-65 { margin-inline-start: 65px !important; } .me-65 { margin-inline-end: 65px !important; } .my-65 { margin-block: 65px !important; } .mx-65 { margin-inline: 65px !important; } /*-------<< margin properties >>-------*/ .m-70 { margin: 70px !important; } .mt-70 { margin-block-start: 70px !important; } .mb-70 { margin-block-end: 70px !important; } .ms-70 { margin-inline-start: 70px !important; } .me-70 { margin-inline-end: 70px !important; } .my-70 { margin-block: 70px !important; } .mx-70 { margin-inline: 70px !important; } /*-------<< margin properties >>-------*/ .m-75 { margin: 75px !important; } .mt-75 { margin-block-start: 75px !important; } .mb-75 { margin-block-end: 75px !important; } .ms-75 { margin-inline-start: 75px !important; } .me-75 { margin-inline-end: 75px !important; } .my-75 { margin-block: 75px !important; } .mx-75 { margin-inline: 75px !important; } /*-------<< margin properties >>-------*/ .m-80 { margin: 80px !important; } .mt-80 { margin-block-start: 80px !important; } .mb-80 { margin-block-end: 80px !important; } .ms-80 { margin-inline-start: 80px !important; } .me-80 { margin-inline-end: 80px !important; } .my-80 { margin-block: 80px !important; } .mx-80 { margin-inline: 80px !important; } /*-------<< margin properties >>-------*/ .m-85 { margin: 85px !important; } .mt-85 { margin-block-start: 85px !important; } .mb-85 { margin-block-end: 85px !important; } .ms-85 { margin-inline-start: 85px !important; } .me-85 { margin-inline-end: 85px !important; } .my-85 { margin-block: 85px !important; } .mx-85 { margin-inline: 85px !important; } /*-------<< margin properties >>-------*/ .m-90 { margin: 90px !important; } .mt-90 { margin-block-start: 90px !important; } .mb-90 { margin-block-end: 90px !important; } .ms-90 { margin-inline-start: 90px !important; } .me-90 { margin-inline-end: 90px !important; } .my-90 { margin-block: 90px !important; } .mx-90 { margin-inline: 90px !important; } /*-------<< margin properties >>-------*/ .m-95 { margin: 95px !important; } .mt-95 { margin-block-start: 95px !important; } .mb-95 { margin-block-end: 95px !important; } .ms-95 { margin-inline-start: 95px !important; } .me-95 { margin-inline-end: 95px !important; } .my-95 { margin-block: 95px !important; } .mx-95 { margin-inline: 95px !important; } /*-------<< margin properties >>-------*/ .m-100 { margin: 100px !important; } .mt-100 { margin-block-start: 100px !important; } .mb-100 { margin-block-end: 100px !important; } .ms-100 { margin-inline-start: 100px !important; } .me-100 { margin-inline-end: 100px !important; } .my-100 { margin-block: 100px !important; } .mx-100 { margin-inline: 100px !important; } /*------<< Paddings >>---------*/ .p-10 { padding: 10px !important; } .pt-10 { padding-block-start: 10px !important; } .pb-10 { padding-block-end: 10px !important; } .ps-10 { padding-inline-start: 10px !important; } .pe-10 { padding-inline-end: 10px !important; } .py-10 { padding-block: 10px !important; } .px-10 { padding-inline: 10px !important; } .p-15 { padding: 15px !important; } .pt-15 { padding-block-start: 15px !important; } .pb-15 { padding-block-end: 15px !important; } .ps-15 { padding-inline-start: 15px !important; } .pe-15 { padding-inline-end: 15px !important; } .py-15 { padding-block: 15px !important; } .px-15 { padding-inline: 15px !important; } .p-20 { padding: 20px !important; } .pt-20 { padding-block-start: 20px !important; } .pb-20 { padding-block-end: 20px !important; } .ps-20 { padding-inline-start: 20px !important; } .pe-20 { padding-inline-end: 20px !important; } .py-20 { padding-block: 20px !important; } .px-20 { padding-inline: 20px !important; } .p-25 { padding: 25px !important; } .pt-25 { padding-block-start: 25px !important; } .pb-25 { padding-block-end: 25px !important; } .ps-25 { padding-inline-start: 25px !important; } .pe-25 { padding-inline-end: 25px !important; } .py-25 { padding-block: 25px !important; } .px-25 { padding-inline: 25px !important; } .p-30 { padding: 30px !important; } .pt-30 { padding-block-start: 30px !important; } .pb-30 { padding-block-end: 30px !important; } .ps-30 { padding-inline-start: 30px !important; } .pe-30 { padding-inline-end: 30px !important; } .py-30 { padding-block: 30px !important; } .px-30 { padding-inline: 30px !important; } .p-35 { padding: 35px !important; } .pt-35 { padding-block-start: 35px !important; } .pb-35 { padding-block-end: 35px !important; } .ps-35 { padding-inline-start: 35px !important; } .pe-35 { padding-inline-end: 35px !important; } .py-35 { padding-block: 35px !important; } .px-35 { padding-inline: 35px !important; } .p-40 { padding: 40px !important; } .pt-40 { padding-block-start: 40px !important; } .pb-40 { padding-block-end: 40px !important; } .ps-40 { padding-inline-start: 40px !important; } .pe-40 { padding-inline-end: 40px !important; } .py-40 { padding-block: 40px !important; } .px-40 { padding-inline: 40px !important; } .p-45 { padding: 45px !important; } .pt-45 { padding-block-start: 45px !important; } .pb-45 { padding-block-end: 45px !important; } .ps-45 { padding-inline-start: 45px !important; } .pe-45 { padding-inline-end: 45px !important; } .py-45 { padding-block: 45px !important; } .px-45 { padding-inline: 45px !important; } .p-50 { padding: 50px !important; } .pt-50 { padding-block-start: 50px !important; } .pb-50 { padding-block-end: 50px !important; } .ps-50 { padding-inline-start: 50px !important; } .pe-50 { padding-inline-end: 50px !important; } .py-50 { padding-block: 50px !important; } .px-50 { padding-inline: 50px !important; } .p-55 { padding: 55px !important; } .pt-55 { padding-block-start: 55px !important; } .pb-55 { padding-block-end: 55px !important; } .ps-55 { padding-inline-start: 55px !important; } .pe-55 { padding-inline-end: 55px !important; } .py-55 { padding-block: 55px !important; } .px-55 { padding-inline: 55px !important; } .p-60 { padding: 60px !important; } .pt-60 { padding-block-start: 60px !important; } .pb-60 { padding-block-end: 60px !important; } .ps-60 { padding-inline-start: 60px !important; } .pe-60 { padding-inline-end: 60px !important; } .py-60 { padding-block: 60px !important; } .px-60 { padding-inline: 60px !important; } .p-65 { padding: 65px !important; } .pt-65 { padding-block-start: 65px !important; } .pb-65 { padding-block-end: 65px !important; } .ps-65 { padding-inline-start: 65px !important; } .pe-65 { padding-inline-end: 65px !important; } .py-65 { padding-block: 65px !important; } .px-65 { padding-inline: 65px !important; } .p-70 { padding: 70px !important; } .pt-70 { padding-block-start: 70px !important; } .pb-70 { padding-block-end: 70px !important; } .ps-70 { padding-inline-start: 70px !important; } .pe-70 { padding-inline-end: 70px !important; } .py-70 { padding-block: 70px !important; } .px-70 { padding-inline: 70px !important; } .p-75 { padding: 75px !important; } .pt-75 { padding-block-start: 75px !important; } .pb-75 { padding-block-end: 75px !important; } .ps-75 { padding-inline-start: 75px !important; } .pe-75 { padding-inline-end: 75px !important; } .py-75 { padding-block: 75px !important; } .px-75 { padding-inline: 75px !important; } .p-80 { padding: 80px !important; } .pt-80 { padding-block-start: 80px !important; } .pb-80 { padding-block-end: 80px !important; } .ps-80 { padding-inline-start: 80px !important; } .pe-80 { padding-inline-end: 80px !important; } .py-80 { padding-block: 80px !important; } .px-80 { padding-inline: 80px !important; } .p-85 { padding: 85px !important; } .pt-85 { padding-block-start: 85px !important; } .pb-85 { padding-block-end: 85px !important; } .ps-85 { padding-inline-start: 85px !important; } .pe-85 { padding-inline-end: 85px !important; } .py-85 { padding-block: 85px !important; } .px-85 { padding-inline: 85px !important; } .p-90 { padding: 90px !important; } .pt-90 { padding-block-start: 90px !important; } .pb-90 { padding-block-end: 90px !important; } .ps-90 { padding-inline-start: 90px !important; } .pe-90 { padding-inline-end: 90px !important; } .py-90 { padding-block: 90px !important; } .px-90 { padding-inline: 90px !important; } .p-95 { padding: 95px !important; } .pt-95 { padding-block-start: 95px !important; } .pb-95 { padding-block-end: 95px !important; } .ps-95 { padding-inline-start: 95px !important; } .pe-95 { padding-inline-end: 95px !important; } .py-95 { padding-block: 95px !important; } .px-95 { padding-inline: 95px !important; } .p-100 { padding: 100px !important; } .pt-100 { padding-block-start: 100px !important; } .pb-100 { padding-block-end: 100px !important; } .ps-100 { padding-inline-start: 100px !important; } .pe-100 { padding-inline-end: 100px !important; } .py-100 { padding-block: 100px !important; } .px-100 { padding-inline: 100px !important; } /*=========<>=========*/ .header-section { width: 100%; z-index: 99; } .header-section.header-fixed { -webkit-animation: fadeInDown 0.5s; -moz-animation: fadeInDown 0.5s; -ms-animation: fadeInDown 0.5s; -o-animation: fadeInDown 0.5s; animation: fadeInDown 0.5s; position: fixed; top: 0; left: 0; box-shadow: 0px 5px 10px -5px rgba(0, 0, 0, 0.3); z-index: 999; } .header-section--style1 { background-color: var(--bg-color-3); border-bottom: 1px solid var(--header-border-color); } .header-section--style1.header-fixed { border-bottom: none; background-color: var(--bg-color-3); } .header-section--style2 { content: ""; width: 100%; } .header-section--style2.header-fixed { background-color: var(--wh-color); } .header-section--style3 { content: ""; width: 100%; } .header-section--style3.header-fixed { background-color: var(--header-bg-color); } .header-section--style4 { content: ""; width: 100%; border-bottom: 1px solid var(--header-border-color2); } .header-section--style4.header-fixed { background-color: var(--header-bg-color2); } .header-section--style5 { content: ""; width: 100%; } .header-section--style5.header-fixed { background-color: var(--bg-color-10); } @media (min-width: 576px) { .header-wrapper { position: relative; } } @media (min-width: 992px) { .header-wrapper { padding-block: 26px; } } .header-wrapper .logo a img { max-width: 100%; } @media (max-width: 575px) { .header-wrapper .logo { max-width: 130px; } } @media (max-width: 1199px) and (min-width: 992px) { .header-wrapper .logo { width: 200px; } } .header-wrapper .menu-area .header-btn { column-gap: 20px; } @media (max-width: 767px) { .header-wrapper .menu-area .header-btn { display: none; } } .header-wrapper .menu-area .header-btn .switch-btn { max-width: 30px; cursor: pointer; } .header-wrapper--style2 { border-bottom: 1px solid var(--border-color-9); } .menu { column-gap: 10px; } .menu > li > a { font-size: 1rem; padding: 15px 22px; text-transform: capitalize; font-family: "Open Sans", sans-serif; color: var(--title-color); font-weight: 500; } .menu > li > a span { font-size: 0.75rem; padding: 1px 5px; color: var(--bg-white); border-radius: 4px; } .menu > li > a span.style1 { background-color: var(--brand-color); } .menu > li > a span.style2 { background-color: var(--form-focus-color); } .menu > li > a i { margin-right: 5px; } .menu > li > a:after { right: 11px; } .menu > li > a::before { right: 15px; } .menu--style1 li a { color: var(--title-color); } .menu--style2 li a { color: var(--bg-white); } @media (min-width: 992px) { .menu li { position: relative; } .menu li .submenu { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; -webkit-transform: translateY(35px); -moz-transform: translateY(35px); -ms-transform: translateY(35px); -o-transform: translateY(35px); transform: translateY(35px); position: absolute; top: 100%; left: 0; z-index: 9; background: var(--wh-color); width: 220px; padding: 0; opacity: 0; visibility: hidden; box-shadow: 0 0 10px rgba(0, 0, 0, 0.18); border-radius: 0.4rem; } .menu li .submenu li { padding: 0; } .menu li .submenu li a { font-size: 1rem; padding: 10px 20px; text-transform: capitalize; font-family: "Open Sans", sans-serif; display: flex; align-items: center; justify-content: space-between; font-weight: 400; color: var(--title-color); border-bottom: 1px solid rgba(var(--wh-color), 0.05); border-radius: 0.3rem; transition: all 0.3s ease-out; } .menu li .submenu li a span { font-size: 0.75rem; padding: 1px 5px; color: var(--bg-white); border-radius: 4px; } .menu li .submenu li a span.style1 { background-color: var(--brand-color); color: #0C263A; } .menu li .submenu li a span.style2 { background-color: #000; } .menu li .submenu li a:hover, .menu li .submenu li a.active { background: var(--wh-color); padding-left: 22px; color: var(--brand-color); } .menu li .submenu li a:hover:after, .menu li .submenu li a:hover:before, .menu li .submenu li a.active:after, .menu li .submenu li a.active:before { background: var(--wh-color); } .menu li .submenu li:last-child a { border-bottom: none; } .menu li .submenu li .submenu { left: 100%; top: 0; } .menu li:hover > .submenu { -webkit-transform: translateY(15px); -ms-transform: translateY(15px); transform: translateY(15px); opacity: 1; visibility: visible; } } @media (min-width: 992px) and (max-width: 1199px) { .menu li a { padding: 10px 16px; } } @media (max-width: 991px) { .menu { width: 100%; position: absolute; top: 100%; left: 0; overflow: auto; max-height: 400px; -webkit-transition: all ease 0.3s; -moz-transition: all ease 0.3s; transition: all ease 0.3s; -webkit-transform: scaleY(0); -ms-transform: scaleY(0); transform: scaleY(0); transform-origin: top; z-index: 999; background: rgba(var(--wh-color), 0.99); -webkit-backdrop-filter: blur(20px); } .menu li { width: 100%; padding: 0; } .menu li a { display: block; padding: 10px 25px; font-size: 15px; text-transform: capitalize; border-top: 1px solid var(--border-color-8); color: var(--title-color); } .menu li a:hover { background: rgba(var(--wh-color), 0.6); } .menu li a span { font-size: 0.75rem; padding: 1px 5px; color: var(--bg-white); border-radius: 4px; } .menu li a span.style1 { background-color: var(--brand-color); } .menu li a span.style2 { background-color: var(--form-focus-color); } .menu li .submenu { padding-inline-start: 20px; display: none; } .menu li .submenu li { width: 100%; } .menu li .submenu li a { font-family: "Anek Telugu", sans-serif; display: flex; justify-content: space-between; font-weight: 400; } .menu.active { -webkit-transform: scaleY(1); -ms-transform: scaleY(1); transform: scaleY(1); box-shadow: 0 5px 10px -3px rgba(0, 0, 0, 0.1); background-color: var(--wh-color); } } .header-bar { width: 25px; height: 20px; } @media (min-width: 768px) { .header-bar { width: 30px; height: 24px; } } .header-bar span { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; background-color: var(--black-color); border-radius: 5px; height: 2px; left: 0; } .header-bar span:first-child { top: 0; } .header-bar span:nth-child(2) { top: 51%; transform: translateY(-65%); } .header-bar span:last-child { bottom: 0; } .header-bar--style1 span { background-color: var(--black-color); } .header-bar--style2 span { background-color: var(--bg-white); } .header-bar.active span:first-child { -webkit-transform: rotate(45deg) translate(3px, 9px); -moz-transform: rotate(45deg) translate(3px, 9px); -ms-transform: rotate(45deg) translate(3px, 9px); -o-transform: rotate(45deg) translate(3px, 9px); transform: rotate(45deg) translate(3px, 9px); } @media (min-width: 768px) { .header-bar.active span:first-child { -webkit-transform: rotate(45deg) translate(3px, 12px); -moz-transform: rotate(45deg) translate(3px, 12px); -ms-transform: rotate(45deg) translate(3px, 12px); -o-transform: rotate(45deg) translate(3px, 12px); transform: rotate(45deg) translate(3px, 12px); } } .header-bar.active span:nth-child(2) { opacity: 0; } .header-bar.active span:last-child { -webkit-transform: rotate(-45deg) translate(3px, -10px); -moz-transform: rotate(-45deg) translate(3px, -10px); -ms-transform: rotate(-45deg) translate(3px, -10px); -o-transform: rotate(-45deg) translate(3px, -10px); transform: rotate(-45deg) translate(3px, -10px); } @media (min-width: 768px) { .header-bar.active span:last-child { -webkit-transform: rotate(-45deg) translate(3px, -13px); -moz-transform: rotate(-45deg) translate(3px, -13px); -ms-transform: rotate(-45deg) translate(3px, -13px); -o-transform: rotate(-45deg) translate(3px, -13px); transform: rotate(-45deg) translate(3px, -13px); } } @media (max-width: 575px) { .header-bar { width: 15px; height: 16px; margin-right: 20px; } .header-bar span { height: 2px; width: 20px; } .header-bar.active span:first-child { -webkit-transform: rotate(45deg) translate(4px, 6px); -moz-transform: rotate(45deg) translate(4px, 6px); -ms-transform: rotate(45deg) translate(4px, 6px); -o-transform: rotate(45deg) translate(4px, 6px); transform: rotate(45deg) translate(4px, 6px); } .header-bar.active span:nth-child(2) { opacity: 0; } .header-bar.active span:last-child { -webkit-transform: rotate(-45deg) translate(4px, -6px); -moz-transform: rotate(-45deg) translate(4px, -6px); -ms-transform: rotate(-45deg) translate(4px, -6px); -o-transform: rotate(-45deg) translate(4px, -6px); transform: rotate(-45deg) translate(4px, -6px); } } .menu-item-has-children > a::after { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; font-family: "FontAwesome"; content: "\f107"; } @media (min-width: 992px) and (max-width: 1199px) { .menu-item-has-children > a::after { position: absolute; content: "\f107"; right: -1px !important; top: 9px; } } @media (min-width: 1200px) { .menu-item-has-children > a::after { position: absolute; content: "\f107"; right: 2px !important; top: 14px; } } .menu-item-has-children:hover > a::after { transform: rotate(180deg); } .menu-item-has-children.open > a::after { transform: rotate(180deg); } .menu-item-has-children.megamenu { position: static; } .menu-item-has-children.megamenu .submenu { width: 100%; } .menu-item-has-children.megamenu .submenu li .home-showcase__buttons a span { color: #0C263A; font-weight: 500; font-size: 0.875rem; } .menu-item-has-children.megamenu .submenu li .home-showcase__buttons a:hover { background-color: var(--brand-color); } .home-showcase { background-color: var(--wh-color); padding: 15px; box-shadow: 0 5px 10px -3px rgba(0, 0, 0, 0.1); border-radius: 0.4rem; max-height: 700px; overflow: auto; } @media (min-width: 576px) { .home-showcase { padding: 20px; } } @media (min-width: 992px) { .home-showcase { padding: 30px; } } @media (min-width: 1200px) { .home-showcase { padding: 40px; } } .home-showcase__buttons { top: 0; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; transform: scale(1, 0); opacity: 1; visibility: hidden; transform-origin: bottom center; transition: 500ms ease; } .home-showcase__buttons-item { padding: 10px 38px; background-color: var(--brand-color); text-align: center; text-decoration: none; } .home-showcase__title a { margin: 0; font-size: 1.125rem; color: var(--title-color); } @media (max-width: 991px) { .home-showcase__title a { border-top: none !important; padding: 10px 0px !important; margin-block-start: 5px; } } @media (min-width: 992px) { .home-showcase__title a { padding-inline-start: 0; margin-top: 10px; } } @media (min-width: 1400px) { .home-showcase__title a { margin-block-start: 15px; } } .home-showcase__image { box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 2px 0px; } .home-showcase__image img { width: 100%; transition: 500ms ease; transform: scale(1); } .home-showcase__image::after { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; content: ""; top: 0; left: 0; height: 100%; width: 100%; background-color: var(--bg-color-15); opacity: 0.1; } .home-showcase__image:hover .home-showcase__buttons { transform: scale(1, 1); opacity: 1; visibility: visible; z-index: 1; } .home-showcase__image:hover .home-showcase__buttons-item { background-color: var(--brand-color); } .home-showcase__image:hover .home-showcase__title a { background-color: transparent; color: var(--brand-color); } .home-showcase__image:hover::after { opacity: 1; } .home-showcase__badge { content: ""; top: 3%; right: 3%; } .home-showcase__badge span { color: var(--bg-white); background-color: var(--bg-color-17); padding: 2px 7px; border-radius: 4px; font-size: 0.75rem; } .section-header { z-index: 2; } @media (min-width: 992px) { .section-header { margin-bottom: 48px; } } @media (min-width: 992px) { .section-header--style2 { margin-bottom: 0px; } } .section-header--style2 h2 { line-height: 1.1; } .section-header--style3 h2 { color: var(--bg-white); } .section-header--style3 p { color: var(--bg-white); opacity: 0.8; } .section-header--style4 { gap: 15px; } .section-header--style4 h2 { line-height: 1.4; } .section-header--style4 h2 span { color: var(--brand-color); } .section-header__content h2 span { color: var(--secondary-color); } .section-header__content h2 span.style2 { color: var(--brand-color); } .section-header__content p { max-width: 55ch; } .section-header h2 span { color: var(--secondary-color); } .section-header h2 span.style2 { color: var(--brand-color); } .section-header p { font-weight: 400; } .section-header p.mute { color: var(--text-color); } .section-header--max18 h2 { max-inline-size: 18ch; } .section-header--max20 h2 { max-inline-size: 20ch; margin: auto; } .section-header--max50 { max-inline-size: 50ch; margin: 0 auto 48px auto; } @media (max-width: 767px) { .section-header--max50 { padding-inline: 10px; } } .section-header--max57 { max-inline-size: 57ch; margin: 0 auto 48px auto; } @media (max-width: 767px) { .section-header--max57 { padding-inline: 10px; } } .section-header--max65 { max-inline-size: 65ch; margin: 0 auto 48px auto; } @media (max-width: 767px) { .section-header--max65 { padding-inline: 10px; } } .subtitle { gap: 10px; } .subtitle p { font-size: 1.25rem; font-weight: 600; font-family: "Anek Telugu", sans-serif; } .subtitle--style2 { color: var(--secondary-color); } .subtitle--style3 p { font-size: 1.125rem; font-weight: 500; font-family: "Anek Telugu", sans-serif; color: var(--secondary-color); } .subtitle--style4 p { font-size: 1.125rem; color: var(--title-color); text-transform: uppercase; } .subtitle--style4 p::before { content: ""; margin-right: 10px; background-color: var(--black-color); border: 2px solid var(--black-color); } .subtitle--style5 { font-size: 1.125rem; color: var(--title-color); text-transform: uppercase; } .page-header { padding-block: 70px; } @media (min-width: 992px) { .page-header { padding-block: 100px; } } .page-header__content h2 { color: var(--bg-white); } @media (min-width: 992px) { .page-header__content h2 { margin-bottom: 15px; } } .page-header .breadcrumb-item { font-size: 1.125rem; color: var(--brand-color); } .page-header .breadcrumb-item a { color: var(--brand-color); } .page-header .breadcrumb-item:before { color: var(--bg-white); } .page-header .breadcrumb-item.active, .page-header .breadcrumb-item:hover { color: var(--bg-white); } .page-header__shape-item--1 { display: none; top: 0%; right: 0%; } @media (min-width: 576px) { .page-header__shape-item--1 { top: 0%; right: -3%; } } @media (min-width: 768px) { .page-header__shape-item--1 { display: block; top: 0%; right: -3%; width: 500px; } } @media (min-width: 992px) { .page-header__shape-item--1 { top: 0%; right: 0%; width: 650px; } } @media (min-width: 1200px) { .page-header__shape-item--1 { width: auto; top: 0%; right: 0%; } } @media (min-width: 1400px) { .page-header__shape-item--1 { top: 0%; right: 0%; } } @media (min-width: 1600px) { .page-header__shape-item--1 { top: 0%; right: 15%; } } .banner__content-coin img { width: 70px; -webkit-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .banner__content-coin img { width: 73px; } } @media (min-width: 768px) { .banner__content-coin img { width: 70px; } } @media (min-width: 992px) { .banner__content-coin img { width: 90px; } } @media (min-width: 1200px) { .banner__content-coin img { width: auto; } } .banner__content-coin--style2 img { width: 70px; -webkit-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .banner__content-coin--style2 img { width: 73px; } } @media (min-width: 768px) { .banner__content-coin--style2 img { width: 70px; } } @media (min-width: 992px) { .banner__content-coin--style2 img { width: 90px; } } @media (min-width: 1200px) { .banner__content-coin--style2 img { width: auto; } } .banner__content-heading span { color: var(--secondary-color); } .banner__content-heading--style2 { max-inline-size: 15ch; } .banner__content-moto { color: var(--text-color); } @media (min-width: 576px) { .banner__content-moto { margin-block-end: 30px; } } @media (min-width: 992px) { .banner__content-moto { margin-block-end: 40px; } } .banner__content-social p { font-size: 1.125rem; color: var(--title-color); } @media (min-width: 992px) { .banner__content-social p { margin-block-end: 25px; } } .banner__content--style2 h1 { max-block-size: 15ch; } @media (min-width: 576px) { .banner__btn-group { margin-block-end: 50px; } } @media (min-width: 992px) { .banner__btn-group { gap: 30px; margin-block-end: 60px; } } @media (min-width: 1200px) { .banner__btn-group { margin-block-end: 88px; } } .banner__shape-item--1 { right: 12%; z-index: 1; top: 51%; -webkit-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .banner__shape-item--1 { top: 46%; right: 12%; } } @media (min-width: 768px) { .banner__shape-item--1 { top: 80%; right: 45%; } } @media (min-width: 992px) { .banner__shape-item--1 { top: 71%; right: 52%; } } @media (min-width: 1200px) { .banner__shape-item--1 { top: auto; bottom: 20%; left: 52%; } } @media (min-width: 1400px) { .banner__shape-item--1 { right: 46%; left: auto; } } .banner__shape-item--2 { width: 60px; z-index: 2; top: 50%; bottom: 20%; left: 8%; -webkit-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .banner__shape-item--2 { width: 80px; top: 50%; bottom: 20%; left: 8%; } } @media (min-width: 768px) { .banner__shape-item--2 { width: 70px; top: 65%; bottom: 20%; left: 34%; } } @media (min-width: 992px) { .banner__shape-item--2 { width: auto; top: 67%; bottom: 20%; left: 38%; } } @media (min-width: 1200px) { .banner__shape-item--2 { top: 67%; bottom: 20%; left: 52%; } } @media (min-width: 1400px) { .banner__shape-item--2 { top: 47%; bottom: 20%; left: auto; right: 10%; } } .banner__shape-item--3 { width: 70px; top: 51%; right: 9%; z-index: 1; -webkit-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .banner__shape-item--3 { top: 24%; right: 9%; } } @media (min-width: 768px) { .banner__shape-item--3 { top: 85%; right: 10%; } } @media (min-width: 992px) { .banner__shape-item--3 { width: auto; top: auto; bottom: 4%; right: 3%; } } @media (min-width: 1200px) { .banner__shape-item--3 { top: auto; bottom: 4%; right: 3%; } } @media (min-width: 1400px) { .banner__shape-item--3 { bottom: 7%; right: 3%; } } @media (min-width: 1600px) { .banner__shape-item--3 { right: 15%; } } .banner__shape-item--4 { top: 31%; left: 15%; z-index: 1; -webkit-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .banner__shape-item--4 { top: 31%; left: 15%; } } @media (min-width: 768px) { .banner__shape-item--4 { top: 22%; left: 50%; } } @media (min-width: 992px) { .banner__shape-item--4 { top: 22%; left: 38%; } } @media (min-width: 1200px) { .banner__shape-item--4 { top: 22%; left: 34%; } } @media (min-width: 1400px) { .banner__shape-item--4 { top: 22%; left: 38%; } } @media (min-width: 1600px) { .banner__shape-item--4 { top: 22%; left: 41%; } } .banner__shape-item--5 { width: 65px; top: 9%; left: 0%; z-index: 1; -webkit-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .banner__shape-item--5 { -webkit-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; width: 70px; top: 11%; left: 3%; } } @media (min-width: 768px) { .banner__shape-item--5 { width: 80px; top: 28%; left: 3%; } } @media (min-width: 992px) { .banner__shape-item--5 { width: auto; top: 28%; left: 3%; } } @media (min-width: 1200px) { .banner__shape-item--5 { top: 17%; left: 7%; } } @media (min-width: 1400px) { .banner__shape-item--5 { top: 17%; left: 9%; } } @media (min-width: 1600px) { .banner__shape-item--5 { top: 17%; left: 20%; } } .banner__shape-item--6 { width: 70px; top: 51%; right: 9%; z-index: 1; -webkit-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .banner__shape-item--6 { top: 26%; right: 9%; width: 120px; } } @media (min-width: 768px) { .banner__shape-item--6 { width: auto; top: 40%; right: 8%; } } @media (min-width: 992px) { .banner__shape-item--6 { top: 15%; right: 7%; } } @media (min-width: 1200px) { .banner__shape-item--6 { top: 18%; right: 7%; } } @media (min-width: 1400px) { .banner__shape-item--6 { top: 17%; right: 9%; } } @media (min-width: 1600px) { .banner__shape-item--6 { top: 17%; right: 19%; } } .banner__shape-item--7 { width: 100px; top: 18%; left: 50%; z-index: 1; -webkit-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .banner__shape-item--7 { top: 26%; left: 32%; width: 140px; } } @media (min-width: 768px) { .banner__shape-item--7 { width: auto; top: 26%; left: 30%; } } @media (min-width: 992px) { .banner__shape-item--7 { top: 49%; left: 20%; width: 120px; } } @media (min-width: 1200px) { .banner__shape-item--7 { width: auto; top: 42%; left: 20%; } } @media (min-width: 1400px) { .banner__shape-item--7 { top: 44%; left: 20%; } } @media (min-width: 1600px) { .banner__shape-item--7 { top: 45%; left: 29%; } } .banner--style1 { background-repeat: no-repeat; background-size: cover; background-position: center; padding-block-start: 80px; padding-block-end: 40px; } @media (min-width: 576px) { .banner--style1 { padding-block-end: 10px; } } @media (min-width: 768px) { .banner--style1 { padding-block-start: 132px; padding-block-end: 100px; } } @media (min-width: 992px) { .banner--style1 { padding-block-start: 148px; padding-block-end: 135px; } } @media (min-width: 1200px) { .banner--style1 { padding-block-start: 148px; padding-block-end: 132px; } } @media (min-width: 1400px) { .banner--style1 { padding-block-start: 148px; padding-block-end: 148px; } } @media (min-width: 1600px) { .banner--style1 { padding-block-start: 148px; padding-block-end: 288px; } } .banner--style1 .banner__bg-element img { left: 0; top: 0; background-repeat: no-repeat; background-size: cover; background-position: center; opacity: 0.8; } .banner--style1 .banner__bg-element span { left: 0; top: 0; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: center; z-index: -2; } @media (min-width: 768px) { .banner--style1 .banner__thumb { position: absolute; -webkit-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; right: -20px; top: 213px; max-inline-size: 56%; } } @media (min-width: 992px) { .banner--style1 .banner__thumb { -webkit-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; right: -20px; top: 213px; max-inline-size: 56%; } } @media (min-width: 1200px) { .banner--style1 .banner__thumb { right: 53px; top: 160px; max-inline-size: 56%; } } @media (min-width: 1400px) { .banner--style1 .banner__thumb { right: 60px; top: 118px; max-inline-size: 51%; } } @media (min-width: 1600px) { .banner--style1 .banner__thumb { right: 280px; top: 205px; max-inline-size: 52%; } } .banner--style2 { background-color: var(--banner2-bg-color); padding-block-start: 110px; padding-block-end: 50px; } .banner--style2 .bg-shape-svg { width: 0; height: 0; display: none; } @media (min-width: 1200px) { .banner--style2 .bg-shape-svg { display: block; } } @media (min-width: 576px) { .banner--style2 { padding-block-end: 40px; } } @media (min-width: 768px) { .banner--style2 { clip-path: url(#shape-clippath); padding-block-start: 132px; padding-block-end: 80px; } } @media (min-width: 992px) { .banner--style2 { padding-block-start: 148px; padding-block-end: 120px; } } @media (min-width: 1200px) { .banner--style2 { background-color: none; padding-block-start: 160px; padding-block-end: 347px; } } @media (min-width: 768px) { .banner--style2 .banner__thumb { -webkit-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; position: absolute; left: 0%; bottom: 7%; max-inline-size: 46%; z-index: 1; } } @media (min-width: 992px) { .banner--style2 .banner__thumb { left: 7%; bottom: 10%; max-inline-size: 40%; } } @media (min-width: 1200px) { .banner--style2 .banner__thumb { left: 90px; bottom: 200px; max-inline-size: 40%; } } @media (min-width: 1400px) { .banner--style2 .banner__thumb { left: 90px; bottom: 180px; max-inline-size: 52%; } } @media (min-width: 1600px) { .banner--style2 .banner__thumb { left: 217px; bottom: 220px; max-inline-size: 30%; } } @media screen and (min-width: 1900px) { .banner--style2 .banner__thumb { left: 360px; bottom: 200px; max-inline-size: 52%; } } .banner--style2 .banner__content { z-index: 2; } .banner--style2 .banner__content h1 { color: var(--bg-white); } .banner--style2 .banner__content p { color: var(--text-color-3); } .banner--style2 .banner__content-playbtn { color: var(--bg-white); } .banner--style2 .banner__content-playbtn i, .banner--style2 .banner__content-playbtn svg { color: var(--bg-white); } .banner--style2 .banner__wrapper--style2::after { bottom: 0px; left: 12%; content: ""; height: 870px; width: 370px; border: 45px solid rgba(255, 255, 255, 0.9); border-bottom-left-radius: 999px; border-bottom-right-radius: 999px; opacity: 0.0799999982; background: linear-gradient(152deg, rgba(229, 237, 248, 0.47) 0%, #EDF2F8 100%); } @media (min-width: 768px) { .banner--style2 .banner__wrapper--style2::after { transform: rotate(18deg); left: 14%; bottom: 2%; } } @media (min-width: 992px) { .banner--style2 .banner__wrapper--style2::after { display: block; bottom: 1%; left: 14%; } } @media (min-width: 1200px) { .banner--style2 .banner__wrapper--style2::after { transform: rotate(22deg); bottom: 10%; left: 14%; } } @media (min-width: 1400px) { .banner--style2 .banner__wrapper--style2::after { bottom: 10%; transform: rotate(23deg); left: 13%; } } @media (min-width: 1600px) { .banner--style2 .banner__wrapper--style2::after { bottom: 10%; transform: rotate(23deg); left: 18%; } } @media screen and (min-width: 1900px) { .banner--style2 .banner__wrapper--style2::after { bottom: 10%; transform: rotate(23deg); left: 23%; } } .banner--style3 { background-repeat: no-repeat; background-size: cover; background-position: center; padding-block-start: 80px; padding-block-end: 80px; } @media (min-width: 576px) { .banner--style3 { padding-block-start: 80px; padding-block-end: 80px; } } @media (min-width: 768px) { .banner--style3 { padding-block-start: 90px; padding-block-end: 100px; } } @media (min-width: 992px) { .banner--style3 { padding-block-start: 130px; padding-block-end: 138px; } } @media (min-width: 1200px) { .banner--style3 { padding-block-start: 140px; padding-block-end: 150px; } } @media (min-width: 1600px) { .banner--style3 { padding-block-start: 160px; padding-block-end: 165px; } } .banner--style3 .banner__bg-element img { left: 0; top: 0; background-repeat: no-repeat; background-size: cover; background-position: center; opacity: 0.8; } .banner--style3 .banner__bg-element span { left: 0; top: 0; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: center; z-index: -2; } .banner--style3 .banner__thumb img { -webkit-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 768px) { .banner--style3 .banner__thumb::before { position: absolute; content: ""; width: 162px; height: 100%; background: linear-gradient(160deg, var(--bg-grad-color-trans-4) 0%, var(--bg-grad-color-4) 100%); left: 46%; bottom: 0; } } @media (min-width: 768px) and (min-width: 992px) { .banner--style3 .banner__thumb::before { width: 195px; left: 48%; } } @media (min-width: 768px) and (min-width: 1200px) { .banner--style3 .banner__thumb::before { width: 230px; left: 48.5%; } } @media (min-width: 768px) and (min-width: 1400px) { .banner--style3 .banner__thumb::before { width: 230px; left: 49%; } } .banner--style3 .banner__counter-item { border-radius: 8px; background-color: var(--wh-color); border: 2px solid rgba(31, 35, 61, 0); box-shadow: 0px 16px 64px 0px rgba(0, 208, 148, 0.12); } @media (min-width: 768px) { .banner--style3 .banner__counter-item { padding: 22px; } } @media (min-width: 992px) { .banner--style3 .banner__counter-item { padding: 22px; } } @media (min-width: 1200px) { .banner--style3 .banner__counter-item { padding: 24px; } } .banner--style3 .banner__counter-item:not(:last-child) { margin-block-end: 32px; } .banner--style3 .banner__counter-item h4 { font-family: "Open Sans", sans-serif; margin-bottom: 0px; } .banner--style3 .banner__counter-item h4 span { font-size: inherit; color: inherit; font-family: inherit; } .banner--style3 .banner__counter-item p { font-size: 1.125rem; line-height: 1.3; font-family: "Open Sans", sans-serif; } .banner--style3 .banner__bg { z-index: -1; } .banner--style4 { background-repeat: no-repeat; background-size: cover; background-position: center; padding-block-start: 110px; padding-block-end: 240px; } @media (min-width: 576px) { .banner--style4 { padding-block-start: 140px; padding-block-end: 250px; } } @media (min-width: 768px) { .banner--style4 { padding-block-start: 170px; padding-block-end: 260px; } } @media (min-width: 992px) { .banner--style4 { padding-block-start: 180px; padding-block-end: 270px; } } @media (min-width: 1200px) { .banner--style4 { padding-block-start: 208px; padding-block-end: 280px; } } @media (min-width: 1400px) { .banner--style4 { padding-block-start: 208px; padding-block-end: 290px; } } @media (min-width: 1600px) { .banner--style4 { padding-block-start: 208px; padding-block-end: 317px; } } .banner--style4 .banner__content h1 { font-size: calc(1.625rem + 3.8571428571vw); letter-spacing: -0.5px; color: var(--bg-white); } @media (min-width: 1400px) { .banner--style4 .banner__content h1 { font-size: 5rem; } } @media (min-width: 992px) { .banner--style4 .banner__content h1 { line-height: 92px; } } .banner--style4 .banner__content p { font-size: 1.125rem; max-inline-size: 60ch; margin-inline: auto; color: var(--bg-white); opacity: 0.7; } @media (min-width: 1200px) { .banner--style4 .banner__content p { font-size: 1.25rem; } } @media (min-width: 1200px) { .banner--style4 .banner__content-btn { margin-top: 48px; } } .banner--style5 { background-repeat: no-repeat; background-size: cover; background-position: center; padding-block-start: 100px; padding-block-end: 80px; } @media (min-width: 576px) { .banner--style5 { padding-block-start: 120px; padding-block-end: 80px; } } @media (min-width: 768px) { .banner--style5 { padding-block-start: 160px; padding-block-end: 100px; } } @media (min-width: 992px) { .banner--style5 { padding-block-start: 180px; padding-block-end: 100px; } } @media (min-width: 1200px) { .banner--style5 { padding-block-start: 180px; padding-block-end: 100px; } } @media (min-width: 1600px) { .banner--style5 { padding-block-start: 200px; padding-block-end: 100px; } } .banner--style5::after { content: ""; width: 100%; height: 100%; background-image: url(../images/banner/home5/bg.svg); background-position: center; background-repeat: no-repeat; } .banner--style5 .banner__content { z-index: 1; } .banner--style5 .banner__content p { font-size: 1.125rem; color: var(--tertiary-color4); text-transform: uppercase; letter-spacing: 2px; } @media (min-width: 576px) { .banner--style5 .banner__content p { font-size: calc(1.275rem + 0.2571428571vw); margin-bottom: 30px; } } @media (min-width: 576px) and (min-width: 1400px) { .banner--style5 .banner__content p { font-size: 1.5rem; } } @media (min-width: 1200px) { .banner--style5 .banner__content p { margin-bottom: 36px; } } .banner--style5 .banner__content-heading { font-size: calc(1.4875rem + 2.4428571429vw); max-inline-size: 19ch; } @media (min-width: 1400px) { .banner--style5 .banner__content-heading { font-size: 3.625rem; } } @media (min-width: 992px) { .banner--style5 .banner__content-heading { max-inline-size: 13ch; } } @media (min-width: 1200px) { .banner--style5 .banner__content-heading { max-inline-size: 18ch; } } .banner--style5 .banner__content-moto { color: var(--text-color); } @media (min-width: 576px) { .banner--style5 .banner__content-moto { margin-block-end: 30px; } } @media (min-width: 992px) { .banner--style5 .banner__content-moto { margin-block-end: 40px; } } .banner--style5 .banner__thumb-inner img { -webkit-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 992px) { .banner--style5 .banner__thumb-inner img { position: absolute; left: 37%; top: 27%; width: 330px; } } @media (min-width: 1200px) { .banner--style5 .banner__thumb-inner img { position: absolute; left: 46%; top: 29%; width: 350px; } } @media (min-width: 1400px) { .banner--style5 .banner__thumb-inner img { position: absolute; width: auto; left: 45.5%; top: 26%; } } @media (min-width: 1600px) { .banner--style5 .banner__thumb-inner img { position: absolute; left: 46%; top: 25%; } } @media (min-width: 992px) { .banner--style5 .banner__thumb-inner::before { position: absolute; content: ""; width: 388px; height: 600px; background-image: linear-gradient(180deg, var(--body-color) 0%, var(--bg-color-10) 70%); border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; left: 46%; top: 0; } } @media (min-width: 992px) and (min-width: 992px) { .banner--style5 .banner__thumb-inner::before { width: 340px; left: 35%; } } @media (min-width: 992px) and (min-width: 1200px) { .banner--style5 .banner__thumb-inner::before { height: 633px; width: 340px; left: 45%; } } @media (min-width: 992px) and (min-width: 1400px) { .banner--style5 .banner__thumb-inner::before { width: 360px; left: 45%; } } @media (min-width: 992px) and (min-width: 1600px) { .banner--style5 .banner__thumb-inner::before { width: 388px; left: 45%; } } @media (min-width: 576px) { .banner--style5 .banner__testimonial-inner { margin-block-start: 80px; } } @media (min-width: 992px) { .banner--style5 .banner__testimonial-inner { margin-block-start: 190px; } } @media (min-width: 1200px) { .banner--style5 .banner__testimonial-inner { margin-block-start: 149px; } } .banner--style5 .banner__thumb2-inner { border-radius: 4px; background-color: var(--tertiary-color4); } @media (min-width: 992px) { .banner--style5 .banner__thumb2-inner { max-width: 332px; } } @media (min-width: 1200px) { .banner--style5 .banner__thumb2-inner { padding: 32px; } } .banner--style5 .banner__thumb2-inner p { font-size: 1.25rem; color: #FFFFFF; line-height: 1.4; } @media (min-width: 576px) { .banner--style5 .banner__thumb2-inner p { font-size: 1.125rem; } } @media (min-width: 768px) { .banner--style5 .banner__thumb2-inner p { font-size: calc(1.2625rem + 0.1285714286vw); } } @media (min-width: 768px) and (min-width: 1400px) { .banner--style5 .banner__thumb2-inner p { font-size: 1.375rem; } } .banner--style5 .banner__shorttext1 p { color: var(--title-color); } @media (min-width: 992px) { .banner--style5 .banner__shorttext1 { position: absolute; left: 35%; max-width: 34ch; top: 60%; } } @media (min-width: 1200px) { .banner--style5 .banner__shorttext1 { position: absolute; left: 45%; max-width: 34ch; top: 64.5%; } } @media (min-width: 1400px) { .banner--style5 .banner__shorttext1 { position: absolute; left: 45%; max-width: 34ch; top: 63.5%; } } .contact__wrapper { z-index: 2; } .contact__social h3 { max-inline-size: 15ch; } .contact__social h3 span { color: var(--secondary-color); } .contact__item-inner { gap: 24px; } .contact__item-thumb span { background-color: var(--tertiary-color2); border-radius: 50%; } .contact__form textarea { min-height: 250px; } .contact__shape-item--1 { width: 50px; top: 5%; left: 71%; z-index: 2; -webkit-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .contact__shape-item--1 { width: 70px; top: 6%; left: 65%; } } @media (min-width: 768px) { .contact__shape-item--1 { max-width: 40px; top: 4%; left: 73%; } } @media (min-width: 992px) { .contact__shape-item--1 { max-width: 100%; top: 80%; left: 13%; } } @media (min-width: 1200px) { .contact__shape-item--1 { top: 16%; left: 32%; } } @media (min-width: 1400px) { .contact__shape-item--1 { top: 16%; left: 36%; } } @media (min-width: 1600px) { .contact__shape-item--1 { top: 16%; left: 38%; } } .contact__shape-item--2 { content: ""; height: 92%; width: 920px; border: 2px solid var(--bg-grad-color-2); padding: 40px; border-bottom-left-radius: 25%; top: 0%; right: -3%; transform: rotate(-10deg); opacity: 0.4; display: none; } @media (min-width: 768px) { .contact__shape-item--2 { display: block; height: 109%; width: 570px; top: -9%; right: -5%; } } @media (min-width: 992px) { .contact__shape-item--2 { height: 109%; width: 800px; top: -9%; right: -15%; } } @media (min-width: 1200px) { .contact__shape-item--2 { width: 900px; top: -12%; right: -6%; } } @media (min-width: 1400px) { .contact__shape-item--2 { width: 1000px; top: -12%; right: -6%; } } @media (min-width: 1600px) { .contact__shape-item--2 { width: 1200px; top: -14%; right: -2%; } } .contact__shape-item--2 span { position: absolute; content: ""; height: 96%; width: 700px; background: linear-gradient(219deg, var(--bg-grad-color-trans-2) 0%, var(--bg-grad-color-2) 100%); border-bottom-left-radius: 25%; top: 5%; right: -1%; } @media (min-width: 768px) { .contact__shape-item--2 span { height: 97%; width: 550px; top: 0%; right: -1%; } } @media (min-width: 992px) { .contact__shape-item--2 span { height: 97%; width: 780px; top: 0%; right: -1%; } } @media (min-width: 1200px) { .contact__shape-item--2 span { width: 880px; top: 0%; right: -1%; } } @media (min-width: 1400px) { .contact__shape-item--2 span { width: 980px; top: 0%; right: -1%; } } @media (min-width: 1600px) { .contact__shape-item--2 span { width: 1180px; top: 0%; right: -1%; } } .account__wrapper { z-index: 2; } .account__content--style1 { max-inline-size: 800px; margin-inline: auto; background-color: var(--account-bg-color); border-radius: 4px; } @media (min-width: 576px) { .account__content--style1 { padding: 50px; } } @media (min-width: 992px) { .account__content--style1 { padding: 100px; } } .account__content--style2 { max-inline-size: 800px; margin-inline: auto; background-color: var(--account-bg-color2); border-radius: 4px; } @media (min-width: 576px) { .account__content--style2 { padding: 50px; } } @media (min-width: 768px) { .account__content--style2 { padding: 60px; } } @media (min-width: 992px) { .account__content--style2 { padding: 25px 30px; } } @media (min-width: 992px) { .account__thumb img { display: block; border-top-left-radius: 4px; border-bottom-left-radius: 4px; } } .account__inner { background-color: var(--account-bg-color2); border-radius: 4px; box-shadow: 0px -16px 48px rgba(6, 35, 63, 0.03), 0px 16px 48px rgba(6, 35, 63, 0.03); } @media (min-width: 768px) { .account__header { margin-block-end: 50px; } } .account__header p { font-size: 1rem; } .account__check-remember input { width: 1.2em; height: 1.2em; margin-inline-end: 3px; } .account__check-remember input:focus { box-shadow: none; } .account__check-remember input:checked { background-color: var(--brand-color); border-color: var(--brand-color); } .account__check-remember label { font-size: 1rem; color: var(--title-color); } .account__check-forgot a { font-size: 1rem; color: var(--secondary-color); text-decoration: underline; } .account__social-btn { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; font-size: 1rem; display: inline-flex; background-color: var(--wh-color); color: var(--title-color); padding: 16px 24px; border: 1px solid var(--form-border); border-radius: 0.5rem; } @media (min-width: 1200px) { .account__social-btn { padding: 0.8rem 2.25rem; } } .account__social-btn:hover { border-color: var(--brand-color); } .account__divider--style1 span { font-size: 1.125rem; color: var(--title-color); padding: 20px; top: -35px; left: 45%; background: var(--account-bg-color); } .account__divider--style1:before { content: ""; height: 1px; width: 100%; left: 0; top: 0; background-color: var(--form-border); } .account__divider--style2 span { color: var(--text-color); } .account__switch p { font-size: 1rem; } .account__switch p i, .account__switch p svg { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .account__switch p a { color: var(--secondary-color); text-decoration: underline; } .account__switch p a.style2 { font-size: 1rem; color: var(--text-color); } .account__switch a { font-size: 1.125rem; } .account__switch a span { color: var(--secondary-color); text-decoration: underline; } .account__shape-item--1 { width: 30px; top: 9%; left: 77%; z-index: 2; -webkit-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .account__shape-item--1 { width: 55px; top: 11%; left: 66%; } } @media (min-width: 768px) { .account__shape-item--1 { max-width: 75px; top: 11%; left: 56%; } } @media (min-width: 992px) { .account__shape-item--1 { max-width: 100%; top: 13%; left: 20%; } } @media (min-width: 1200px) { .account__shape-item--1 { top: 9%; left: 8%; } } @media (min-width: 1400px) { .account__shape-item--1 { top: 9%; left: 12%; } } @media (min-width: 1600px) { .account__shape-item--1 { left: 22%; } } input, textarea { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; border-radius: 8px; color: var(--text-color); padding: 1rem 2rem; z-index: 1; } input.style1, textarea.style1 { border-radius: 0; border: none; background-color: var(--brand-color); color: var(--wh-color); } input.style1::placeholder, textarea.style1::placeholder { font-weight: 400; color: var(--wh-color); color: var(--text-color); } input::placeholder, textarea::placeholder { font-weight: 400; color: rgba(var(--text-color-light), 0.3); } input:focus-within, textarea:focus-within { outline: none; border-color: none; box-shadow: none; } .form-control { background-color: var(--wh-color); border-color: var(--form-border); padding: 13px 20px; border-radius: 8px; color: var(--title-color); } @media (min-width: 992px) { .form-control { padding: 16px 20px; } } .form-control:focus { box-shadow: none; border-color: var(--brand-color); background-color: var(--wh-color); color: var(--title-color); } .form-check-input { background-color: var(--wh-color); } .form-label { font-size: 1.125rem; font-family: "Open Sans", sans-serif; color: var(--title-color); } .input-group { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; border: 1px solid rgba(var(--text-color), 0.3); border-radius: 0.5rem; } .input-group:focus-within { border-color: var(--text-color); } .input-group .valid-tooltip, .input-group .invalid-tooltip { background-color: transparent; top: 90%; } .showhide-pass { position: relative; } .footer { background-color: var(--footer-bg-color); color: var(--wh-color); font-weight: 400; } .footer--style2 { background-color: var(--bg-color-12); } .footer__wrapper { z-index: 2; } @media (min-width: 576px) { .footer__top { margin-block-end: 0; } } .footer__top--style1 { padding-block: 80px; } @media (min-width: 576px) { .footer__top--style1 { padding-block: 90px; } } @media (min-width: 992px) { .footer__top--style1 { padding-block: 100px; } } .footer__top--style2 { padding-top: 200px; padding-block-end: 80px; } @media (min-width: 576px) { .footer__top--style2 { padding-block-start: 250px; padding-block-end: 90px; } } @media (min-width: 992px) { .footer__top--style2 { padding-block-start: 332px; padding-block-end: 100px; } } .footer__app { gap: 20px; } .footer__app-inner { gap: 10px; } .footer__app-item--apple { background-color: var(--brand-color); color: #0C263A; border-radius: 8px; } .footer__app-item--apple2 { background-color: var(--bg-color-10); color: #0C263A; border-radius: 8px; } .footer__app-item--playstore { background-color: var(--bg-color-8); color: var(--bg-white); border-radius: 8px; } .footer__app-item--playstore2 { background-color: var(--tertiary-color4); color: #FFFFFF; border-radius: 8px; } .footer__app-content { line-height: 1.1; } .footer__app-content span { font-size: 0.5rem; } .footer__app-content p { font-size: 0.875rem; } .footer__about-moto { color: var(--text-color-2); } @media (min-width: 768px) { .footer__about-moto { max-inline-size: 40ch; margin-block-end: 32px; } } .footer__links-tittle h6 { color: var(--bg-white); } @media (min-width: 576px) { .footer__links-tittle h6 { margin-block-end: 20px; } } .footer__linklist-item p { color: var(--text-color); } .footer__linklist-item a { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; color: var(--text-color-2); } .footer__linklist-item a::after { -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); content: ""; transition: all 0.3s ease-out; top: 50%; left: 0; width: 10px; height: 2px; background-color: currentColor; opacity: 0; } .footer__linklist-item a:hover { -webkit-transform: translateX(10px); -moz-transform: translateX(10px); -ms-transform: translateX(10px); -o-transform: translateX(10px); transform: translateX(10px); color: var(--brand-color); } .footer__linklist-item a:hover::after { opacity: 1; left: -12px; } .footer__linklist-item a.style2:hover { -webkit-transform: translateX(10px); -moz-transform: translateX(10px); -ms-transform: translateX(10px); -o-transform: translateX(10px); transform: translateX(10px); color: var(--bg-color-10); } .footer__linklist-item a.style2:hover::after { opacity: 1; left: -12px; } .footer__end { border-top: 1px solid rgba(255, 255, 255, 0.1); color: var(--text-color-2); font-size: 1rem; } @media (min-width: 576px) { .footer__end { display: flex; justify-content: space-between; } } .footer__end-copyright a { color: var(--brand-color); } .footer__end-copyright a.style2 { color: var(--bg-color-10); } @media (min-width: 576px) { .footer__end-copyright { margin-block-end: 0; } } @media (max-width: 575px) { .footer__end-links { justify-content: space-between; } } @media (min-width: 576px) { .footer__end-links { gap: 10px; } } @media (min-width: 768px) { .footer__end-links { gap: 20px; } } .footer__end-item a { color: var(--text-color); } .footer__shape-item--1 { max-width: 60px; top: 8%; left: 50%; -webkit-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .footer__shape-item--1 { width: auto; top: 12%; left: 40%; } } @media (min-width: 768px) { .footer__shape-item--1 { top: 70%; left: 5%; } } @media (min-width: 992px) { .footer__shape-item--1 { left: 27%; top: 17%; } } @media (min-width: 1200px) { .footer__shape-item--1 { top: 17%; left: 23%; } } @media (min-width: 1400px) { .footer__shape-item--1 { top: 17%; left: 33%; } } .footer__shape-item--2 { content: ""; height: 95%; width: 920px; border: 1px solid var(--bg-white); opacity: 0.06; padding: 40px; border-top-right-radius: 40px; border-bottom-right-radius: 40px; top: 0%; left: -3%; transform: rotate(13deg); display: none; } @media (min-width: 768px) { .footer__shape-item--2 { display: block; width: 530px; top: 0%; left: -19%; } } @media (min-width: 992px) { .footer__shape-item--2 { width: 530px; top: 4%; left: -11%; } } @media (min-width: 1200px) { .footer__shape-item--2 { height: 100%; top: 9%; left: -6%; } } @media (min-width: 1400px) { .footer__shape-item--2 { height: 101%; width: 920px; top: 0%; left: -26%; } } @media (min-width: 1600px) { .footer__shape-item--2 { height: 107%; width: 920px; top: 0%; left: -3%; } } .footer__shape-item--2 span { position: absolute; content: ""; height: 90%; width: 900px; background: linear-gradient(150.39deg, rgba(237, 242, 248, 0.22) 15.02%, #EDF2F8 99.59%); border-top-right-radius: 40px; border-bottom-right-radius: 40px; top: 5%; left: -1%; } @media (min-width: 768px) { .footer__shape-item--2 span { top: 5%; left: -77%; } } @media (min-width: 992px) { .footer__shape-item--2 span { top: 5%; left: -77%; } } @media (min-width: 1200px) { .footer__shape-item--2 span { top: 5%; left: -77%; } } @media (min-width: 1400px) { .footer__shape-item--2 span { top: 5%; left: -1%; } } @media (min-width: 1600px) { .footer__shape-item--2 span { top: 5%; left: -1%; } } .footer__shape-item--3 { max-width: 50px; top: 21%; left: 57%; -webkit-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .footer__shape-item--3 { width: auto; top: 29%; left: 40%; } } @media (min-width: 768px) { .footer__shape-item--3 { top: 80%; left: 30%; } } @media (min-width: 992px) { .footer__shape-item--3 { top: 45%; left: 25%; } } @media (min-width: 1200px) { .footer__shape-item--3 { top: 45%; left: 22%; } } @media (min-width: 1400px) { .footer__shape-item--3 { top: 45%; left: 26%; } } @media (min-width: 1600px) { .footer__shape-item--3 { top: 45%; left: 32%; } } .footer__shape-item--4 { display: none; max-width: 50px; top: 21%; left: 57%; -webkit-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .footer__shape-item--4 { width: auto; top: 29%; left: 40%; } } @media (min-width: 768px) { .footer__shape-item--4 { display: block; top: 15%; left: 30%; } } @media (min-width: 992px) { .footer__shape-item--4 { top: 66%; left: 3%; } } @media (min-width: 1200px) { .footer__shape-item--4 { top: 66%; left: 3%; } } @media (min-width: 1400px) { .footer__shape-item--4 { top: 58%; left: 3%; } } @media (min-width: 1600px) { .footer__shape-item--4 { top: 63%; left: 13%; } } .footer__shape-item--5 { width: 70px; top: 60%; left: 43%; -webkit-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .footer__shape-item--5 { top: 29%; left: 65%; } } @media (min-width: 768px) { .footer__shape-item--5 { width: auto; top: 60%; left: 43%; } } @media (min-width: 992px) { .footer__shape-item--5 { top: 56%; left: 43%; } } @media (min-width: 1200px) { .footer__shape-item--5 { top: 50%; left: 40%; } } @media (min-width: 1400px) { .footer__shape-item--5 { top: 50%; left: 36%; } } @media (min-width: 1600px) { .footer__shape-item--5 { top: 54%; left: 46%; } } .trk-btn { font-size: 1rem; border: transparent; color: #0C263A; font-family: "Open Sans", sans-serif; padding: 0.75rem 1rem; text-decoration: none; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; text-transform: capitalize; line-height: 1; border-radius: 8px; } .trk-btn:after { background: var(--bg-white); content: ""; height: 155px; left: -75px; opacity: 0.2; top: -50px; transform: rotate(35deg); transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1); width: 50px; z-index: -10; } @media (min-width: 576px) { .trk-btn { padding: 1rem 1.25rem; } } @media (min-width: 992px) { .trk-btn { padding: 1rem 1.75rem; } } @media (min-width: 1200px) { .trk-btn { padding: 1rem 1.875rem; } } .trk-btn--small { padding: 0.75rem 1.5rem; } @media (min-width: 576px) { .trk-btn--large { padding: 0.95rem 1.25rem; } } @media (min-width: 992px) { .trk-btn--large { padding: 1.25rem 1.875rem; } } .trk-btn svg, .trk-btn i { transition: all 0.3s ease-out; } .trk-btn--arrow span i, .trk-btn--arrow span svg { font-size: 1rem; } .trk-btn--arrow span.style2 i, .trk-btn--arrow span.style2 svg { font-size: 1.125rem; } .trk-btn--defult { gap: 5px; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; color: var(--title-color); padding: 0.53rem 1rem; } @media (min-width: 576px) { .trk-btn--defult { padding: 0.8rem 1rem; } } @media (min-width: 992px) { .trk-btn--defult { padding: 0.81rem 1rem; } } @media (min-width: 1200px) { .trk-btn--defult { padding: 0.82rem 1rem; } } .trk-btn--defult span.style1 i, .trk-btn--defult span.style1 svg { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .trk-btn--defult span.style1 i rect, .trk-btn--defult span.style1 svg rect { stroke: var(--title-color); } .trk-btn--defult span.style1 i g path, .trk-btn--defult span.style1 svg g path { stroke: var(--title-color); } .trk-btn--arrowplay { gap: 5px; padding: 0.53rem 1rem; } @media (min-width: 576px) { .trk-btn--arrowplay { padding: 0.8rem 1.25rem; } } @media (min-width: 992px) { .trk-btn--arrowplay { padding: 0.8rem 1.75rem; } } @media (min-width: 1200px) { .trk-btn--arrowplay { padding: 0.78rem 1.875rem; } } .trk-btn--arrowplay span i, .trk-btn--arrowplay span svg { font-size: 1.25rem; } .trk-btn--left { gap: 8px; } .trk-btn--left span { width: 24px; height: 24px; background-color: var(--bg-white); border-radius: 99px; padding: 4px; } .trk-btn--left span i, .trk-btn--left span svg { font-size: 0.875rem; color: var(--brand-color); line-height: 24px; } .trk-btn--primary { background-color: var(--brand-color); border: 1px solid var(--brand-color); } .trk-btn--tertiary { background-color: var(--tertiary-color4); border: 1px solid var(--tertiary-color4); color: #FFFFFF; border-radius: 4px; } .trk-btn--secondary { background-color: var(--secondary-color); border: 1px solid var(--secondary-color); color: var(--wh-color); } .trk-btn--secondary2 { background-color: #0A4FD5; border: 1px solid #0A4FD5; color: var(--bg-white); } .trk-btn--secondary3 { background-color: var(--bg-color-11); border: 1px solid var(--bg-color-11); color: var(--bg-white); } .trk-btn--outline { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; width: 100%; border: 1px solid var(--brand-color); color: #0C263A; } .trk-btn--outline2 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; gap: 5px; border: 1px solid var(--secondary-color); color: var(--secondary-color); padding: 0.53rem 1rem; } @media (min-width: 576px) { .trk-btn--outline2 { padding: 0.8rem 1.25rem; } } @media (min-width: 992px) { .trk-btn--outline2 { padding: 0.8rem 1.75rem; } } @media (min-width: 1200px) { .trk-btn--outline2 { padding: 0.78rem 1.875rem; } } .trk-btn--outline2 span.style1 i, .trk-btn--outline2 span.style1 svg { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .trk-btn--outline2 span.style1 i rect, .trk-btn--outline2 span.style1 svg rect { stroke: var(--arrow-icon-color); } .trk-btn--outline2 span.style1 i g path, .trk-btn--outline2 span.style1 svg g path { stroke: var(--arrow-icon-color); } .trk-btn--outline22 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; gap: 5px; border: 1px solid var(--secondary-color); color: var(--secondary-color); padding: 0.53rem 1rem; } @media (min-width: 576px) { .trk-btn--outline22 { padding: 0.8rem 1.25rem; } } @media (min-width: 992px) { .trk-btn--outline22 { padding: 0.8rem 1.75rem; } } @media (min-width: 1200px) { .trk-btn--outline22 { padding: 0.78rem 1.875rem; } } .trk-btn--outline22 span.style1 i, .trk-btn--outline22 span.style1 svg { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .trk-btn--outline22 span.style1 i rect, .trk-btn--outline22 span.style1 svg rect { stroke: var(--secondary-color); } .trk-btn--outline22 span.style1 i g path, .trk-btn--outline22 span.style1 svg g path { stroke: var(--secondary-color); } .trk-btn--outline3 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; gap: 5px; border-color: #1B2D29; background: rgba(255, 255, 255, 0.08); color: #fff; padding: 0.53rem 1rem; } @media (min-width: 576px) { .trk-btn--outline3 { padding: 0.8rem 1.25rem; } } @media (min-width: 992px) { .trk-btn--outline3 { padding: 0.8rem 1.75rem; } } @media (min-width: 1200px) { .trk-btn--outline3 { padding: 0.78rem 1.875rem; } } .trk-btn--outline3 span.style1 i, .trk-btn--outline3 span.style1 svg { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .trk-btn--outline4 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; width: 100%; border: 1px solid var(--secondary-color); color: var(--secondary-color); } .trk-btn--outline4.active, .trk-btn--outline4:hover { background-color: var(--secondary-color); color: var(--bg-white); } .trk-btn--outline5 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; gap: 5px; color: var(--secondary-color); padding: 0.53rem 1rem; } @media (min-width: 576px) { .trk-btn--outline5 { padding: 0.8rem 1.25rem; } } @media (min-width: 992px) { .trk-btn--outline5 { padding: 0.8rem 1.75rem; } } @media (min-width: 1200px) { .trk-btn--outline5 { padding: 0.78rem 1.875rem; } } .trk-btn--outline5 span.style1 i, .trk-btn--outline5 span.style1 svg { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .trk-btn--outline5 span.style1 i rect, .trk-btn--outline5 span.style1 svg rect { stroke: var(--arrow-icon-color); } .trk-btn--outline5 span.style1 i g path, .trk-btn--outline5 span.style1 svg g path { stroke: var(--arrow-icon-color); } .trk-btn--outline6 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; width: 100%; border: 1.5px solid var(--title-color); color: var(--title-color); border-radius: 4px; } .trk-btn.search-btn { padding: 1.2rem 1.85rem; font-size: 1.125rem; } .trk-btn span { position: inherit; z-index: 1; } .trk-btn.active.trk-btn--primary, .trk-btn:hover.trk-btn--primary { color: #0C263A; transform: translateY(-3px); } .trk-btn.active.trk-btn--primary:after, .trk-btn:hover.trk-btn--primary:after { left: 120%; transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1); } .trk-btn.active.trk-btn--secondary, .trk-btn:hover.trk-btn--secondary { color: var(--bg-white); transform: translateY(-3px); } .trk-btn.active.trk-btn--secondary:after, .trk-btn:hover.trk-btn--secondary:after { left: 120%; transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1); } .trk-btn.active.trk-btn--secondary2, .trk-btn:hover.trk-btn--secondary2 { color: var(--bg-white); transform: translateY(-3px); } .trk-btn.active.trk-btn--secondary2:after, .trk-btn:hover.trk-btn--secondary2:after { left: 120%; transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1); } .trk-btn.active.trk-btn--secondary3, .trk-btn:hover.trk-btn--secondary3 { color: var(--bg-white); transform: translateY(-3px); } .trk-btn.active.trk-btn--secondary3:after, .trk-btn:hover.trk-btn--secondary3:after { left: 120%; transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1); } .trk-btn.active.trk-btn--tertiary, .trk-btn:hover.trk-btn--tertiary { color: #FFFFFF; transform: translateY(-3px); } .trk-btn.active.trk-btn--tertiary:after, .trk-btn:hover.trk-btn--tertiary:after { left: 120%; transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1); } .trk-btn.active.trk-btn--arrow, .trk-btn:hover.trk-btn--arrow { transform: rotate(0deg); } .trk-btn.active.trk-btn--outline, .trk-btn:hover.trk-btn--outline { background-color: var(--brand-color); border-color: var(--brand-color); color: #0C263A; } .trk-btn.active.trk-btn--outline2, .trk-btn:hover.trk-btn--outline2 { background-color: var(--brand-color); border-color: var(--brand-color); color: #0C263A; } .trk-btn.active.trk-btn--outline2 span.style1 i rect, .trk-btn.active.trk-btn--outline2 span.style1 svg rect, .trk-btn:hover.trk-btn--outline2 span.style1 i rect, .trk-btn:hover.trk-btn--outline2 span.style1 svg rect { stroke: #0C263A; } .trk-btn.active.trk-btn--outline2 span.style1 i g path, .trk-btn.active.trk-btn--outline2 span.style1 svg g path, .trk-btn:hover.trk-btn--outline2 span.style1 i g path, .trk-btn:hover.trk-btn--outline2 span.style1 svg g path { stroke: #0C263A; } .trk-btn.active.trk-btn--outline22, .trk-btn:hover.trk-btn--outline22 { background-color: #0A4FD5; border-color: #0A4FD5; color: var(--bg-white); } .trk-btn.active.trk-btn--outline22 span.style1 i rect, .trk-btn.active.trk-btn--outline22 span.style1 svg rect, .trk-btn:hover.trk-btn--outline22 span.style1 i rect, .trk-btn:hover.trk-btn--outline22 span.style1 svg rect { stroke: var(--bg-white); } .trk-btn.active.trk-btn--outline22 span.style1 i g path, .trk-btn.active.trk-btn--outline22 span.style1 svg g path, .trk-btn:hover.trk-btn--outline22 span.style1 i g path, .trk-btn:hover.trk-btn--outline22 span.style1 svg g path { stroke: var(--bg-white); } .trk-btn.active.trk-btn--defult, .trk-btn:hover.trk-btn--defult { background-color: var(--brand-color); border-color: var(--brand-color); color: #0C263A; } .trk-btn.active.trk-btn--defult span.style1 i rect, .trk-btn.active.trk-btn--defult span.style1 svg rect, .trk-btn:hover.trk-btn--defult span.style1 i rect, .trk-btn:hover.trk-btn--defult span.style1 svg rect { stroke: #0C263A; } .trk-btn.active.trk-btn--defult span.style1 i g path, .trk-btn.active.trk-btn--defult span.style1 svg g path, .trk-btn:hover.trk-btn--defult span.style1 i g path, .trk-btn:hover.trk-btn--defult span.style1 svg g path { stroke: #0C263A; } .trk-btn.active.trk-btn--outline3, .trk-btn:hover.trk-btn--outline3 { background-color: var(--brand-color); border-color: var(--brand-color); color: #0C263A; } .trk-btn.active.trk-btn--outline3 span.style1 i rect, .trk-btn.active.trk-btn--outline3 span.style1 svg rect, .trk-btn:hover.trk-btn--outline3 span.style1 i rect, .trk-btn:hover.trk-btn--outline3 span.style1 svg rect { stroke: #0C263A; } .trk-btn.active.trk-btn--outline3 span.style1 i g path, .trk-btn.active.trk-btn--outline3 span.style1 svg g path, .trk-btn:hover.trk-btn--outline3 span.style1 i g path, .trk-btn:hover.trk-btn--outline3 span.style1 svg g path { stroke: #0C263A; } .trk-btn.active.trk-btn--outline6, .trk-btn:hover.trk-btn--outline6 { background-color: var(--title-color); border-color: var(--title-color); color: #FFFFFF; } .trk-btn.active.trk-btn--primary2 i, .trk-btn.active.trk-btn--primary2 svg, .trk-btn:hover.trk-btn--primary2 i, .trk-btn:hover.trk-btn--primary2 svg { -webkit-transform: translateX(5px); -moz-transform: translateX(5px); -ms-transform: translateX(5px); -o-transform: translateX(5px); transform: translateX(5px); } .trk-btn-active { background-color: var(--secondary-color); border-color: var(--secondary-color); } .text-btn { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; display: inline-flex; font-weight: 600; color: var(--brand-color); } .text-btn::after { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; content: ""; left: 0; bottom: -4px; height: 2px; width: 0%; background-color: var(--brand-color); } .text-btn--style2 { color: var(--secondary-color); } .text-btn--style2::after { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; content: ""; left: 0; bottom: -4px; height: 2px; width: 0%; background-color: var(--secondary-color); } .text-btn i, .text-btn svg { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .text-btn.text-btn--small { font-size: 1rem; color: var(--title-color); font-family: "Open Sans", sans-serif; } .text-btn.text-btn--small span { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .text-btn span { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .text-btn:hover { color: var(--secondary-color); } .text-btn:hover::after { width: 100%; background-color: var(--secondary-color); } .text-btn:hover span { -webkit-transform: translateX(5px); -moz-transform: translateX(5px); -ms-transform: translateX(5px); -o-transform: translateX(5px); transform: translateX(5px); } .btn-group { gap: 20px; } .btn-group--gap-xs { gap: 20px; } .btn-group--gap-sm { gap: 20px; } .btn-group--gap-md { gap: 20px; } .btn-group--gap-lg { gap: 20px; } .preloader { position: fixed; top: 0; left: 0; width: 100%; height: 100%; display: grid; place-items: center; background-color: var(--body-color); z-index: 99999; } .preloader img { -webkit-animation: floating 1s cubic-bezier(0.4, -0.35, 0.01, 1.08) infinite alternate; -moz-animation: floating 1s cubic-bezier(0.4, -0.35, 0.01, 1.08) infinite alternate; -ms-animation: floating 1s cubic-bezier(0.4, -0.35, 0.01, 1.08) infinite alternate; -o-animation: floating 1s cubic-bezier(0.4, -0.35, 0.01, 1.08) infinite alternate; animation: floating 1s cubic-bezier(0.4, -0.35, 0.01, 1.08) infinite alternate; } .lightdark-switch .switch-btn { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; width: 40px; height: 40px; bottom: 5%; left: 5%; border-radius: 8px; z-index: 9999; cursor: pointer; background-color: var(--brand-color); box-shadow: 0px 0 15px 0px rgba(104, 225, 166, 0.7); border: 1px solid var(--brand-color); } .lightdark-switch .switch-btn:hover { border: 1px solid var(--brand-color); box-shadow: 0px 0 15px 2px rgba(104, 225, 166, 0.6); } @media (min-width: 576px) { .lightdark-switch .switch-btn { width: 40px; height: 40px; padding: 10px; bottom: 7%; left: 5%; } } @media (min-width: 768px) { .lightdark-switch .switch-btn { bottom: 7%; left: 5%; } } @media (min-width: 992px) { .lightdark-switch .switch-btn { bottom: auto; left: auto; top: 130px; right: 60px; } } @media (min-width: 1400px) { .lightdark-switch .switch-btn { top: 80px; right: 90px; } } .lightdark-switch .switch-btn img { max-height: 16px; } @media (min-width: 576px) { .lightdark-switch .switch-btn img { max-height: 20px; } } .lightdark-switch .switch-btn.dark-switcher { background-color: var(--bg-white); border-color: var(--bg-white); } .lightdark-switch .switch-btn--style2 { background-color: var(--tertiary-color4); box-shadow: 0px 0 15px 0px rgba(96, 132, 224, 0.7); border: 1px solid var(--tertiary-color4); } .lightdark-switch .switch-btn--style2:hover { border: 1px solid var(--tertiary-color4); box-shadow: 0px 0 15px 2px rgba(96, 132, 224, 0.6); } .social { gap: 10px; } @media (min-width: 768px) { .social { gap: 15px; } } .social--style2 { gap: 25px; } .social__item h6 { font-size: 1.125rem; font-family: "Open Sans", sans-serif; } .social__link { -webkit-transition: background-color 0.2s linear; -moz-transition: background-color 0.2s linear; -ms-transition: background-color 0.2s linear; -o-transition: background-color 0.2s linear; transition: background-color 0.2s linear; background-color: transparent; font-size: 1.125rem; } .social__link--style1 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; background-color: transparent; border: 1px solid var(--social-border-color-2); width: 34px; height: 34px; border-radius: 99px; transition: all 0.3s ease-out; } .social__link--style1 svg, .social__link--style1 i { font-size: 1rem; color: var(--title-color); } @media (min-width: 992px) { .social__link--style1 { height: 40px; width: 40px; } .social__link--style1 i, .social__link--style1 svg { font-size: 1.125rem; } } .social__link--style2 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; background-color: transparent; width: 34px; height: 34px; border-radius: 99px; border: 2px solid var(--social-border-color-3); } @media (min-width: 768px) { .social__link--style2 { width: 40px; height: 40px; } } .social__link--style2 svg, .social__link--style2 i { color: var(--title-color); -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; font-size: 1rem; } @media (min-width: 768px) { .social__link--style2 svg, .social__link--style2 i { font-size: 1.125rem; } } .social__link--style22 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; background-color: transparent; width: 34px; height: 34px; border-radius: 99px; border: 2px solid rgba(255, 255, 255, 0.1); } @media (min-width: 768px) { .social__link--style22 { width: 40px; height: 40px; } } .social__link--style22 svg, .social__link--style22 i { color: var(--bg-white); -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; font-size: 1rem; } @media (min-width: 768px) { .social__link--style22 svg, .social__link--style22 i { font-size: 1.125rem; } } .social__link--style222 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; background-color: transparent; width: 34px; height: 34px; border-radius: 99px; border: 2px solid rgba(255, 255, 255, 0.1); } @media (min-width: 768px) { .social__link--style222 { width: 40px; height: 40px; } } .social__link--style222 svg, .social__link--style222 i { color: var(--bg-white); -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; font-size: 1rem; } @media (min-width: 768px) { .social__link--style222 svg, .social__link--style222 i { font-size: 1.125rem; } } .social__link--style3 { z-index: 3; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; background-color: transparent; border: 1.3px solid var(--social-border-color); font-size: 1rem; width: 32px; height: 32px; line-height: 32px; border-radius: 99px; transition: all 0.3s ease-out; } .social__link--style3 svg, .social__link--style3 i { color: var(--title-color); -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; font-size: inherit; } .social__link--style5 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; background-color: transparent; width: 34px; height: 34px; border-radius: 99px; border: 2px solid rgba(255, 255, 255, 0.1); } @media (min-width: 768px) { .social__link--style5 { width: 40px; height: 40px; } } .social__link--style5 svg, .social__link--style5 i { color: var(--bg-white); -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; font-size: 1rem; } @media (min-width: 768px) { .social__link--style5 svg, .social__link--style5 i { font-size: 1.125rem; } } .social__link--style6 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; background-color: transparent; width: 34px; height: 34px; border-radius: 99px; border: 2px solid var(--tertiary-color); } @media (min-width: 768px) { .social__link--style6 { width: 40px; height: 40px; } } .social__link--style6 svg, .social__link--style6 i { color: var(--title-color); -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; font-size: 1rem; } @media (min-width: 768px) { .social__link--style6 svg, .social__link--style6 i { font-size: 1.125rem; } } .social__link--style6.active svg, .social__link--style6.active i, .social__link--style6:hover svg, .social__link--style6:hover i { color: var(--brand-color); } .social__link--style4 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; background-color: transparent; width: 34px; height: 34px; border-radius: 99px; border: 2px solid var(--tertiary-color2); } @media (min-width: 768px) { .social__link--style4 { width: 40px; height: 40px; } } .social__link--style4 svg, .social__link--style4 i { color: var(--title-color); -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; font-size: 1rem; } @media (min-width: 768px) { .social__link--style4 svg, .social__link--style4 i { font-size: 1.125rem; } } .social__link--style4.active, .social__link--style4:hover { border-color: var(--brand-color); } .social__link--style4.active svg, .social__link--style4.active i, .social__link--style4:hover svg, .social__link--style4:hover i { color: var(--brand-color); } .social__link.active.social__link--style1, .social__link:hover.social__link--style1 { background-color: var(--brand-color); border-color: var(--brand-color); } .social__link.active.social__link--style1 svg, .social__link.active.social__link--style1 i, .social__link:hover.social__link--style1 svg, .social__link:hover.social__link--style1 i { color: #1B2D29; } .social__link.active.social__link--style2, .social__link:hover.social__link--style2 { border-color: var(--brand-color); } .social__link.active.social__link--style2 svg, .social__link.active.social__link--style2 i, .social__link:hover.social__link--style2 svg, .social__link:hover.social__link--style2 i { color: var(--brand-color); } .social__link.active.social__link--style22, .social__link:hover.social__link--style22 { border-color: var(--brand-color); } .social__link.active.social__link--style22 svg, .social__link.active.social__link--style22 i, .social__link:hover.social__link--style22 svg, .social__link:hover.social__link--style22 i { color: var(--brand-color); } .social__link.active.social__link--style222, .social__link:hover.social__link--style222 { border-color: var(--bg-color-10); } .social__link.active.social__link--style222 svg, .social__link.active.social__link--style222 i, .social__link:hover.social__link--style222 svg, .social__link:hover.social__link--style222 i { color: var(--bg-color-10); } .social__link.active.social__link--style3, .social__link:hover.social__link--style3 { background-color: var(--brand-color); border-color: var(--brand-color); } .social__link.active.social__link--style3 svg, .social__link.active.social__link--style3 i, .social__link:hover.social__link--style3 svg, .social__link:hover.social__link--style3 i { color: #0C263A; } .social__link.active.social__link--style5 svg, .social__link.active.social__link--style5 i, .social__link:hover.social__link--style5 svg, .social__link:hover.social__link--style5 i { color: var(--brand-color); } .floating-content__item { background-color: var(--floating-content-bg-color); border: 1px solid var(--floating-content-border-color); box-shadow: -40px 40px 60px 0px rgba(5, 30, 54, 0.05); border-radius: 16px; } @media (min-width: 768px) { .floating-content__item { padding: 24px 32px; } } .floating-content__item h3 { font-family: "Open Sans", sans-serif; line-height: 32px; color: var(--secondary-color); } .floating-content__item h3.style2 { color: var(--brand-color); } .floating-content__item p { font-size: 1.25rem; color: var(--title-color); } .floating-content__item p.style2 { font-size: 1.125rem; } .floating-content__item--style2 { gap: 15px; padding: 16px 0px 16px 36px; border-radius: 8px 40px 32px 80px; border: 2px solid var(--border-color); background-color: var(--floating-content-bg-color-2); backdrop-filter: blur(24px); } @media (min-width: 576px) { .floating-content__item--style2 { padding: 16px 0px 16px 36px; } } @media (min-width: 768px) { .floating-content__item--style2 { padding: 16px 0px 16px 36px; } } @media (min-width: 1200px) { .floating-content__item--style2 { padding: 16px 10px 16px 48px; } } .floating-content__item--style2 img { width: 60px; } @media (min-width: 576px) { .floating-content__item--style2 img { width: 70px; } } @media (min-width: 768px) { .floating-content__item--style2 img { width: auto; } } .floating-content__item--style2 p { max-inline-size: 18ch; } .floating-content__item--style3 { padding: 16px; border-radius: 32px 60px 8px 40px; border: 2px solid var(--border-color); background-color: var(--floating-content-bg-color-2); backdrop-filter: blur(24px); } @media (min-width: 768px) { .floating-content__item--style3 { padding: 16px 20px; } } @media (min-width: 992px) { .floating-content__item--style3 { padding: 25px 30px; } } .floating-content__item--style4 { gap: 15px; padding: 20px; border-radius: 100px 9.126px 9.126px 100px; background: var(--wh-color); box-shadow: -24px 24px 73.0064086914px 0px rgba(0, 208, 148, 0.16); } .floating-content__item--style4 p { font-size: 1.125rem; color: var(--title-color); } .floating-content__item--style4 span { color: var(--title-color); } .floating-content__item--style5 { min-width: 260px; border-radius: 16px; background-color: var(--floating-content-bg-color); box-shadow: -16px 32px 80px 0px rgba(61, 51, 0, 0.12); } .floating-content__item--style5 h3 { color: var(--title-color); } .floating-content__item--style5 p { color: var(--title-color); opacity: 0.7; } @media (min-width: 768px) { .floating-content__item--style5 { padding: 20px; } } @media (min-width: 992px) { .floating-content__item--style5 { padding: 24px 32px; } } .floating-content__item--style6 { min-width: 260px; border-radius: 16px; text-align: left; background-color: var(--floating-content-bg-color); box-shadow: -16px 32px 80px 0px rgba(62, 108, 228, 0.12); } .floating-content__item--style6 h3 { color: var(--title-color); font-family: "Anek Telugu", sans-serif; margin-block-end: -5px; } .floating-content__item--style6 p { color: var(--title-color); opacity: 0.7; font-size: 1rem; } @media (min-width: 768px) { .floating-content__item--style6 { padding: 20px; } } @media (min-width: 992px) { .floating-content__item--style6 { padding: 24px 32px; } } .floating-content__top-left { left: 10px; top: 15px; } @media (min-width: 768px) { .floating-content__top-left { left: 30px; top: 90px; } } @media (min-width: 992px) { .floating-content__top-left { left: 0px; top: 10px; } } @media (min-width: 1200px) { .floating-content__top-left { left: 5px; top: 60px; } } .floating-content__top-left--style2 { left: 0px; top: -15px; } @media (min-width: 576px) { .floating-content__top-left--style2 { left: 0px; top: 30px; } } @media (min-width: 768px) { .floating-content__top-left--style2 { left: -6px; top: 0px; } } @media (min-width: 992px) { .floating-content__top-left--style2 { left: 0px; top: 10px; } } @media (min-width: 1200px) { .floating-content__top-left--style2 { left: 5px; top: 60px; } } .floating-content__top-right { right: 0px; top: 0px; } @media (min-width: 576px) and (max-width: 767px) { .floating-content__top-right { right: -20px; top: 5px; } } @media (min-width: 768px) and (max-width: 991px) { .floating-content__top-right { right: 60px; top: -50px; } } @media (min-width: 992px) { .floating-content__top-right { right: -10px; top: -80px; } } @media (min-width: 768px) { .floating-content__top-right--style2 { right: -20px; top: -80px; } .floating-content__top-right--style2 img { max-width: 70px; } } @media (min-width: 992px) { .floating-content__top-right--style2 { right: 0px; top: -80px; } .floating-content__top-right--style2 img { max-width: 80px; } } @media (min-width: 1200px) { .floating-content__top-right--style2 { right: 5px; top: -55px; } .floating-content__top-right--style2 img { width: auto; } } @media (min-width: 1400px) { .floating-content__top-right--style2 { right: -70px; top: -55px; } } .floating-content__top-right--style3 { right: 10px; top: 20px; } @media (min-width: 576px) and (max-width: 767px) { .floating-content__top-right--style3 { right: 20px; top: 20px; } } @media (min-width: 768px) and (max-width: 991px) { .floating-content__top-right--style3 { right: 15px; top: -60px; } } @media (min-width: 992px) { .floating-content__top-right--style3 { right: 10px; top: 20px; } } @media (min-width: 1200px) { .floating-content__top-right--style3 { right: 70px; top: 20px; } } .floating-content__left-top { left: -10px; top: -47px; } .floating-content__left-top--style2 { left: -10px; top: -40px; } @media (min-width: 576px) { .floating-content__left-top { left: -27px; top: -44px; } } @media (min-width: 768px) { .floating-content__left-top { left: -27px; top: -125px; } } @media (min-width: 992px) { .floating-content__left-top { left: -45px; top: -80px; } } .floating-content__bottom-left { left: 0px; bottom: 0px; } @media (min-width: 576px) { .floating-content__bottom-left--style2 { left: -10px; bottom: 10px; } } @media (min-width: 768px) { .floating-content__bottom-left--style2 { left: -14px; bottom: -27px; } } @media (min-width: 992px) { .floating-content__bottom-left--style2 { left: -33px; bottom: 0px; } } @media (min-width: 1200px) { .floating-content__bottom-left--style2 { left: 30px; bottom: -5px; } } .floating-content__bottom-left--style3 { left: 0px; bottom: 20px; } @media (min-width: 576px) { .floating-content__bottom-left--style3 { left: 0px; bottom: 10px; } } @media (min-width: 768px) { .floating-content__bottom-left--style3 { left: -23px; bottom: 25px; } } @media (min-width: 992px) { .floating-content__bottom-left--style3 { left: -10px; bottom: 31px; } } @media (min-width: 1200px) { .floating-content__bottom-left--style3 { left: 10px; bottom: 31px; } } @media (min-width: 1400px) { .floating-content__bottom-left--style3 { left: -10px; bottom: 31px; } } @media (min-width: 1600px) { .floating-content__bottom-left--style3 { left: -10px; bottom: 31px; } } .floating-content__bottom-right { right: 10px; bottom: 15px; } .floating-content__bottom-right--style2 { right: 70px; bottom: -30px; } @media (min-width: 768px) { .floating-content__bottom-right--style2 { right: 70px; bottom: -30px; } } @media (min-width: 576px) { .floating-content__bottom-right { right: 10px; bottom: 60px; } } @media (min-width: 768px) { .floating-content__bottom-right { right: 70px; bottom: 75px; } } @media (min-width: 992px) { .floating-content__bottom-right { right: 45px; bottom: 2px; } } @media (min-width: 1200px) { .floating-content__bottom-right { right: 23px; bottom: 40px; } } .partner { overflow-x: clip; } .partner__wrapper { z-index: 333; } .partner--gradient:before { content: ""; left: 0; top: 0; height: 100%; width: 100%; background-color: var(--tertiary-color); border-top: 8px solid var(--body-color); border-bottom: 8px solid var(--body-color); z-index: 3; } .partner--gradient::after { content: ""; left: 0; top: -5px; height: 119px; width: 100%; background: linear-gradient(150.39deg, rgb(237, 242, 248) 15.02%, #EDF2F8 99.59%); transform: rotate(2deg); z-index: 2; } @media (min-width: 992px) { .partner--style2 { padding-block: 60px; } } @media (min-width: 1200px) { .partner--style2 { padding-block: 70px; } } @media (min-width: 1400px) { .partner--style2 { padding-block: 80px; } } @media (min-width: 1400px) { .partner--style2 { padding-block: 90px; } } .partner--style2:before { content: ""; left: 0; top: 0; height: 100%; width: 100%; background-color: var(--bg-color-12); z-index: 3; } .feature--style1 .feature__wrapper { z-index: 2; } .feature--style1 .feature__item-content h6 { font-size: 1.125rem; color: var(--text-color); font-family: "Open Sans", sans-serif; } .feature--style1 .feature__image img { border-radius: 20px; } .feature--style1 .feature__thumb { position: relative; z-index: 2; } .feature--style1 .feature__shape-item--1 { width: 50px; top: 5%; left: 71%; z-index: 2; -webkit-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .feature--style1 .feature__shape-item--1 { width: 70px; top: 6%; left: 65%; } } @media (min-width: 768px) { .feature--style1 .feature__shape-item--1 { max-width: 75px; top: 13%; left: 50%; } } @media (min-width: 992px) { .feature--style1 .feature__shape-item--1 { max-width: 100%; top: 19%; left: 46%; } } @media (min-width: 1200px) { .feature--style1 .feature__shape-item--1 { top: 19%; left: 50%; } } @media (min-width: 1400px) { .feature--style1 .feature__shape-item--1 { top: 19%; left: 50%; } } .feature--style1 .feature__shape-item--2 { content: ""; height: 92%; width: 920px; border: 2px solid var(--bg-grad-color); padding: 40px; border-bottom-left-radius: 25%; top: 0%; right: -3%; transform: rotate(-10deg); display: none; } @media (min-width: 768px) { .feature--style1 .feature__shape-item--2 { display: block; width: 570px; top: -8%; right: -24%; } } @media (min-width: 992px) { .feature--style1 .feature__shape-item--2 { width: 570px; top: -10%; right: -4%; } } @media (min-width: 1200px) { .feature--style1 .feature__shape-item--2 { height: 100%; width: 725px; top: -12%; right: -4%; } } @media (min-width: 1400px) { .feature--style1 .feature__shape-item--2 { width: 1000px; top: -12%; right: -15%; } } @media (min-width: 1600px) { .feature--style1 .feature__shape-item--2 { width: 1000px; top: -12%; right: -4%; } } .feature--style1 .feature__shape-item--2 span { position: absolute; content: ""; height: 96%; width: 700px; background: linear-gradient(219deg, var(--bg-grad-color-trans) 0%, var(--bg-grad-color) 100%); border-bottom-left-radius: 25%; top: 5%; right: -1%; } @media (min-width: 768px) { .feature--style1 .feature__shape-item--2 span { width: 550px; top: 0%; right: -1%; } } @media (min-width: 992px) { .feature--style1 .feature__shape-item--2 span { width: 550px; top: 0%; right: -1%; } } @media (min-width: 1200px) { .feature--style1 .feature__shape-item--2 span { height: 97%; width: 700px; top: 0%; right: -1%; } } @media (min-width: 1400px) { .feature--style1 .feature__shape-item--2 span { width: 980px; top: 0%; right: -1%; } } .feature--style2 .feature__item-inner { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; background-color: var(--body-color); padding: 16px; border-radius: 8px; } .feature--style2 .feature__item-thumb { margin-block-end: 24px; } .feature--style2 .feature__item:hover { transform: translateY(-10px); cursor: pointer; } .feature--style2 .feature__shape-item--1 { width: 40px; top: 1%; left: 6%; -webkit-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .feature--style2 .feature__shape-item--1 { width: 80px; top: 3%; left: 7%; } } @media (min-width: 768px) { .feature--style2 .feature__shape-item--1 { top: 8%; left: 3%; } } @media (min-width: 992px) { .feature--style2 .feature__shape-item--1 { width: auto; top: 15%; left: 2%; } } @media (min-width: 1200px) { .feature--style2 .feature__shape-item--1 { top: 15%; left: 2%; } } @media (min-width: 1400px) { .feature--style2 .feature__shape-item--1 { top: 15%; left: 8%; } } @media (min-width: 1600px) { .feature--style2 .feature__shape-item--1 { top: 15%; left: 19%; } } .service__item-inner { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; border-radius: 16px; } @media (min-width: 768px) { .service__item-inner { padding-block: 52px; padding-inline: 32px; } } .service__item-thumb { border-radius: 99px; background-color: var(--wh-color); box-shadow: 0px 8px 24px rgba(12, 52, 91, 0.04); } .service__item-content h5 { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } @supports (-webkit-line-clamp: 1) { .service__item-content h5 { overflow: hidden; text-overflow: ellipsis; white-space: initial; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; } } .service__item-content p { white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } @supports (-webkit-line-clamp: 3) { .service__item-content p { overflow: hidden; text-overflow: ellipsis; white-space: initial; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } } .service__item--style1 .service__item-inner { background: linear-gradient(152deg, var(--bg-color-trans) 0%, var(--bg-color) 100%); border: 2px solid var(--service-item-border-color); } .service__item--style1:hover .service__item-inner { transform: translateY(-5px); border: 2px solid var(--brand-color); } .service__item--style1:hover .service__item-thumb { background-color: var(--wh-color); } .service__item--style1:hover .service__item-content h5 a { color: var(--title-color); } .service__item--style2 .service__item-inner { background: var(--service-item-bg-color); border: 2px solid transparent; } .service__item--style2 .service__item-content h5 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .service__item--style2:hover .service__item-inner { transform: translateY(-5px); border: 2px solid var(--brand-color); } .service__item--style2:hover .service__item-thumb { background-color: var(--wh-color); } .service__item--style2:hover .service__item-content h5 a { color: var(--title-color); } .service__item--style3 .service__item-inner { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; background-color: var(--service-item-bg-color); border-radius: 4px; } .service__item--style3 .service__item-thumb { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; background-color: var(--bg-color-10); box-shadow: none; } .service__item--style3:hover .service__item-inner { transform: translateY(-5px); background-color: var(--bg-color-10); } .service__item--style3:hover .service__item-thumb { background-color: #fff; } .service__item--style3:hover .service__item-content h5 a { color: var(--title-color); } .service__item--style3:hover .service__item-content p { color: #0C263A; } .service__shape-item--1 { width: 40px; top: 1%; left: 6%; -webkit-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .service__shape-item--1 { top: 3%; left: 7%; } } @media (min-width: 768px) { .service__shape-item--1 { width: auto; top: 2%; left: 1%; } } @media (min-width: 992px) { .service__shape-item--1 { left: 4%; top: 4%; } } @media (min-width: 1200px) { .service__shape-item--1 { top: 5%; left: 5%; } } @media (min-width: 1400px) { .service__shape-item--1 { top: 8%; left: 5%; } } .service__shape-item--2 { width: 40px; top: 1%; left: 6%; -webkit-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .service__shape-item--2 { top: 3%; left: 7%; } } @media (min-width: 768px) { .service__shape-item--2 { width: 70px; top: 6%; left: 4%; } } @media (min-width: 992px) { .service__shape-item--2 { width: auto; left: 5%; top: 10%; } } @media (min-width: 1200px) { .service__shape-item--2 { top: 10%; left: 9%; } } @media (min-width: 1400px) { .service__shape-item--2 { top: 11%; left: 17%; } } .service__shape-item--3 { top: 0.5%; right: 2%; width: 50px; -webkit-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .service__shape-item--3 { width: 70px; top: 2%; right: 8%; } } @media (min-width: 768px) { .service__shape-item--3 { width: auto; top: 2%; right: 8%; } } @media (min-width: 992px) { .service__shape-item--3 { top: auto; bottom: 3%; right: 4%; } } @media (min-width: 1200px) { .service__shape-item--3 { bottom: 4%; right: 4%; } } @media (min-width: 1400px) { .service__shape-item--3 { bottom: 4%; right: 4%; } } @media (min-width: 1600px) { .service__shape-item--3 { bottom: 6%; right: 13%; } } .pricing__item { z-index: 2; } .pricing__item-inner { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; background-color: var(--wh-color); border: 2px solid transparent; box-shadow: 0px 16px 40px 0px rgba(26, 64, 137, 0.06); border-radius: 16px; } .pricing__item-inner.active, .pricing__item-inner:hover { border: 2px solid var(--brand-color); box-shadow: 0px 32px 80px 0px rgba(26, 64, 137, 0.12); } @media (min-width: 576px) { .pricing__item-inner { padding-block: 32px; padding-inline: 25px; } } .pricing__item-inner--style2 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .pricing__item-inner--style2.active, .pricing__item-inner--style2:hover { border: 2px solid var(--secondary-color); box-shadow: 0px 32px 80px 0px rgba(26, 64, 137, 0.12); } .pricing__item-top { border-bottom: 1px solid var(--border-color-11); } .pricing__item-top h6 { text-transform: uppercase; } .pricing__item-top h3 { color: var(--secondary-color); } .pricing__item-top h3 span { font-size: 1.125rem; font-family: "Open Sans", sans-serif; color: var(--text-color-4); } .pricing__item--style2 .pricing__item-top h3 { color: var(--title-color); } .pricing__item--style2 .pricing__item-top h3 span { color: var(--title-color); opacity: 0.8; } .pricing__item--style2 .pricing__item-inner { border-radius: 4px; border: 1px solid rgba(229, 237, 248, 0.47); box-shadow: 0px 16px 40px 0px rgba(26, 64, 137, 0.06); padding: 48px 40px; } @media (min-width: 768px) { .pricing__item--style2 .pricing__item-inner { padding: 40px 30px; } } @media (min-width: 1200px) { .pricing__item--style2 .pricing__item-inner { padding: 48px 40px; } } .pricing__item--style2 .pricing__item-inner.active { background-color: var(--bg-color-10); } .pricing__item--style2 .pricing__item-inner.active h3 { color: #0C263A; } .pricing__item--style2 .pricing__item-inner.active .pricing__item-top { border-bottom: 1px solid rgba(28, 27, 27, 0.3490196078); } .pricing__list-item { color: var(--title-color); } .pricing__list-item--mute { opacity: 0.4; } .pricing__shape-item--1 { content: ""; height: 95%; border: 2px solid var(--bg-shape-color-2); padding: 40px; border-radius: 100px 213px 100px 100px; opacity: 0.4; transform: rotate(25deg); display: none; } @media (min-width: 768px) { .pricing__shape-item--1 { display: block; width: 1050px; top: 3%; left: -6%; } } @media (min-width: 992px) { .pricing__shape-item--1 { top: 8%; left: 12%; } } @media (min-width: 1200px) { .pricing__shape-item--1 { top: 0%; left: 11%; } } @media (min-width: 1400px) { .pricing__shape-item--1 { left: 27%; } } .pricing__shape-item--1 span { position: absolute; content: ""; height: 96%; width: 1000px; background: linear-gradient(4deg, var(--bg-shape-color-trans-2) 0%, var(--bg-shape-color-2) 100%); border-radius: 100px 213px 100px 100px; } @media (min-width: 768px) { .pricing__shape-item--1 span { top: 2%; left: 2%; } } @media (min-width: 1200px) { .pricing__shape-item--1 span { width: 1000px; top: 2%; left: 2%; } } .pricing__shape-item--2 { width: 40px; top: 1%; right: 6%; -webkit-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .pricing__shape-item--2 { top: 3%; right: 7%; } } @media (min-width: 768px) { .pricing__shape-item--2 { width: auto; top: 6%; right: 6%; } } @media (min-width: 992px) { .pricing__shape-item--2 { right: 5%; top: 5%; } } @media (min-width: 1200px) { .pricing__shape-item--2 { top: 6%; right: 6%; } } @media (min-width: 1400px) { .pricing__shape-item--2 { top: 2%; right: 6%; } } .pricing__shape-item--3 { content: ""; height: 100%; border: 2px solid var(--bg-shape-color-2); padding: 40px; border-radius: 100px 213px 100px 100px; opacity: 0.4; transform: rotate(132deg); display: none; } @media (min-width: 768px) { .pricing__shape-item--3 { display: block; width: 1050px; top: -45%; right: -45%; } } @media (min-width: 992px) { .pricing__shape-item--3 { width: 1200px; top: -45%; right: -45%; } } @media (min-width: 1200px) { .pricing__shape-item--3 { width: 1200px; top: -45%; right: -26%; } } @media (min-width: 1400px) { .pricing__shape-item--3 { top: -40%; right: -13%; } } @media (min-width: 1600px) { .pricing__shape-item--3 { top: -45%; right: 0%; } } .pricing__shape-item--3 span { position: absolute; content: ""; height: 96%; width: 1000px; background: linear-gradient(4deg, var(--bg-shape-color-trans-2) 0%, var(--bg-shape-color-2) 100%); border-radius: 100px 213px 100px 100px; } @media (min-width: 768px) { .pricing__shape-item--3 span { top: 2%; right: 2%; } } @media (min-width: 1200px) { .pricing__shape-item--3 span { width: 1000px; top: 2%; right: 2%; } } @media (min-width: 1400px) { .pricing__shape-item--3 span { width: 1200px; top: 2%; right: 2%; } } .pricing__shape-item--4 { width: 40px; top: 1%; right: 6%; -webkit-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .pricing__shape-item--4 { top: 3%; right: 7%; } } @media (min-width: 768px) { .pricing__shape-item--4 { width: auto; top: 6%; right: 6%; } } @media (min-width: 992px) { .pricing__shape-item--4 { right: 5%; top: 10%; } } @media (min-width: 1200px) { .pricing__shape-item--4 { top: 10%; right: 6%; } } @media (min-width: 1400px) { .pricing__shape-item--4 { top: 11%; right: 20%; } } @media (min-width: 1400px) { .pricing__shape-item--4 { top: 11%; right: 20%; } } .pricing__shape-item--5 { width: 40px; top: 1%; left: 6%; -webkit-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .pricing__shape-item--5 { top: 3%; left: 7%; } } @media (min-width: 768px) { .pricing__shape-item--5 { width: 70px; top: 6%; left: 4%; } } @media (min-width: 992px) { .pricing__shape-item--5 { width: auto; left: 5%; top: 10%; } } @media (min-width: 1200px) { .pricing__shape-item--5 { top: 10%; left: 9%; } } @media (min-width: 1400px) { .pricing__shape-item--5 { top: 11%; left: 17%; } } .pricing__shape-item--6 { top: 0.5%; right: 2%; width: 50px; -webkit-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .pricing__shape-item--6 { width: 70px; top: 2%; right: 8%; } } @media (min-width: 768px) { .pricing__shape-item--6 { width: auto; top: auto; bottom: 18%; right: 15%; } } @media (min-width: 992px) { .pricing__shape-item--6 { bottom: 3%; right: 4%; } } @media (min-width: 1200px) { .pricing__shape-item--6 { bottom: 4%; right: 4%; } } @media (min-width: 1400px) { .pricing__shape-item--6 { bottom: 4%; right: 4%; } } @media (min-width: 1600px) { .pricing__shape-item--6 { bottom: 6%; right: 13%; } } .team__item-inner { background-color: var(--bg-team); border-radius: 12px; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .team__item-thumb { border-radius: 8px; } .team__item-thumb img { transition: all 0.3s ease-in-out; object-fit: cover; } .team__item-thumb--style1 img { transform: translateY(15px); } .team__item-content { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; bottom: 0; left: 0; width: 100%; } .team__item-content--style1 { padding: 8px; } .team__item-author { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .team__item-author--style1 { background-color: rgba(255, 255, 255, 0.8); backdrop-filter: blur(5px); padding: 12px 8px; border-radius: 8px; } .team__item-author--style2 { background-color: var(--wh-color); border-top-left-radius: 16px; border-top-right-radius: 16px; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; border: 2px solid var(--social-border-color); } .team__item-author--style2 .team__item-authorinfo h6 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; font-family: "Anek Telugu", sans-serif; color: var(--title-color); } .team__item-author--style2 .team__item-authorinfo h6:hover { color: var(--brand-color); } .team__item-authorinfo h6 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; font-family: "Open Sans", sans-serif; color: var(--title-color); z-index: 2; } .team__item-authorinfo h6:hover { color: var(--brand-color); } .team__item-authorinfo p { font-size: 0.875rem; } .team__item-shape1 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; opacity: 0.5; top: 45px; left: 18px; } @media (min-width: 768px) { .team__item-shape1 { top: 45px; left: 18px; } } @media (min-width: 992px) { .team__item-shape1 { width: 35px; top: 25px; left: 20px; } } @media (min-width: 1200px) { .team__item-shape1 { width: auto; top: 45px; left: 18px; } } .team__item-shape2 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; opacity: 0.1; top: 70px; right: 25px; } @media (min-width: 768px) { .team__item-shape2 { top: 70px; right: 25px; } } @media (min-width: 992px) { .team__item-shape2 { width: 35px; top: 60px; right: 18px; } } @media (min-width: 1200px) { .team__item-shape2 { width: auto; top: 70px; right: 25px; } } .team__item-shape3 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; opacity: 0.1; bottom: 200px; left: 25px; } @media (min-width: 576px) { .team__item-shape3 { bottom: 136px; left: 25px; } } @media (min-width: 768px) { .team__item-shape3 { bottom: 200px; left: 25px; } } @media (min-width: 992px) { .team__item-shape3 { width: 35px; bottom: 130px; left: 17px; } } @media (min-width: 1200px) { .team__item-shape3 { width: auto; bottom: 136px; left: 25px; } } .team__item--bgcolor2 .team__item-inner { background-color: var(--tertiary-color); } .team__item:hover .team__item-author h6 { color: var(--brand-color); } .team__item:hover .team__item-thumb--style1 img { transform: translateY(0); } .team__item:hover .team__item-thumb--style2 img { -webkit-transform: scale(1.06); -moz-transform: scale(1.06); -ms-transform: scale(1.06); -o-transform: scale(1.06); transform: scale(1.06); } .team__item:hover .team__item-shape1, .team__item:hover .team__item-shape2, .team__item:hover .team__item-shape3 { opacity: 1; transform: rotate(45deg); } .team--details .team__thumb { border-radius: 20px; } .team--details .team__thumb img { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; object-fit: cover; } .team--details .team__thumb img:hover { -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); transform: scale(1.05); } .team--details .team__content h3 { line-height: 1.1; } .team--details .team__content > span { color: var(--warning-color); } .team--details .team__content > span i, .team--details .team__content > span svg { color: var(--warning-color); } .blog__wrapper { z-index: 2; } .blog__bg-element img { left: 0; top: 0; background-repeat: no-repeat; background-size: cover; background-position: center; opacity: 0.8; } .blog__item-inner { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; background-color: var(--wh-color); border: 2px solid transparent; box-shadow: 0px 16px 48px 0px rgba(6, 35, 63, 0.03), 0px -16px 48px 0px rgba(6, 35, 63, 0.03); border-radius: 16px; } .blog__item-inner:hover { border: 2px solid var(--brand-color); box-shadow: none; } .blog__item-inner:hover .blog__thumb img { -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); transform: scale(1.05); } .blog__item-inner:hover .blog__content h5 { color: var(--brand-color); } .blog__item-inner--style2 { border: none; } .blog__item-inner--style2:hover { border: none; box-shadow: 0px 8px 16px rgba(3, 23, 41, 0.08); } .blog__item-inner--style2:hover .blog__thumb img { -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); transform: scale(1.05); } .blog__item-inner--style2:hover .blog__content h5 { color: var(--secondary-color); } .blog__item--style3 .blog__item-inner { border-radius: 8px; box-shadow: none; } .blog__item--style3 .blog__item-inner:hover { border: 2px solid var(--tertiary-color4); } .blog__item--style3 .blog__item-inner:hover .blog__content h5 a { color: var(--tertiary-color4); } .blog__item--style3 .blog__thumb { border-radius: 4px; } .blog__thumb { border-radius: 8px; } .blog__thumb img { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .blog__content h5 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .blog__content h5.style2:hover a { color: var(--secondary-color); } .blog__writer { gap: 10px; } .blog__writer-thumb img { border-radius: 99px; max-width: 50px; } .blog__writer-designation h6 { font-size: 1rem; font-family: "Open Sans", sans-serif; color: var(--title-color); } .blog__writer-designation p { font-size: 1.125rem; color: var(--title-color); margin-bottom: -3px; } .blog__writer-designation span { font-size: 0.875rem; color: var(--text-color); } @media (min-width: 1200px) { .blog__meta { padding-block: 16px; } } .blog__meta-tag { font-size: 0.875rem; padding: 3px 12px; border-radius: 8px; text-transform: capitalize; } .blog__meta-tag--style1 { color: var(--secondary-color); background-color: var(--bg-color-7); } .blog__meta-tag--style2 { color: var(--brand-color); background-color: var(--tertiary-color); } .blog__shape-item--1 { content: ""; border: 2px solid var(--bg-shape-color); padding: 40px; border-radius: 100px 100px 229px 100px; transform: rotate(65deg); border-top: transparent; display: none; } @media (min-width: 768px) { .blog__shape-item--1 { display: block; height: 80%; width: 1000px; top: -14%; left: -36%; } } @media (min-width: 992px) { .blog__shape-item--1 { top: -6%; left: -28%; } } @media (min-width: 1200px) { .blog__shape-item--1 { height: 95%; top: -17%; left: -10%; } } @media (min-width: 1400px) { .blog__shape-item--1 { top: -17%; left: 0%; } } .blog__shape-item--1 span { position: absolute; content: ""; height: 94%; width: 980px; border-radius: 100px 100px 236px 100px; background: linear-gradient(180deg, var(--bg-shape-color-trans) 0%, var(--bg-shape-color) 100%); opacity: 0.6; } @media (min-width: 768px) { .blog__shape-item--1 span { top: 3%; left: -1%; } } .blog-details__item-inner { background-color: var(--wh-color); box-shadow: 0px -16px 48px rgba(6, 35, 63, 0.03), 0px 16px 48px rgba(6, 35, 63, 0.03); border-radius: 4px; } @media (min-width: 768px) { .blog-details__item-inner { padding: 50px; } } .blog-details__thumb { border-radius: 16px; } .blog-details__thumb img { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; object-fit: cover; } .blog-details__thumb:hover img { -webkit-transform: scale(1.01); -moz-transform: scale(1.01); -ms-transform: scale(1.01); -o-transform: scale(1.01); transform: scale(1.01); } .blog-details__meta { color: var(--text-color-light); } @media (min-width: 576px) { .blog-details__meta ul { display: flex; flex-wrap: wrap; gap: 18px; } } @media (min-width: 768px) { .blog-details__meta ul { gap: 30px; } } .blog-details__meta ul li { gap: 10px; text-transform: capitalize; } @media (max-width: 767px) { .blog-details__meta ul li { margin-block: 5px; } } .blog-details__meta ul li a { color: var(--text-color-light); } .blog-details__meta ul li i, .blog-details__meta ul li svg { margin-inline-end: 8px; } @media (max-width: 767px) { .blog-details__meta ul li i, .blog-details__meta ul li svg { margin-inline-end: 5px; } } .blog-details__content p { color: var(--text-color); } .blog-details__segment-thumb img { border-radius: 8px; } .blog-details__action-inner { border-top: 1px solid var(--border-color); border-bottom: 1px solid var(--border-color); gap: 20px; } @media (min-width: 992px) { .blog-details__action-inner { padding-block: 28px; } } .blog-details__commentform { background-color: var(--tertiary-color3); border-radius: 16px; } @media (min-width: 992px) { .blog-details__commentform { padding: 40px; } } .testimonial__item-content p { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; border-bottom: 1px solid #E6EDFB; } @media (min-width: 1200px) { .testimonial__item-content p { padding-bottom: 32px; } } .testimonial__item--style1 .testimonial__item-inner { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; background-color: var(--wh-color); border: 2px solid transparent; border-radius: 16px; } .testimonial__item--style1 .testimonial__item-inner:hover { border: 2px solid var(--brand-color); } .testimonial__item--style2 .testimonial__item-inner { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; border-radius: 16px; background-color: var(--wh-color); border: 2px solid transparent; } .testimonial__item--style2 .testimonial__item-inner:hover { border: 2px solid var(--secondary-color); } .testimonial__item--style3 .testimonial__item-inner { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; border-radius: 4px; background: var(--bg-color-14); max-width: 507px; } @media (min-width: 1200px) { .testimonial__item--style3 .testimonial__item-inner { padding: 32px; } } .testimonial__item--style3 .testimonial__item-content { flex: 1; max-width: 378px; } .testimonial__item--style3 .testimonial__item-content p { font-size: 1.125rem; color: var(--title-color); border-bottom: none !important; font-style: italic; } .testimonial__item--style3 .testimonial__item-quote span i, .testimonial__item--style3 .testimonial__item-quote span svg { font-size: calc(1.375rem + 1.2857142857vw); -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; color: var(--bg-color-18); } @media (min-width: 1400px) { .testimonial__item--style3 .testimonial__item-quote span i, .testimonial__item--style3 .testimonial__item-quote span svg { font-size: 2.5rem; } } .testimonial__item--style4 .testimonial__item-inner { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; background-color: var(--wh-color); border-radius: 4px; } .testimonial__item--style4 .testimonial__quote i, .testimonial__item--style4 .testimonial__quote svg { color: var(--tertiary-color4); } .testimonial__item--style4:hover .testimonial__item-inner:hover { background-color: var(--bg-color-10); } .testimonial__item--style4:hover .testimonial__item-inner:hover p { border-bottom: 1px solid rgba(20, 24, 33, 0.48); } .testimonial__item--style4:hover .testimonial__item-content p { color: #0C263A; } .testimonial__item--style4:hover .testimonial__quote i, .testimonial__item--style4:hover .testimonial__quote svg { color: var(--bg-color-11); } .testimonial__item--style4:hover .testimonial__author h6 { color: #0C263A; } .testimonial__item--style4:hover .testimonial__author span { color: #0C263A; } .testimonial__item:hover .testimonial__item-inner { box-shadow: 0px 16px 40px rgba(153, 161, 172, 0.12); } .testimonial__item:hover .testimonial__quote i, .testimonial__item:hover .testimonial__quote svg { opacity: 1; } @media (min-width: 1200px) { .testimonial__footer { margin-top: 32px; } } .testimonial__author { gap: 15px; } .testimonial__author-thumb img { border-radius: 99px; max-width: 60px; } .testimonial__author-designation h6 { line-height: 1.1; } .testimonial__author-designation p { font-size: 1.125rem; line-height: 1.15; color: var(--title-color); } .testimonial__author-designation span { font-size: 0.875rem; color: var(--title-color); opacity: 0.8; } .testimonial__author-designation--style2 p { color: var(--title-color); } .testimonial__author-designation--style2 span { color: var(--text-color); } .testimonial__quote span i, .testimonial__quote span svg { font-size: calc(1.375rem + 1.2857142857vw); -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; color: var(--brand-color); opacity: 0.5; } @media (min-width: 1400px) { .testimonial__quote span i, .testimonial__quote span svg { font-size: 2.5rem; } } .testimonial__quote--style2 span i, .testimonial__quote--style2 span svg { color: var(--secondary-color); } .cta__newsletter-inner { gap: 30px; background-color: var(--brand-color); border-radius: 24px; width: 98%; margin: 0 auto; z-index: 2; } .cta__newsletter-inner--style3 { background-color: var(--bg-color-10); } @media (max-width: 767px) { .cta__newsletter-inner { text-align: center; } } @media (min-width: 576px) { .cta__newsletter-inner { width: 85%; } } @media (min-width: 768px) { .cta__newsletter-inner { padding-inline: 30px; padding-block: 40px; width: 80%; display: flex; align-items: center; gap: 30px; padding-inline: 30px; padding-block: 40px; } } @media (min-width: 992px) { .cta__newsletter-inner { padding: 55px; } } @media (min-width: 1200px) { .cta__newsletter-inner { padding-inline: 90px; padding-block: 55px; } } .cta__thumb { width: 32%; } @media (max-width: 767px) { .cta__thumb { margin-inline: auto; margin-block-end: 20px; } } .cta__thumb::after { position: absolute; content: ""; top: 50%; left: 50%; height: 50px; width: 50px; backdrop-filter: blur(10px); filter: blur(100px); background-color: var(--cta-img-bg-shadow); transform: translate(-50%, -50%); z-index: -1; } @media (min-width: 768px) { .cta__thumb::after { height: 100px; width: 100px; } } @media (min-width: 992px) { .cta__thumb::after { height: 150px; width: 150px; } } @media (min-width: 1200px) { .cta__thumb::after { height: 200px; width: 200px; } } .cta__thumb--style2::after { position: absolute; content: ""; top: 50%; left: 50%; height: 50px; width: 50px; backdrop-filter: blur(10px); filter: blur(100px); background-color: var(--cta-img-bg-shadow); transform: translate(-50%, -50%); z-index: -1; opacity: 0.5; } @media (min-width: 768px) { .cta__thumb--style2::after { height: 100px; width: 100px; } } @media (min-width: 992px) { .cta__thumb--style2::after { height: 150px; width: 150px; } } @media (min-width: 1200px) { .cta__thumb--style2::after { height: 200px; width: 200px; } } .cta__subscribe { flex: 1; } .cta__subscribe h2 { color: #0C263A; } .cta__subscribe h2 span { color: #0A4FD5; } @media (max-width: 767px) { .cta__subscribe h2 { margin-block-end: 5px; } } @media (min-width: 768px) and (max-width: 991px) { .cta__subscribe h2 { font-size: calc(1.325rem + 0.7714285714vw); } } @media (min-width: 768px) and (max-width: 991px) and (min-width: 1400px) { .cta__subscribe h2 { font-size: 2rem; } } .cta__subscribe p { color: #0C263A; } @media (min-width: 768px) { .cta__subscribe p { margin-block-end: 15px; } } @media (min-width: 992px) { .cta__subscribe p { margin-bottom: 40px; } } .cta__shape-item--1 { top: -13%; left: -1%; width: 40px; -webkit-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .cta__shape-item--1 { width: 60px; top: -15%; left: -3%; } } @media (min-width: 768px) { .cta__shape-item--1 { width: auto; top: -21%; left: 0%; } } @media (min-width: 992px) { .cta__shape-item--1 { top: -15%; left: 3%; } } @media (min-width: 1200px) { .cta__shape-item--1 { top: -15%; left: 3%; } } @media (min-width: 1400px) { .cta__shape-item--1 { top: -15%; left: 3%; } } .cta__shape-item--2 { -webkit-animation: light 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: light 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: light 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: light 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: light 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 768px) { .cta__shape-item--2 { display: block; top: -35%; left: 10%; width: 70%; } } @media (min-width: 992px) { .cta__shape-item--2 { width: auto; top: -32%; left: 20%; } } @media (min-width: 1200px) { .cta__shape-item--2 { top: -32%; left: 25%; } } @media (min-width: 1400px) { .cta__shape-item--2 { top: -32%; left: 25%; } } .cta__shape-item--3 { bottom: -11%; right: -3%; width: 50px; -webkit-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .cta__shape-item--3 { width: 70px; bottom: -11%; right: -3%; } } @media (min-width: 768px) { .cta__shape-item--3 { width: auto; bottom: -20%; right: -3%; } } @media (min-width: 992px) { .cta__shape-item--3 { bottom: -20%; right: 0%; } } @media (min-width: 1200px) { .cta__shape-item--3 { bottom: -20%; right: 0%; } } @media (min-width: 1400px) { .cta__shape-item--3 { bottom: -20%; right: 0%; } } .cta--style2 { margin: 0 auto; margin-bottom: -140px; z-index: 3; overflow: visible; } @media (min-width: 576px) { .cta--style2 { margin-bottom: -180px; } } .story__wrapper { z-index: 2; } .story__thumb-inner { object-fit: cover; transition: all 0.3s ease-out; } .story__thumb-inner img { border-radius: 24px; } .story__thumb-playbtn a i, .story__thumb-playbtn a svg { color: var(--bg-white); font-size: calc(1.475rem + 2.3142857143vw); -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } @media (min-width: 1400px) { .story__thumb-playbtn a i, .story__thumb-playbtn a svg { font-size: 3.5rem; } } @media (min-width: 768px) { .story__thumb-playbtn a i, .story__thumb-playbtn a svg { font-size: calc(1.5rem + 2.5714285714vw); } } @media (min-width: 768px) and (min-width: 1400px) { .story__thumb-playbtn a i, .story__thumb-playbtn a svg { font-size: 3.75rem; } } @media (min-width: 992px) { .story__thumb-playbtn a i, .story__thumb-playbtn a svg { font-size: calc(1.5125rem + 2.7vw); } } @media (min-width: 992px) and (min-width: 1400px) { .story__thumb-playbtn a i, .story__thumb-playbtn a svg { font-size: 3.875rem; } } .story__thumb-playbtn:hover a i, .story__thumb-playbtn:hover a svg { color: var(--brand-color); } .story__shape-item--1 { content: ""; height: 100%; border: 2px solid var(--bg-shape-color-2); padding: 40px; border-radius: 100px 213px 100px 100px; opacity: 0.4; transform: rotate(132deg); display: none; } @media (min-width: 768px) { .story__shape-item--1 { display: block; width: 1050px; top: -10%; right: -45%; } } @media (min-width: 992px) { .story__shape-item--1 { width: 1200px; top: -30%; right: -45%; } } @media (min-width: 1200px) { .story__shape-item--1 { width: 1200px; top: 0%; right: -22%; } } @media (min-width: 1400px) { .story__shape-item--1 { top: 0%; right: -13%; } } @media (min-width: 1600px) { .story__shape-item--1 { top: -8%; right: 0%; } } .story__shape-item--1 span { position: absolute; content: ""; height: 96%; width: 1000px; background: linear-gradient(4deg, var(--bg-shape-color-trans-2) 0%, var(--bg-shape-color-2) 100%); border-radius: 100px 213px 100px 100px; } @media (min-width: 768px) { .story__shape-item--1 span { top: 2%; right: 2%; } } @media (min-width: 1200px) { .story__shape-item--1 span { width: 1000px; top: 2%; right: 2%; } } @media (min-width: 1400px) { .story__shape-item--1 span { width: 1200px; top: 2%; right: 2%; } } .sidebar__head h3 { border-bottom: 1px solid var(--border-color-5); } .sidebar__head h6 { border-bottom: 1px solid var(--border-color-5); } .sidebar__search { background-color: var(--wh-color); box-shadow: 0px -16px 48px rgba(6, 35, 63, 0.03), 0px 16px 48px rgba(6, 35, 63, 0.03); border-radius: 4px; } .sidebar__search form { background-color: var(--wh-color); border-radius: 8px; } .sidebar__search form input { background-color: var(--bg-color-6); border-color: var(--border-color); border-radius: 8px; cursor: text; } .sidebar__search form input:focus { box-shadow: none; border-color: var(--brand-color); } .sidebar__search form button { content: ""; padding: 11px; top: 14%; right: 10px; line-height: 10px; border: none; outline: none; border-radius: 99px; background-color: var(--brand-color); color: var(--wh-color); } .sidebar__search form button i, .sidebar__search form button svg { font-size: 1.125rem; } .sidebar__recentpost { background-color: var(--wh-color); box-shadow: 0px -16px 48px rgba(6, 35, 63, 0.03), 0px 16px 48px rgba(6, 35, 63, 0.03); border-radius: 4px; } .sidebar__recentpost-body ul li:last-child { margin-block-end: 0; } .sidebar__recentpost-inner { gap: 15px; } @media (min-width: 992px) { .sidebar__recentpost-inner { gap: 10px; } } @media (min-width: 1200px) { .sidebar__recentpost-inner { gap: 15px; } } .sidebar__recentpost-thumb { max-width: 100px; border-radius: 8px; } @media (min-width: 992px) { .sidebar__recentpost-thumb { max-width: 45px; } } @media (min-width: 1200px) { .sidebar__recentpost-thumb { max-width: 100px; } } .sidebar__recentpost-thumb img { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; object-fit: cover; } .sidebar__recentpost-thumb img:hover { -webkit-transform: scale(1.09); -moz-transform: scale(1.09); -ms-transform: scale(1.09); -o-transform: scale(1.09); transform: scale(1.09); } .sidebar__recentpost-content p { font-size: 1rem; color: var(--title-color); font-family: "Anek Telugu", sans-serif; } .sidebar__recentpost-content p a { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; color: var(--title-color); } .sidebar__recentpost-content span { font-size: 0.875rem; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; color: var(--text-color); } .sidebar__recentpost-content:hover p a { color: var(--brand-color); } .sidebar__recentpost-content:hover span { color: var(--brand-color); } .sidebar__categorie { background-color: var(--wh-color); box-shadow: 0px -16px 48px rgba(6, 35, 63, 0.03), 0px 16px 48px rgba(6, 35, 63, 0.03); border-radius: 4px; } .sidebar__categorie-body ul li:last-child { margin-block-end: 0; } .sidebar__categorie-body ul li span, .sidebar__categorie-body ul li a { font-size: 1rem; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; color: var(--title-color); } .sidebar__categorie-body ul li.active span, .sidebar__categorie-body ul li.active a, .sidebar__categorie-body ul li:hover span, .sidebar__categorie-body ul li:hover a { color: var(--brand-color); } .sidebar__categorie-body ul li a i { color: var(--text-color-light); } .sidebar__social { background-color: var(--wh-color); box-shadow: 0px -16px 48px rgba(6, 35, 63, 0.03), 0px 16px 48px rgba(6, 35, 63, 0.03); border-radius: 4px; } .sidebar__tags { background-color: var(--wh-color); box-shadow: 0px -16px 48px rgba(6, 35, 63, 0.03), 0px 16px 48px rgba(6, 35, 63, 0.03); border-radius: 4px; } .sidebar__comment { background-color: var(--tertiary-color3); border-radius: 16px; } @media (min-width: 992px) { .sidebar__comment { padding: 40px; } } .sidebar__comment-item:last-child { margin-block-end: 0; } @media (min-width: 576px) { .sidebar__comment-item--reply { margin-inline-start: 50px; } } .tags ul { gap: 25px 10px; } .tags ul li { border: none; } .tags ul li h6 { font-size: 1.125rem; font-family: "Open Sans", sans-serif; } .tags ul li a { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; font-size: 1rem; padding: 8px 16px; color: var(--text-color); border: 1px solid var(--border-color-5); outline: none; border-radius: 99px; } .tags ul li a.active, .tags ul li a:hover { background-color: var(--tertiary-color); border-color: var(--border-color-5); color: var(--title-color); } .tags--style2 ul { gap: 25px 10px; } .tags--style2 ul li { border: none; } .tags--style2 ul li h6 { font-size: 1.125rem; font-family: "Open Sans", sans-serif; } .tags--style2 ul li a { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; font-size: 1rem; padding: 8px 16px; color: var(--text-color); border: 1px solid var(--border-color-5); outline: none; border-radius: 99px; } .tags--style2 ul li a.active, .tags--style2 ul li a:hover { background-color: var(--tag-bg-color); border-color: var(--border-color-6); color: var(--brand-color); } .faq__thumb--style1::after { position: absolute; content: ""; top: 50%; left: 50%; height: 200px; width: 200px; backdrop-filter: blur(10px); filter: blur(100px); background-color: var(--faq-img-bg-shadow); transform: translate(-50%, -50%); z-index: -1; } .faq__shape-item--1 { width: 40px; top: 1%; left: 6%; -webkit-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .faq__shape-item--1 { top: 3%; left: 7%; } } @media (min-width: 768px) { .faq__shape-item--1 { width: 70px; top: 6%; left: 2%; } } @media (min-width: 992px) { .faq__shape-item--1 { width: auto; left: 5%; top: 5%; } } @media (min-width: 1200px) { .faq__shape-item--1 { top: 6%; left: 6%; } } @media (min-width: 1400px) { .faq__shape-item--1 { top: 11%; left: 17%; } } .faq__shape-item--2 { width: 40px; top: 1%; left: 6%; -webkit-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .faq__shape-item--2 { top: 3%; left: 7%; } } @media (min-width: 768px) { .faq__shape-item--2 { width: 70px; top: 6%; left: 2%; } } @media (min-width: 992px) { .faq__shape-item--2 { width: auto; left: 5%; top: 5%; } } @media (min-width: 1200px) { .faq__shape-item--2 { top: 6%; left: 6%; } } @media (min-width: 1400px) { .faq__shape-item--2 { top: 11%; left: 17%; } } .faq__shape-item--3 { width: 40px; top: 1%; right: 10%; -webkit-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .faq__shape-item--3 { top: 3%; right: 7%; } } @media (min-width: 768px) { .faq__shape-item--3 { width: 70px; top: 6%; right: 4%; } } @media (min-width: 992px) { .faq__shape-item--3 { width: auto; right: 5%; top: 5%; } } @media (min-width: 1200px) { .faq__shape-item--3 { top: 6%; right: 6%; } } @media (min-width: 1400px) { .faq__shape-item--3 { top: 11%; right: 11%; } } @media (min-width: 1600px) { .faq__shape-item--3 { top: 11%; right: 17%; } } .error__inner { background-color: var(--account-bg-color); border-radius: 4px; } @media (min-width: 576px) { .error__inner { padding: 50px; } } @media (min-width: 992px) { .error__inner { padding: 100px; } } .error__thumb img { border-radius: 16px; } .error__content h2 span { color: var(--secondary-color); } .error__content p { max-inline-size: 53ch; margin: 0 auto; } .service-details__item-inner { background-color: var(--wh-color); box-shadow: 0px -16px 48px rgba(6, 35, 63, 0.03), 0px 16px 48px rgba(6, 35, 63, 0.03); border-radius: 4px; } @media (min-width: 768px) { .service-details__item-inner { padding: 50px; } } .service-details__thumb-inner img { border-radius: 8px; } .service-details__faq { border-radius: 16px; background-color: var(--tertiary-color3); } @media (min-width: 768px) { .service-details__faq { padding-inline: 40px; } } .service-details__faq button { background-color: var(--tertiary-color); } .nav--feature .nav-link { border-radius: 8px !important; border: 1px solid var(--border-color) !important; cursor: pointer; } .nav--feature .nav-link.active { border-color: var(--wh-color) !important; background-color: var(--wh-color) !important; box-shadow: 0px 12px 30px rgba(33, 85, 186, 0.08); } .nav--feature .nav-link.active h6 { color: var(--title-color); } .counter { margin-top: -150px; } .counter__item-inner { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; border-radius: 16px; background: var(--wh-color); box-shadow: 0px 24px 64px 0px rgba(6, 73, 54, 0.08); } @media (min-width: 1200px) { .counter__item-inner { padding-block: 54px; padding-inline: 25px; } } .counter__item-inner img { border-radius: 50%; } .counter__item-inner p { opacity: 0.8; } .counter__item-inner:hover { transform: translateY(-5px); } .comment__author { gap: 15px; } .comment__author-info h6 { line-height: 1.3; } .comment__author-info span { font-size: 0.875rem; color: var(--text-color); } .comment__author-thumb img { border-radius: 99px; } .comment__action a { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; font-family: "Anek Telugu", sans-serif; color: var(--text-color); font-size: 1rem; } .comment__action a img { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; margin-inline-end: 1px; margin-bottom: 2px; } .comment__action a:hover { color: var(--brand-color); } .comment__action a:hover img { transform: translateX(-3px); filter: hue-rotate(3deg); } .comment__body-inner { background-color: var(--wh-color); border-radius: 8px; border: 1px solid var(--border-color); } @media (min-width: 992px) { .comment__body-inner { padding-block: 15px; padding-inline: 25px; } } .comment__body-inner p { color: var(--text-color); } .accordion-button { padding: 0px; } .accordion-button:not(.collapesd) { box-shadow: none; } .accordion-button::after { width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--brand-color); background-position: center; background-size: inherit; } .accordion-button--style2::after { border: 1px solid #000; } .accordion-button--style3::after { border: 1px solid var(--secondary-color); } .accordion-button.collapsed::after { border: 1.5px solid var(--faq-item-btn-border-color); background-size: inherit; } .accordion__button { font-size: 1.25rem; color: var(--brand-color); font-family: "Anek Telugu", sans-serif; border: none; } .accordion__button-content { flex: 1; } .accordion__button.collapsed { color: var(--title-color); } .accordion__button.collapsed .accordion__button-plusicon { border: 1.5px solid var(--faq-item-btn-border-color); } .accordion__button.collapsed .accordion__button-plusicon::before { background-color: var(--title-color); } .accordion__button.collapsed .accordion__button-plusicon::after { -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); content: ""; height: 14px; width: 2px; top: 50%; left: 11px; background-color: var(--title-color); } .accordion--style1 [class^=col]:not(:last-child) .accordion__item { border-bottom: 1px solid rgba(0, 0, 0, 0.1); } .accordion--style1 .accordion__item { border-radius: 0 !important; } .accordion--style1 .accordion__button { background-color: var(--bg-color-3); color: var(--title-color); } .accordion--style1 .accordion__button:not(.collapsed) { color: var(--brand-color); padding-block-end: 8px; } .accordion--style1 .accordion__button--style2 { background-color: var(--tertiary-color3); } .accordion--style1 .accordion__header { border-bottom: none; } .accordion--style1 .accordion__header:focus { outline: none; } .accordion--style2 .accordion__item { border-radius: 16px; background-color: var(--faq-bg-color); box-shadow: 0px 16px 48px 0px rgba(6, 35, 63, 0.03), 0px -16px 48px 0px rgba(6, 35, 63, 0.03); } @media (min-width: 576px) { .accordion--style2 .accordion__item { margin-block-end: 5px; } } @media (min-width: 1200px) { .accordion--style2 .accordion__item { margin-block-end: 10px; } } .accordion--style2 .accordion__button { background-color: var(--bg-color-5); color: var(--secondary-color); } .accordion--style2 .accordion__button.collapsed { color: var(--title-color); } .accordion--style2 .accordion__button:not(.collapsed) { padding-block-end: 8px; } .accordion--style2 .accordion__button-plusicon { border: 1.5px solid var(--secondary-color); } .accordion--style2 .accordion__button-plusicon::before { -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); content: ""; width: 14px; height: 2px; top: 50%; left: 5px; background-color: var(--secondary-color); } .accordion--style2 .accordion__body { background-color: var(--bg-color-5); } .accordion--style3 [class^=col]:not(:last-child) .accordion__item { border-bottom: 1px solid var(--border-color-10); } .accordion--style3 .accordion__item { border-radius: 0 !important; } .accordion--style3 .accordion__button { background-color: var(--bg-color-3); border-top-right-radius: 4px; border-top-left-radius: 4px; color: var(--title-color); } @media (min-width: 1200px) { .accordion--style3 .accordion__button { padding-inline: 24px; } } .accordion--style3 .accordion__button:not(.collapsed) { color: #0C263A; background-color: var(--bg-color-10); padding-block-end: 8px; } .accordion--style3 .accordion__button--style2 { background-color: var(--tertiary-color3); } .accordion--style3 .accordion__header { border-bottom: none; } .accordion--style3 .accordion__header:focus { outline: none; } .accordion--style3 .accordion__body { border-bottom: 1px solid transparent; background-color: var(--bg-color-10); border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } @media (min-width: 1200px) { .accordion--style3 .accordion__body { padding-inline: 24px; } } .accordion--style3 .accordion__body p { color: #0C263A; } .roadmap--style1 .roadmap__wrapper { z-index: 2; } @media (min-width: 768px) { .roadmap--style1 .roadmap__wrapper:after { position: absolute; content: ""; height: 50%; width: 10px; background-color: var(--brand-color); border-radius: 8px; top: -1px; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); } } @media (min-width: 768px) { .roadmap--style1 .roadmap__wrapper:before { position: absolute; content: ""; height: 100%; width: 10px; background-color: var(--border-color); border-radius: 8px; top: 0; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); } } .roadmap--style1 .roadmap__item { border-radius: 16px; background: linear-gradient(91deg, var(--bg-grad-color-3) 0%, var(--bg-grad-color-trans-3) 100%); max-inline-size: 500px; } .roadmap--style1 .roadmap__item--style2 { background: linear-gradient(91deg, var(--bg-grad-color-trans-3) 0%, var(--bg-grad-color-3) 100%); } .roadmap--style1 .roadmap__item.aos-animate { -webkit-transform: unset; -moz-transform: unset; -ms-transform: unset; -o-transform: unset; transform: unset; } .roadmap--style1 .roadmap__item-header h3 { flex: 1; } .roadmap--style1 .roadmap__item-header span { font-size: calc(1.325rem + 0.7714285714vw); font-family: "Anek Telugu", sans-serif; color: var(--brand-color); margin-block-start: -5px; } @media (min-width: 1400px) { .roadmap--style1 .roadmap__item-header span { font-size: 2rem; } } @media (min-width: 768px) { .roadmap--style1 .roadmap__item.text-end .roadmap__item-inner:after { top: 30px; right: -68px; left: auto; } } .roadmap--style1 .roadmap__item-content { padding: 20px; } @media (min-width: 768px) { .roadmap--style1 .roadmap__item-content { padding: 40px; } } .roadmap--style1 .roadmap__shape-item--1 { content: ""; height: 50%; width: 910px; border: 2px solid var(--bg-shape-color-2); padding: 40px; border-radius: 100px 213px 100px 100px; border-left: transparent; border-bottom: transparent; top: 0%; left: -3%; transform: rotate(40deg); display: none; } @media (min-width: 768px) { .roadmap--style1 .roadmap__shape-item--1 { display: block; width: 920px; top: -16%; left: -117%; } } @media (min-width: 992px) { .roadmap--style1 .roadmap__shape-item--1 { top: -16%; left: -80%; } } @media (min-width: 1200px) { .roadmap--style1 .roadmap__shape-item--1 { left: -58%; } } @media (min-width: 1400px) { .roadmap--style1 .roadmap__shape-item--1 { left: -30%; } } .roadmap--style1 .roadmap__shape-item--1 span { position: absolute; content: ""; height: 96%; width: 880px; background: linear-gradient(109deg, var(--bg-shape-color-trans-2) 0%, var(--bg-shape-color-2) 100%); border-radius: 100px 213px 100px 100px; } @media (min-width: 768px) { .roadmap--style1 .roadmap__shape-item--1 span { top: 2%; left: 2%; } } .roadmap--style1 .roadmap__shape-item--2 { width: 40px; top: 1%; left: 6%; -webkit-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .roadmap--style1 .roadmap__shape-item--2 { top: 3%; left: 7%; } } @media (min-width: 768px) { .roadmap--style1 .roadmap__shape-item--2 { width: auto; top: 2%; left: 1%; } } @media (min-width: 992px) { .roadmap--style1 .roadmap__shape-item--2 { left: 4%; top: 4%; } } @media (min-width: 1200px) { .roadmap--style1 .roadmap__shape-item--2 { top: 5%; left: 5%; } } @media (min-width: 1400px) { .roadmap--style1 .roadmap__shape-item--2 { top: 8%; left: 5%; } } .roadmap--style2 .roadmap__upper-inner { gap: 30px; } .roadmap--style2 .roadmap__upper-inner::after { content: ""; width: 100%; left: 0; top: 50%; border: 1px dashed var(--border-color-7); } @media (min-width: 768px) { .roadmap--style2 .roadmap__upper-inner::after { display: block; } } .roadmap--style2 .roadmap__slider { counter-reset: roadmap__item; } .roadmap--style2 .roadmap__item-inner { border-radius: 16px; background-color: var(--faq-bg-color); } @media (min-width: 576px) { .roadmap--style2 .roadmap__item-inner { padding: 30px; } } @media (min-width: 768px) { .roadmap--style2 .roadmap__item-inner { padding: 24px; max-width: 280px; } .roadmap--style2 .roadmap__item-inner::before { position: absolute; font-weight: 600; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; counter-increment: roadmap__item; content: counter(roadmap__item); transform: translateX(-50%); left: 50%; width: 30px; height: 30px; line-height: 28px; border-radius: 99px; background-color: var(--extra-bg-color); border: 1px solid var(--secondary-color); bottom: -80px; z-index: 1; font-size: 1.25rem; color: var(--secondary-color); } .roadmap--style2 .roadmap__item-inner::after { position: absolute; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; content: ""; transform: translateX(-50%); left: 50%; width: 0; border: 1px dashed var(--border-color-7); height: 50px; bottom: -50px; } .roadmap--style2 .roadmap__item-inner--vertical-line-top { margin-block-start: 310px; } .roadmap--style2 .roadmap__item-inner--vertical-line-bottom { margin-block-end: 64px; } } .roadmap--style2 .roadmap__item-content h5 { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .roadmap--style2 .roadmap__item-date { font-size: 0.875rem; padding: 4px 12px; border: 1px solid var(--border-color); border-radius: 99px; color: var(--title-color); } .roadmap--style2 .roadmap__item--reverse .roadmap__item-inner::after { top: -50px; } .roadmap--style2 .roadmap__item--reverse .roadmap__item-inner::before { top: -80px; } .roadmap--style2 .roadmap__item.active .roadmap__item-inner::after, .roadmap--style2 .roadmap__item:hover .roadmap__item-inner::after { border: 1px dashed var(--secondary-color); } .roadmap--style2 .roadmap__item.active .roadmap__item-inner::before, .roadmap--style2 .roadmap__item:hover .roadmap__item-inner::before { color: var(--wh-color); background-color: var(--secondary-color); border-color: var(--secondary-color); } .roadmap--style2 .roadmap__item.active .roadmap__item-content h5, .roadmap--style2 .roadmap__item:hover .roadmap__item-content h5 { color: var(--secondary-color); } .about--style1 { padding-block-start: 65px; padding-block-end: 80px; } @media (min-width: 768px) { .about--style1 { padding-block-start: 0px; padding-block-end: 80px; } } @media (min-width: 992px) { .about--style1 { padding-block-start: 75px; padding-block-end: 80px; } } @media (min-width: 1200px) { .about--style1 { padding-block-start: 51px; padding-block-end: 80px; } } @media (min-width: 1400px) { .about--style1 { padding-block-start: 51px; padding-block-end: 60px; } } .about__thumb-image img { border-radius: 20px; } .about__thumb-image::after { position: absolute; content: ""; top: 60%; left: 50%; height: 200px; width: 200px; backdrop-filter: blur(10px); filter: blur(70px); background-color: var(--about-img-bg-shadow); transform: translate(-50%, -50%); z-index: -1; } .about__thumb--style2::after { content: ""; top: 50%; left: 50%; height: 400px; width: 250px; backdrop-filter: blur(10px); filter: blur(100px); background-color: var(--faq-img-bg-shadow); transform: translate(-50%, -50%); z-index: -1; opacity: 0.5; } .about__thumb--style3 .about__thumb-image::after { position: unset; content: unset; } .about__thumb--style3::after { content: ""; left: -7px; top: -30px; height: 350px; width: 170px; background-color: var(--bg-color-10); border-radius: 16px; z-index: -1; } @media (min-width: 576px) { .about__thumb--style3::after { left: -15px; top: -40px; height: 500px; width: 300px; } } @media (min-width: 768px) { .about__thumb--style3::after { left: -15px; top: -70px; height: 440px; width: 210px; } } @media (min-width: 992px) { .about__thumb--style3::after { left: -15px; top: -40px; height: 470px; width: 280px; } } @media (min-width: 1200px) { .about__thumb--style3::after { left: 0; height: 540px; width: 300px; } } .about__thumb--style4 .about__thumb-image::after { position: unset; content: unset; } @media (min-width: 992px) { .about__content { margin-block-start: 0; } } @media (min-width: 1200px) { .about__content:not(:last-child) { margin-bottom: 32px; } } .about__content-inner h2 span { color: var(--secondary-color); } .about__content-inner p { color: var(--text-color); } @media (min-width: 768px) { .about__content-inner a { margin-block-start: 40px; } } .about__content--style2 .about__content-details { flex: 1; } .about__content--style2 .about__content-inner { gap: 15px; } .about__content--style2 .about__content-inner h2 { margin-block-end: -10px; } .about__content--style2 .about__content-inner h2 span { color: var(--secondary-color); } .about__icon { width: 70px; } .about__icon-inner { width: 70px; height: 70px; background-color: var(--bg-color-3); border-radius: 50%; } .about__shape--style1 .about__shape-item { width: 40px; top: 5%; right: 6%; -webkit-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: rotate 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .about__shape--style1 .about__shape-item { top: 5%; right: 7%; } } @media (min-width: 768px) { .about__shape--style1 .about__shape-item { width: auto; top: 6%; right: 6%; } } @media (min-width: 992px) { .about__shape--style1 .about__shape-item { right: 5%; top: 16%; } } @media (min-width: 1200px) { .about__shape--style1 .about__shape-item { top: 16%; right: 6%; } } @media (min-width: 1400px) { .about__shape--style1 .about__shape-item { top: 16%; right: 9%; } } .about__shape--style2 .about__shape-item--1 { width: 80px; top: 52%; right: 71%; -webkit-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: floating 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .about__shape--style2 .about__shape-item--1 { width: auto; top: 45%; right: 71%; } } @media (min-width: 768px) { .about__shape--style2 .about__shape-item--1 { top: 45%; right: 77%; } } @media (min-width: 992px) { .about__shape--style2 .about__shape-item--1 { right: 43%; top: 8%; } } @media (min-width: 1200px) { .about__shape--style2 .about__shape-item--1 { top: 3%; right: 40%; } } @media (min-width: 1400px) { .about__shape--style2 .about__shape-item--1 { top: -1%; right: 3%; } } @media (min-width: 1600px) { .about__shape--style2 .about__shape-item--1 { top: 0%; right: 9%; } } .about--style3 .about__content-icon img { width: 70px; -webkit-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -moz-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -ms-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; -o-animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; animation: left-right 3s cubic-bezier(0.41, 0.15, 0.64, 0.86) infinite alternate; } @media (min-width: 576px) { .about--style3 .about__content-icon img { width: 73px; } } @media (min-width: 768px) { .about--style3 .about__content-icon img { width: 70px; } } @media (min-width: 992px) { .about--style3 .about__content-icon img { width: 90px; } } @media (min-width: 1200px) { .about--style3 .about__content-icon img { width: auto; } } .about--style3 .about__content h2 { line-height: 1.2; } .about--style3 .about__content h2 span { color: var(--secondary-color); } .about--style3 .about__content p { color: var(--text-color); } @media (min-width: 768px) { .about--style3 .about__content a { margin-block-start: 40px; } } .about--style3 .about__content ul li { font-size: 1.125rem; color: var(--title-color-style2); font-family: "Open Sans", sans-serif; } .about--style3 .about__content ul li span img { max-width: 25px; } @media (min-width: 576px) { .about--style3 .about__content ul li span img { max-width: 26px; } } @media (min-width: 768px) { .about--style3 .about__content ul li span img { margin-inline-end: 5px; } } @media (min-width: 992px) { .about--style3 .about__content ul li span img { max-width: 100%; margin-inline-end: 10px; } } @media (min-width: 992px) { .about--style3 .about__content ul li { font-size: 1.25rem; } } @media (min-width: 992px) { .about--style3 .about__content ul li:not(:last-child) { margin-block-end: 20px; } } html[data-bs-theme=dark] .header-section--style5.header-fixed { background-color: var(--bg-color-14); } html[data-bs-theme=dark] .team__item-author--style1 { background-color: rgba(0, 21, 15, 0.8); backdrop-filter: blur(2px); } html[data-bs-theme=dark] .team__item-inner--shape2 { background-color: #051a14; } html[data-bs-theme=dark] .banner--style3 .banner__bg img { display: none; } html[data-bs-theme=dark] .banner--style3 .banner__counter-item { border: none; background: linear-gradient(152deg, rgba(237, 242, 248, 0.03) 0%, rgba(237, 242, 248, 0.12) 100%); box-shadow: 0px 16px 64px 0px rgba(0, 208, 148, 0.08); } html[data-bs-theme=dark] .trk-btn--outline2 { background-color: #1B2D29; border-color: #1B2D29; color: #fff; } html[data-bs-theme=dark] .trk-btn--outline4 { border: 1px solid var(--bg-white); color: var(--bg-white); } html[data-bs-theme=dark] .trk-btn--outline4.active, html[data-bs-theme=dark] .trk-btn--outline4:hover { background-color: var(--brand-color); border-color: var(--brand-color); color: #0C263A; } html[data-bs-theme=dark] .blog__item-inner { box-shadow: none; } html[data-bs-theme=dark] .blog__shape-item--1 { border-top: 2px solid var(--bg-shape-color); } html[data-bs-theme=dark] .service__item-inner:hover { box-shadow: none; } html[data-bs-theme=dark] .service__item--style2 .service__item-inner:hover { box-shadow: 0px 12px 30px rgba(14, 4, 0, 0.64); } html[data-bs-theme=dark] .service__item--style2 .service__thumb-inner { background-color: rgba(255, 255, 255, 0.06); } html[data-bs-theme=dark] .service__item--style3 .service__item-inner:hover h5 a { color: #0C263A; } html[data-bs-theme=dark] .service__item--style3 .service__item-inner:hover p { color: #0C263A; opacity: 0.8; } html[data-bs-theme=dark] .pricing__item-inner { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } html[data-bs-theme=dark] .pricing__item-inner.active, html[data-bs-theme=dark] .pricing__item-inner:hover { border: 2px solid var(--brand-color); box-shadow: 0px 16px 40px 0px rgba(26, 64, 137, 0.06); } html[data-bs-theme=dark] .pricing__item--style2 .pricing__item-inner { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; border: 1px solid rgba(229, 237, 248, 0.1); } html[data-bs-theme=dark] .pricing__item--style2 .pricing__item-inner.active, html[data-bs-theme=dark] .pricing__item--style2 .pricing__item-inner:hover { border: 1px solid rgba(255, 255, 255, 0.3); box-shadow: none; } html[data-bs-theme=dark] .pricing__item--style2 .pricing__item-inner.active .pricing__item-top h6 { color: #0C263A; } html[data-bs-theme=dark] .pricing__item--style2 .pricing__item-inner.active .pricing__item-top h3 span { color: #0C263A; } html[data-bs-theme=dark] .pricing__item--style2 .pricing__item-inner.active .pricing__list-item { color: #0C263A; } html[data-bs-theme=dark] .pricing__shape-item--1 { border-left: block; border-bottom: block; } html[data-bs-theme=dark] .blog__item-inner:hover { box-shadow: 0px 24px 60px rgba(13, 14, 16, 0.5); } html[data-bs-theme=dark] .swiper-nav__btn { border-color: #1B2D29; } html[data-bs-theme=dark] .swiper-nav__btn i, html[data-bs-theme=dark] .swiper-nav__btn svg { color: var(--bg-white); } html[data-bs-theme=dark] .swiper-nav__btn.active, html[data-bs-theme=dark] .swiper-nav__btn:hover { background-color: var(--brand-color); border-color: var(--brand-color); } html[data-bs-theme=dark] .swiper-nav__btn.active i, html[data-bs-theme=dark] .swiper-nav__btn.active svg, html[data-bs-theme=dark] .swiper-nav__btn:hover i, html[data-bs-theme=dark] .swiper-nav__btn:hover svg { color: #0C263A; } html[data-bs-theme=dark] .swiper-nav__btn--style3 { border: 1px solid var(--tertiary-color4); } html[data-bs-theme=dark] .swiper-nav__btn--style3.active, html[data-bs-theme=dark] .swiper-nav__btn--style3:hover { background-color: var(--tertiary-color4); border-color: var(--tertiary-color4); } html[data-bs-theme=dark] .swiper-nav__btn--style3.active i, html[data-bs-theme=dark] .swiper-nav__btn--style3.active svg, html[data-bs-theme=dark] .swiper-nav__btn--style3:hover i, html[data-bs-theme=dark] .swiper-nav__btn--style3:hover svg { color: var(--title-color); } html[data-bs-theme=dark] .testimonial__item-content p { border-bottom: 1px solid rgba(255, 255, 255, 0.1); } html[data-bs-theme=dark] .testimonial__item:hover .testimonial__item-inner { box-shadow: none; } html[data-bs-theme=dark] .testimonial__item:hover .testimonial__quote span i, html[data-bs-theme=dark] .testimonial__item:hover .testimonial__quote span svg { color: var(--brand-color); } html[data-bs-theme=dark] .testimonial__quote span i, html[data-bs-theme=dark] .testimonial__quote span svg { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; color: rgb(255, 255, 255); opacity: 0.3; } html[data-bs-theme=dark] .accordion--style1 [class^=col]:not(:last-child) .accordion__item { border-bottom: 1px solid rgba(255, 255, 255, 0.1); } html[data-bs-theme=dark] .cta--style1 .cta__content-inner { background-color: #2D2C2C; border-color: #2D2C2C; } html[data-bs-theme=dark] .form-control { background-color: linear-gradient(150.39deg, rgba(237, 242, 248, 0.0264) 15.02%, rgba(237, 242, 248, 0.12) 99.59%); border-color: linear-gradient(150.39deg, rgba(237, 242, 248, 0.0264) 15.02%, rgba(237, 242, 248, 0.12) 99.59%); } html[data-bs-theme=dark] .form-control--style1 { border-color: rgba(220, 223, 232, 0.0509803922); border-right: none; } html[data-bs-theme=dark] .sidebar__search form input { background-color: #00150F; border-color: #00150F; color: var(--bg-white); } html[data-bs-theme=dark] .account__social-btn { border-color: linear-gradient(150.39deg, rgba(237, 242, 248, 0.0264) 15.02%, rgba(237, 242, 248, 0.12) 99.59%); } html[data-bs-theme=dark] .trk-btn--outline { color: var(--brand-color); } html[data-bs-theme=dark] .trk-btn.active.trk-btn--outline6, html[data-bs-theme=dark] .trk-btn:hover.trk-btn--outline6 { color: #0C263A; } html[data-bs-theme=dark] .account__divider--style1::before { background-color: linear-gradient(150.39deg, rgba(237, 242, 248, 0.0264) 15.02%, rgba(237, 242, 248, 0.12) 99.59%); } @media (min-width: 768px) { html[data-bs-theme=dark] .contact__form::before { background: linear-gradient(188.07deg, rgba(157, 157, 157, 0) 31.91%, rgba(151, 153, 155, 0.4588235294) 98.96%); } } html[data-bs-theme=dark] .nav--feature .nav-link { box-shadow: 0px 12px 30px rgba(14, 4, 0, 0.24); } html[data-bs-theme=dark] .social__link--style1 { border: 2px solid var(--social-border-color-2); } html[data-bs-theme=dark] .social__link--style1.active, html[data-bs-theme=dark] .social__link--style1:hover { background-color: transparent; border: 2px solid var(--brand-color); } html[data-bs-theme=dark] .social__link--style1.active i, html[data-bs-theme=dark] .social__link--style1.active svg, html[data-bs-theme=dark] .social__link--style1:hover i, html[data-bs-theme=dark] .social__link--style1:hover svg { color: var(--brand-color); } html[data-bs-theme=dark] .partner--gradient::after { background: #003E2C; } /*# sourceMappingURL=style.css.map */