/*! Template Name: Bitrader - Professional Multipurpose HTML Template for Your Crypto, Forex, Stocks & Day Trading Business Template URI: Author: thetork Author URI: https: //themeforest.net/user/thetork/portfolio Description: Experience the power of Bitrader, the ultimate HTML template designed to transform your trading business. With its sleek design and advanced features, Bitrader empowers you to showcase your expertise, engage clients, and dominate the markets. Elevate your online presence and unlock new trading possibilities with Bitrader. Version: 1.0.0 Text Domain: Bitrader Tags: Crypto, Forex, and Stocks Trading Business */ /* -----------------Table of content start ----------------- 1. Configuration and helpers -extends, -variables, -functions, -mixins 2. Vendors -normalize, -nice-select, -rfs 3. Base stuff -fonts, -typography, -animations, -common, -helpers 4. Layout-related sections -header, -banner, -contact, -account, -form, -footer 5. Components -button, -preloader, -lightdark-switch, -social-link, -foating-content, -partner, -feature, -service, -pricing, -team, -blog, -blog-details, -testimonial, -cta, -story, -sidebar, -faq, -error, -servicer-details, -nav, -roadmap, -comment, -about 6. Page-specific styles -home 7. Themes -theme -----------------Table of content end ----------------- */ /*=====================================================================*/ /* @@@@@@@@@@@@@ Extend Property CSS start here @@@@@@@@@@@@@@ */ /*=========<>=========*/ .lightdark-switch .switch-btn.dark-switcher { display: none; } @import url("https://fonts.googleapis.com/css2?family=Anek+Telugu:wght@100;200;300;400;500;600;700;800&family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap"); .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; } /*=========<>=========*/ /*=========<>=========*/ .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, .blog, .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, .blog, .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; } /* @@@@@@@@@@@@@ aditional Property CSS Writing Now @@@@@@@@@@@@@@ */ :root { --brand-color: #ce2027; --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: #0000007a; --social-border-color: #F0F4FA; --social-border-color-2: #ECEFF2; --social-border-color-3: #ECEFF2; --form-border: #CFDEF1; --title-color: #FFF; --title-color-style2: #FFF; --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: #ce2027 --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: #0000007a; --faq-img-bg-shadow: #ce2027; --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: #ce2027; --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, '); } [data-bs-theme=dark] { --brand-color: #ce2027; --secondary-color: #ce2027; --tertiary-color: #002A1E; --tertiary-color2: #002A1E; --tertiary-color3: #0E221E; --tertiary-color4: #3863e0; --body-color: #000; --border-color: #E6EDFB1F; --border-color-5: rgba(255, 255, 255, 0.08); --border-color-6: rgba(255, 255, 255, 0.08); --border-color-7: #00533B; --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: #0e352a; --header-bg-color2: #000; --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: #fff; --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: #0000007a; --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: #0000007a; --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: #124D6D; --bg-color-9: #000; --bg-color-10: #d7ff80; --bg-color-11: #141821; --bg-color-12: rgba(237, 242, 248, 0.08); --bg-color-14: #1B2D29; --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: #0000007a; --form-focus-color: #366CD5; --wh-color: #0000007a; --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: #0000007a; --service-item-bg-color: #0000007a; --faq-item-btn-border-color: #FFFFFF14; --faq-bg-color: #21342F; --extra-bg-color: #21342F; --tag-bg-color: #002A1E; --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: #000; --faq-img-bg-shadow: #ce20278f; --pagination-bg-color: #0000007a; --section-bg-color: rgba(237, 242, 248, 0.02); --sec-bg-color-2: #081c17; --account-bg-color: #0000007a; --account-bg-color2: #0000007a; --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: #0e241d; --about-img-bg-shadow: #ce2027; --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, '); } .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: #FFF; } .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: #FFF; } .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: #FFF; } .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: #FFF; } .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: 40%; } .header-wrapper .logo { max-width: 50% !important; } @media (max-width: 575px) { .header-wrapper .logo { max-width: 85%; } } @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: #FFF; } .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: #FFF; 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: 80px; } @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.html); 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: #FFF; border-radius: 8px; } .footer__app-item--apple2 { background-color: var(--bg-color-10); color: #FFF; 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: #FFF; 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: #FFF; } .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: #FFF; 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: #FFF; } .trk-btn.active.trk-btn--outline2, .trk-btn:hover.trk-btn--outline2 { background-color: var(--brand-color); border-color: var(--brand-color); color: #FFF; } .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: #FFF; } .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: #FFF; } .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: #FFF; } .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: #FFF; } .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: #FFF; } .trk-btn.active.trk-btn--outline3, .trk-btn:hover.trk-btn--outline3 { background-color: var(--brand-color); border-color: var(--brand-color); color: #FFF; } .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: #FFF; } .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: #FFF; } .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: #FFF; } .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: #FFF; } .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: #FFF; } .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: #FFF; } .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: #FFF; } .testimonial__item--style4:hover .testimonial__author span { color: #FFF; } .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: #FFF; } .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: #FFF; } @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: #FFF; 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: #FFF; } .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: transparent; 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: #FFF; } 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: #FFF; } html[data-bs-theme=dark] .service__item--style3 .service__item-inner:hover p { color: #FFF; 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: #FFF; } html[data-bs-theme=dark] .pricing__item--style2 .pricing__item-inner.active .pricing__item-top h3 span { color: #FFF; } html[data-bs-theme=dark] .pricing__item--style2 .pricing__item-inner.active .pricing__list-item { color: #FFF; } 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: #FFF; } 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: #0000007a; border-color: #0000007a; 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: #FFF; } 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 */ .footer__about-logo img { max-width: 50%; } /* marque */ .header-bar { display: none; } .header-btn { display: block !important; } .clients { background: #000; padding: 10px 0; text-align: center; } .clients .col-lg-2 { display: flex; align-items: center; justify-content: center; } .clients img { width: 50%; filter: grayscale(100); transition: all 0.4s ease-in-out; display: inline-block; padding: 10px 0; } .clients img:hover { filter: none; transform: scale(1.1); } @media (max-width: 768px) { .clients img { width: 40%; } } @media (max-width: 575px) { .clients img { width: 30%; } } /* @keyframes infiniteScroll { from {transform: translateX(0)} to {transform: translateX(-200%)} } */ .c-con { width: 100%; overflow: hidden; } .horizontal-scrolling-items { display: flex; font-size: 40px; width: 100%; /* animation-name: infiniteScroll; animation-iteration-count: infinite; animation-timing-function: linear; */ animation: infiniteScroll 10s linear infinite; /* Adjust animation duration as needed */ white-space: nowrap; } .horizontal-scrolling-items__item { /* white-space: nowrap; */ margin: 0 15px; } @keyframes infiniteScroll { 0% { transform: translateX(0); } 100% { transform: translateX(-100%); } } .font { color: black !important; } /* back to top css */ .back-to-top, .scrollToTop { position: fixed; bottom: 0%; right: 5%; z-index: 996; background: #ce2027; width: 40px; height: 40px; border-radius: 4px; text-align: center; line-height: 40px; color: #fff; visibility: hidden; opacity: 0; transition: all 0.4s ease-out; } .back-to-top i, .scrollToTop i, .scrollToTop svg { font-size: 28px; color: #fff; } .back-to-top:hover, .scrollToTop:hover { background: #ce2027; color: #fff; transform: translateY(-5px); } .back-to-top.active, .scrollToTop.active { visibility: visible; opacity: 1; } .sticky-whatsapp-btn a { position: fixed; right: 15px; bottom: 150px; width: 60px; height: 60px; background-color: #1cd766; text-align: center; vertical-align: middle; border-radius: 50%; z-index: 99; padding: 15px; animation: breathe 2s ease-in-out infinite } @keyframes breathe { 0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, .5) } 70% { box-shadow: 0 0 0 15px rgba(37, 211, 102, 0) } 100% { box-shadow: 0 0 0 0 rgba(0, 0, 0, 0) } } .register-btn { position: fixed; bottom: 0%; right: 0; z-index: 996; width: 100%; height: fit-content; color: #fff; } .register-btn .trk-btn{ border-radius: 0; display: block; } @media screen and (max-width: 568px) { .header-wrapper .logo a img { max-width: 150px; } .footer__end{ padding-bottom: 30px; } .back-to-top{ bottom: 70px; } }