How To Customize

Logo change

Here is your main logo code. To add your logo, replace logo.png from images/logo/ directory with your logo in PNG format.

 <img src="assets/images/logo/logo.png" alt="logo">

Note: Keep your logo inside the ./assets/imaegs/logo folder. The logo size should be minimum 150 X 65 pixel.

Change Menubar

This is Menu navigation codes.

  <ul class="menu">
    <li>
        <a href="javascript:void(0);">Demos</a>
        <ul class="submenu">
            <li><a href="index.html">Stock Trading</a></li>
            <li><a href="index-2.html">Crypto Trading</a></li>
            <li><a href="index-3.html">Forex Trading</a></li>
            <li><a href="index-4.html">Day Trading</a></li>
            <li><a href="index-5.html">Trading Platform</a></li>
        </ul>
    </li>
    <li>
        <a href="javascript:void(0);">Services</a>
        <ul class="submenu">
            <li><a href="services.html">Services</a></li>
            <li><a href="service-details.html">Services Details</a></li>
        </ul>
    </li>
    <li>
        <a href="javascript:void(0);">About</a>
        <ul class="submenu">
            <li><a href="about.html">About Us</a></li>
            <li><a href="price.html">Price</a></li>
            <li><a href="team.html">Team</a></li>
            <li><a href="team-2.html">Team 2</a></li>
            <li><a href="team-details.html">Team Details</a></li>
        </ul>
    </li>
    <li>
        <a href="javascript:void(0);">Pages</a>
        <ul class="submenu">
            <li><a href="blog.html">Blog</a></li>
            <li><a href="blog-sidebar.html">Blog Sidebar</a></li>
            <li><a href="blog-details.html">Blog Detils</a></li>
            <li><a href="signup.html">Sign Up</a></li>
            <li><a href="signup-2.html">Sign Up 2</a></li>
            <li><a href="signin.html">Sign In</a></li>
            <li><a href="signin-2.html">Sign In 2</a></li>
            <li><a href="forgot-pass.html">Reset Password</a></li>
            <li><a href="forgot-pass-2.html">Reset Password 2</a></li>
            <li><a href="404.html">404 Error</a></li>
        </ul>
    </li>
    <li><a href="contact.html">Contact</a></li>
  </ul>
    

To change the Menu item or menu name you have to edit in the tag Your Menu Name

If you wanna delete a menu item from the menu just remove the menu item above

Section Styles

Here is your section structure.

      <section class="section-name padding-top padding-bottom">
        <div class="container">
          <div class="section-header">					
              .....
          </div>

          <div class="section-wrapper">

          ...sections all content goes there

          </div>

        </div>
      </section>
    

• If you need diffrent style of section header - just you add the utility classes "section-header--left or section-header--middle" class
• In the class="section-class" you can replace with your desired class.
• the section-header div you can add your heading of sections and tagline of sections.
• ou can add your content on the 2nd sectionname__wrapper div.

Section With Background

you can select secondary background dark color. To add color, just simply add the class bg--primary to the section class.

  <section class="section-name bg--primary">
    <div class="container">
      ...
    </div>
  </section>	  
      

    {
        spaceBetween: 20,
        autoplay: false,
        slidesPerView: 4,
        isCustomNav: true,
        breakpoints: {
            576: {
                slidesPerView: 2
            },
            992: {
                slidesPerView: 3
            }
        },
        navigation: {
            nextEl: '.swiper-nav .swiper-next',
            prevEl: '.swiper-nav .swiper-prev'
    }

                                        

        //===================== Variables start===================== //

        // theme colors
        $brand-color: var(--brand-color);
        $secondary-color: var(--secondary-color);
        $tertiary-color: var(--tertiary-color);
        $body-color: var(--body-color);
        $border-color: var(--border-color);
        $social-border-color: var(--social-border-color);
        $social-border-color-2: var(--social-border-color-2);
        $form-border: var(--form-border);


        // text colors
        $title-color: var(--title-color);
        $title-color-style2: var(--title-color-style2);
        $text-color: var(--text-color);
        $text-color-light: var(--text-color-light);
        $text-color-2: var(--text-color-2);



        // background colors
        $bg-color: var(--bg-color);
        $bg-white: var(--bg-white);
        $section-bg-color: var(--section-bg-color);
        $sec-bg-color-2: var(--sec-bg-color-2);
        $account-bg-color: var(--account-bg-color);
        $account-bg-color2: var(--account-bg-color2);
        $arrow-icon-color: var(--arrow-icon-color);



        // extra colors
        $team-bg-color: var(--bg-team);
        $service-item-bg-color: var(--service-item-bg-color);
        $footer-bg-color: var(--footer-bg-color);
        $floating-content-border-color: var(--floating-content-border-color);
        $floating-content-bg-color: var(--floating-content-bg-color);
        $floating-content-bg-color-2: var(--floating-content-bg-color-2);


        // form
        $form-border: var(--form-border);
        $form-focus: var(--form-focus);


        // Action colors
        $error: var(--error-color);
        $warning: var(--warning-color);
        $success: var(--success-color);
        $danger: var(--danger-color);


        //=====================>>>\ Variables end ===================== //



        //Template Font family

        $title-font:'Anek Telugu',
        sans-serif;

        $text-font:'Open Sans',
        sans-serif;

        //Template font sizes
        $fs-base: 16px !default;
        $fs-small:14px;

        $fs-h1: 60px;
        $fs-h2: 48px;
        $fs-h3: 32px;
        $fs-h4: 28px;
        $fs-h5: 24px;
        $fs-h6: 20px;

        //Template transition

        $transition:all .3s ease-out;