<!-- Navigation -->
<div class="collapse navbar-collapse align-items-center flex-sm-row g-pt-10 g-pt-5--lg {% if mainNavAlignment == 'right' %}g-mr-40--lg{% elif mainNavAlignment == 'left' %}g-ml-40--lg{% endif %}" id="navBar">
  <ul class="navbar-nav text-uppercase g-pos-rel g-font-weight-600 {% if mainNavAlignment == 'right' %}ml-auto{% elif mainNavAlignment == 'left' %}mr-auto{% endif %}">
    <!-- Intro -->
    <li class="nav-item {% if mainNavActive_1 == 'intro' %}active{% endif %} g-mx-10--lg g-mx-15--xl">
      <a href="{{ root }}index.html" class="nav-link g-py-7 g-px-0">Intro</a>
    </li>
    <!-- End Intro -->

    <!-- Home -->
    <li class="hs-has-mega-menu nav-item {% if mainNavActive_1 == 'home' %}active{% endif %} g-mx-10--lg g-mx-15--xl"
        data-animation-in="fadeIn"
        data-animation-out="fadeOut"
        data-max-width="60%"
        data-position="left">
      <a id="mega-menu-home" class="nav-link g-py-7 g-px-0" href="#!" aria-haspopup="true" aria-expanded="false">Home
        <i class="hs-icon hs-icon-arrow-bottom g-font-size-11 g-ml-7"></i></a>

      <!-- Mega Menu -->
      <div class="w-100 hs-mega-menu u-shadow-v11 font-weight-normal g-brd-top g-brd-primary g-brd-top-2 g-bg-white g-mt-18 g-mt-8--lg--scrolling" aria-labelledby="mega-menu-home">
        <div class="row align-items-stretch no-gutters">
          <!-- Home (col) -->
          <div class="col-lg-6">
            <ul class="list-unstyled">
              <li class="dropdown-item {% if mainNavActive_2 == 'home-default' %}active{% endif %}">
                <a href="{{ root }}unify-main/home/home-default.html" class="nav-link">Default</a>
              </li>
              <li class="dropdown-item {% if mainNavActive_2 == 'home-incredible' %}active{% endif %}">
                <a href="{{ root }}unify-main/home/home-incredible.html" class="nav-link">Incredible</a>
              </li>
              <li class="dropdown-item {% if mainNavActive_2 == 'home-studio' %}active{% endif %}">
                <a href="{{ root }}unify-main/home/home-studio.html" class="nav-link">Studio</a>
              </li>
              <li class="dropdown-item {% if mainNavActive_2 == 'home-allure' %}active{% endif %}">
                <a href="{{ root }}unify-main/home/home-allure.html" class="nav-link">Allure</a>
              </li>
              <li class="dropdown-item {% if mainNavActive_2 == 'home-inspire' %}active{% endif %}">
                <a href="{{ root }}unify-main/home/home-inspire.html" class="nav-link">Inspire</a>
              </li>
              <li class="dropdown-item {% if mainNavActive_2 == 'home-portfolio' %}active{% endif %}">
                <a href="{{ root }}unify-main/home/home-portfolio.html" class="nav-link">Portfolio</a>
              </li>
              <li class="dropdown-item {% if mainNavActive_2 == 'home-creative' %}active{% endif %}">
                <a href="{{ root }}unify-main/home/home-creative.html" class="nav-link">Creative</a>
              </li>
              <li class="dropdown-item {% if mainNavActive_2 == 'home-projects' %}active{% endif %}">
                <a href="{{ root }}unify-main/home/home-projects.html" class="nav-link">Projects</a>
              </li>
            </ul>
          </div>
          <!-- End Home (col) -->

          <!-- Home (col) -->
          <div class="col-lg-6 g-brd-left--lg g-brd-gray-light-v5">
            <ul class="list-unstyled">
              <li class="dropdown-item {% if mainNavActive_2 == 'home-discover' %}active{% endif %}">
                <a href="{{ root }}unify-main/home/home-discover.html" class="nav-link">Discover</a>
              </li>
              <li class="dropdown-item {% if mainNavActive_2 == 'home-brave' %}active{% endif %}">
                <a href="{{ root }}unify-main/home/home-brave.html" class="nav-link">Brave</a>
              </li>
              <li class="dropdown-item {% if mainNavActive_2 == 'home-business' %}active{% endif %}">
                <a href="{{ root }}unify-main/home/home-business.html" class="nav-link">Business</a>
              </li>
              <li class="dropdown-item {% if mainNavActive_2 == 'home-corporate' %}active{% endif %}">
                <a href="{{ root }}unify-main/home/home-corporate.html" class="nav-link">Corporate</a>
              </li>
              <li class="dropdown-item {% if mainNavActive_2 == 'home-web-agency' %}active{% endif %}">
                <a href="{{ root }}unify-main/home/home-web-agency.html" class="nav-link">Web Agency</a>
              </li>
              <li class="dropdown-item {% if mainNavActive_2 == 'home-aspire' %}active{% endif %}">
                <a href="{{ root }}unify-main/home/home-aspire.html" class="nav-link">Aspire</a>
              </li>
              <li class="dropdown-item {% if mainNavActive_2 == 'home-showcase' %}active{% endif %}">
                <a href="{{ root }}unify-main/home/home-showcase.html" class="nav-link">Showcase</a>
              </li>
              <li class="dropdown-item {% if mainNavActive_2 == 'home-news' %}active{% endif %}">
                <a href="{{ root }}unify-main/home/home-news.html" class="nav-link">News</a>
              </li>
            </ul>
          </div>
          <!-- End Home (col) -->
        </div>
      </div>
      <!-- End Mega Menu -->
    </li>
    <!-- End Home -->

    <!-- Pages -->
    <li class="hs-has-sub-menu nav-item {% if mainNavActive_1 == 'pages' %}active{% endif %} g-mx-10--lg g-mx-15--xl"
        data-animation-in="fadeIn"
        data-animation-out="fadeOut">
      <a id="nav-link-pages" class="nav-link g-py-7 g-px-0" href="#!"
         aria-haspopup="true"
         aria-expanded="false"
         aria-controls="nav-submenu-pages"
      >Pages</a>

      <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-18 g-mt-8--lg--scrolling" id="nav-submenu-pages"
          aria-labelledby="nav-link-pages">
        <!-- Pages - About -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'pages-about' %}active{% endif %}">
          <a id="nav-link--pages--about" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--pages--about"
          >About</a>

          <!-- Submenu (level 2) -->
          <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--pages--about"
              aria-labelledby="nav-link--pages--about">
            <li class="dropdown-item {% if mainNavActive_3 == 'page-about-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-about-1.html">About 1</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-about-2' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-about-2.html">About 2</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-about-3' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-about-3.html">About 3</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-about-4' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-about-4.html">About 4</a>
            </li>

            <li class="dropdown-divider"></li>

            <li class="dropdown-item {% if mainNavActive_3 == 'page-about-me-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-about-me-1.html">About me 1</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-about-me-2' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-about-me-2.html">About me 2</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-about-me-3' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-about-me-3.html">About me 3</a>
            </li>
          </ul>
          <!-- End Submenu (level 2) -->
        </li>
        <!-- End Pages - About -->

        <!-- Pages - Portfolios -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'pages-portfolios' %}active{% endif %}">
          <a id="nav-link--pages--portfolio" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--pages--portfolio"
          >Portfolios</a>

          <!-- Submenu (level 2) -->
          <ul class="hs-sub-menu list-unstyled u-shadow-v11 u-dropdown-col-2 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--pages--portfolio"
              aria-labelledby="nav-link--pages--portfolio">
            <li class="dropdown-item {% if mainNavActive_3 == 'page-portfolio-case-study-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-portfolio-case-study-1.html">Case Studies 1</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-portfolio-case-study-2' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-portfolio-case-study-2.html">Case Studies 2</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-portfolio-single-item-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-portfolio-single-item-1.html">Single item 1</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-portfolio-single-item-2' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-portfolio-single-item-2.html">Single item 2</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-portfolio-single-item-3' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-portfolio-single-item-3.html">Single item 3</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-portfolio-single-item-4' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-portfolio-single-item-4.html">Single item 4</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-portfolio-single-item-5' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-portfolio-single-item-5.html">Single item 5</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-portfolio-single-item-6' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-portfolio-single-item-6.html">Single item 6</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-portfolio-single-item-7' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-portfolio-single-item-7.html">Single item 7</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-portfolio-single-item-8' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-portfolio-single-item-8.html">Single item 8</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-portfolio-single-item-9' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-portfolio-single-item-9.html">Single item 9</a>
            </li>
          </ul>
          <!-- End Submenu (level 2) -->
        </li>
        <!-- End Pages - Portfolios -->

        <!-- Pages - Login &amp; Signup -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'pages-login-signup' %}active{% endif %}">
          <a id="nav-link--pages--login-signup" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--pages--login-signup"
          >Login &amp; Signup</a>

          <!-- Submenu (level 2) -->
          <ul class="hs-sub-menu list-unstyled u-shadow-v11 u-dropdown-col-2 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--pages--login-signup"
              aria-labelledby="nav-link--pages--login-signup">
            <li class="dropdown-item {% if mainNavActive_3 == 'page-login-and-signup-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-login-and-signup-1.html">Login &amp; Signup</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-signup-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-signup-1.html">Signup 1</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-signup-2' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-signup-2.html">Signup 2</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-signup-3' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-signup-3.html">Signup 3</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-signup-4' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-signup-4.html">Signup 4</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-signup-5' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-signup-5.html">Signup 5</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-signup-6' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-signup-6.html">Signup 6</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-signup-7' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-signup-7.html">Signup 7</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-signup-8' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-signup-8.html">Signup 8</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-signup-9' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-signup-9.html">Signup 9</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-signup-10' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-signup-10.html">Signup 10</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-signup-11' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-signup-11.html">Signup 11</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-signup-12' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-signup-12.html">Signup 12</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-login-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-login-1.html">login 1</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-login-2' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-login-2.html">Login 2</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-login-3' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-login-3.html">Login 3</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-login-4' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-login-4.html">Login 4</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-login-5' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-login-5.html">Login 5</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-login-6' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-login-6.html">Login 6</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-login-7' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-login-7.html">Login 7</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-login-8' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-login-8.html">Login 8</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-login-9' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-login-9.html">Login 9</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-login-10' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-login-10.html">Login 10</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-login-11' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-login-11.html">Login 11</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-login-12' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-login-12.html">Login 12</a>
            </li>
          </ul>
          <!-- End Submenu (level 2) -->
        </li>
        <!-- End Pages - Login &amp; Signup -->

        <!-- Pages - Services -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'pages-services' %}active{% endif %}">
          <a id="nav-link--pages--services" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--pages--services"
          >Services</a>

          <!-- Submenu (level 2) -->
          <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--pages--services"
              aria-labelledby="nav-link--pages--services">
            <li class="dropdown-item {% if mainNavActive_3 == 'page-services-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-services-1.html">Services 1</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-services-2' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-services-2.html">Services 2</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-services-3' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-services-3.html">Services 3</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-services-4' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-services-4.html">Services 4</a>
            </li>
          </ul>
          <!-- End Submenu (level 2) -->
        </li>
        <!-- End Pages - Services -->

        <!-- Pages - Search results -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'pages-search-results' %}active{% endif %}">
          <a id="nav-link--pages--search-result" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--pages--search-result"
          >Search results</a>

          <!-- Submenu (level 2) -->
          <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--pages--search-result"
              aria-labelledby="nav-link--pages--search-result">
            <li class="dropdown-item {% if mainNavActive_3 == 'page-search-results-grid-veiw-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-search-results-grid-veiw-1.html">Grid View</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-search-results-grid-veiw-left-sidebar-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-search-results-grid-veiw-left-sidebar-1.html">Grid View <span class="g-opacity-0_5">(with Sidebar)</span></a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-search-results-list-veiw-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-search-results-list-veiw-1.html">List View 1</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-search-results-list-veiw-2' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-search-results-list-veiw-2.html">List View 2</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-search-results-list-veiw-left-sidebar-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-search-results-list-veiw-left-sidebar-1.html">List View <span class="g-opacity-0_5">(with Sidebar)</span></a>
            </li>
          </ul>
          <!-- End Submenu (level 2) -->
        </li>
        <!-- End Pages - Search results -->

        <!-- Pages - Profiles -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'pages-profiles' %}active{% endif %}">
          <a id="nav-link--pages--profile" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--pages--profile"
          >Profiles</a>

          <!-- Submenu (level 2) -->
          <ul class="hs-sub-menu list-unstyled u-shadow-v11 u-dropdown-col-2 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--pages--profile"
              aria-labelledby="nav-link--pages--profile">
            <li class="dropdown-item {% if mainNavActive_3 == 'page-profile-main-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-profile-main-1.html">Main</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-profile-profile-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-profile-profile-1.html">User</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-profile-projects-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-profile-projects-1.html">Projects</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-profile-comments-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-profile-comments-1.html">Comments</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-profile-history-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-profile-history-1.html">History</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-profile-reviews-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-profile-reviews-1.html">Reviews</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-profile-settings-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-profile-settings-1.html">Settings</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-profile-users-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-profile-users-1.html">Contacts 1</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-profile-users-1-full-width' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-profile-users-1-full-width.html">Contacts 1 <span class="g-opacity-0_5">(full width)</span></a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-profile-users-2' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-profile-users-2.html">Contacts 2</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-profile-users-2-full-width' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-profile-users-2-full-width.html">Contacts 2 <span class="g-opacity-0_5">(full width)</span></a>
            </li>
          </ul>
          <!-- End Submenu (level 2) -->
        </li>
        <!-- End Pages - Profiles -->

        <!-- Pages - Сontacts -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'pages-contacts' %}active{% endif %}">
          <a id="nav-link--pages--contacts" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--pages--contacts"
          >Сontacts</a>

          <!-- Submenu (level 2) -->
          <ul class="hs-sub-menu list-unstyled u-shadow-v11 u-dropdown-col-2 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--pages--contacts"
              aria-labelledby="nav-link--pages--contacts">
            <li class="dropdown-item {% if mainNavActive_3 == 'page-contacts-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-contacts-1.html">Сontacts 1</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-contacts-2' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-contacts-2.html">Сontacts 2</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-contacts-3' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-contacts-3.html">Сontacts 3</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-contacts-4' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-contacts-4.html">Сontacts 4</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-contacts-5' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-contacts-5.html">Сontacts 5</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-contacts-6' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-contacts-6.html">Сontacts 6</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-contacts-7' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-contacts-7.html">Сontacts 7</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-contacts-8' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-contacts-8.html">Сontacts 8</a>
            </li>
          </ul>
          <!-- End Submenu (level 2) -->
        </li>
        <!-- End Pages - Сontacts -->

        <!-- Pages - Jobs -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'pages-jobs' %}active{% endif %}">
          <a id="nav-link--pages--jobs" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--pages--jobs"
          >Jobs</a>

          <!-- Submenu (level 2) -->
          <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--pages--jobs"
              aria-labelledby="nav-link--pages--jobs">
            <li class="dropdown-item {% if mainNavActive_3 == 'page-jobs-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-jobs-1.html">Jobs</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-jobs-description-right-sidebar-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-jobs-description-right-sidebar-1.html">Jobs Description</a>
            </li>
          </ul>
          <!-- End Submenu (level 2) -->
        </li>
        <!-- End Pages - Jobs -->

        <!-- Pages - Pricing -->
        <li class="dropdown-item {% if mainNavActive_2 == 'pages-pricing' %}active{% endif %}">
          <a class="nav-link" href="{{ root }}unify-main/pages/page-pricing-1.html">Pricing</a>
        </li>
        <!-- End Pages - Pricing -->

        <!-- Pages - FAQ -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'pages-faq' %}active{% endif %}">
          <a id="nav-link--pages--faq" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--pages--faq"
          >FAQ</a>

          <!-- Submenu (level 2) -->
          <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--pages--faq"
              aria-labelledby="nav-link--pages--faq">
            <li class="dropdown-item {% if mainNavActive_3 == 'page-faq-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-faq-1.html">FAQ 1</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'page-faq-2' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-faq-2.html">FAQ 2</a>
            </li>
          </ul>
          <!-- End Submenu (level 2) -->
        </li>
        <!-- End Pages - FAQ -->

        <!-- Pages - Others -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'pages-others' %}active{% endif %}">
          <a id="nav-link--pages--others" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--pages--others"
          >Others</a>

          <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--pages--others"
              aria-labelledby="nav-link--pages--others">
            <!-- Clients -->
            <li class="dropdown-item {% if mainNavActive_3 == 'page-clients-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-clients-1.html">Clients</a>
            </li>
            <!-- End Clients -->

            <!-- Terms -->
            <li class="dropdown-item {% if mainNavActive_3 == 'page-terms-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-terms-1.html">Terms</a>
            </li>
            <!-- End Terms -->

            <!-- Сookies -->
            <li class="dropdown-item {% if mainNavActive_3 == 'page-cookies-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-cookies-1.html">Сookies</a>
            </li>
            <!-- End Сookies -->

            <!-- Invoice -->
            <li class="dropdown-item {% if mainNavActive_3 == 'page-invoice-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/pages/page-invoice-1.html">Invoice</a>
            </li>
            <!-- End Invoice -->

            <!-- 404 -->
            <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_3 == 'page-404' %}active{% endif %}">
              <a id="nav-link--pages--404" class="nav-link" href="#!"
                 aria-haspopup="true"
                 aria-expanded="false"
                 aria-controls="nav-submenu--pages--404"
              >404</a>

              <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2 {% if mainNavActive_3 == 'page-faq-2' %}active{% endif %}" id="nav-submenu--pages--404"
                  aria-labelledby="nav-link--pages--404">
                <li class="dropdown-item {% if mainNavActive_4 == 'page-404-1' %}active{% endif %}">
                  <a class="nav-link" href="{{ root }}specialty-pages/404/404-1.html">404 1</a>
                </li>
                <li class="dropdown-item {% if mainNavActive_4 == 'page-404-2' %}active{% endif %}">
                  <a class="nav-link" href="{{ root }}specialty-pages/404/404-2.html">404 2</a>
                </li>
              </ul>
            </li>
            <!-- End 404 -->

            <!-- Coming Soon -->
            <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_3 == 'page-coming-soon' %}active{% endif %}">
              <a id="nav-link--pages--coming-soon" class="nav-link" href="#!"
                 aria-haspopup="true"
                 aria-expanded="false"
                 aria-controls="nav-submenu--pages--coming-soon"
              >Coming Soon</a>

              <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2 {% if mainNavActive_3 == 'page-faq-2' %}active{% endif %}" id="nav-submenu--pages--coming-soon"
                  aria-labelledby="nav-link--pages--coming-soon">
                <li class="dropdown-item {% if mainNavActive_4 == 'page-coming-soon-1' %}active{% endif %}">
                  <a class="nav-link" href="{{ root }}specialty-pages/coming-soon/page-coming-soon-1.html">Coming Soon</a>
                </li>
              </ul>
            </li>
            <!-- End Coming Soon -->
          </ul>
        </li>
        <!-- End Pages - Others -->
      </ul>
    </li>
    <!-- End Pages -->

    <!-- Blog -->
    <li class="nav-item hs-has-sub-menu {% if mainNavActive_1 == 'blog' %}active{% endif %} g-mx-10--lg g-mx-15--xl"
        data-animation-in="fadeIn"
        data-animation-out="fadeOut">
      <a id="nav-link--blog" class="nav-link g-py-7 g-px-0" href="#!"
         aria-haspopup="true"
         aria-expanded="false"
         aria-controls="nav-submenu--blog"
      >Blog</a>

      <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-18 g-mt-8--lg--scrolling" id="nav-submenu--blog"
          aria-labelledby="nav-link--blog">
        <!-- Blog - Minimal -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'blog-minimal' %}active{% endif %}">
          <a id="nav-link--pages--blog--minimal" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--pages--blog--minimal"
          >Minimal</a>

          <!-- Submenu (level 2) -->
          <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--pages--blog--minimal"
              aria-labelledby="nav-link--pages--blog--minimal">
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-minimal-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-minimal-1.html">Minimal 1</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-minimal-1-left-sidebar' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-minimal-1-left-sidebar.html">Minimal 1 <span class="g-opacity-0_5">(left sidebar)</span></a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-minimal-1-right-sidebar' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-minimal-1-right-sidebar.html">Minimal 1 <span class="g-opacity-0_5">(right sidebar)</span></a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-minimal-2' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-minimal-2.html">Minimal 2</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-minimal-2-left-sidebar' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-minimal-2-left-sidebar.html">Minimal 2 <span class="g-opacity-0_5">(left sidebar)</span></a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-minimal-2-right-sidebar' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-minimal-2-right-sidebar.html">Minimal 2 <span class="g-opacity-0_5">(right sidebar)</span></a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-minimal-3' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-minimal-3.html">Minimal 3</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-minimal-3-left-sidebar' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-minimal-3-left-sidebar.html">Minimal 3 <span class="g-opacity-0_5">(left sidebar)</span></a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-minimal-3-right-sidebar' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-minimal-3-right-sidebar.html">Minimal 3 <span class="g-opacity-0_5">(right sidebar)</span></a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-minimal-4' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-minimal-4.html">Minimal 4</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-minimal-4-left-sidebar' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-minimal-4-left-sidebar.html">Minimal 4 <span class="g-opacity-0_5">(left sidebar)</span></a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-minimal-4-right-sidebar' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-minimal-4-right-sidebar.html">Minimal 4 <span class="g-opacity-0_5">(right sidebar)</span></a>
            </li>
          </ul>
          <!-- End Submenu (level 2) -->
        </li>
        <!-- End Blog - Minimal -->

        <!-- Blog - Grid Background -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'blog-grid-background' %}active{% endif %}">
          <a id="nav-link--pages--blog--grid-bg" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--pages--blog--grid-bg"
          >Grid Background</a>

          <!-- Submenu (level 2) -->
          <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--pages--blog--grid-bg"
              aria-labelledby="nav-link--pages--blog--grid-bg">
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-background-overlay-2' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-background-overlay-2.html">Column 2</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-background-overlay-left-sidebar' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-background-overlay-left-sidebar.html">Column 2 <span class="g-opacity-0_5">(left sidebar)</span></a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-background-overlay-right-sidebar' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-background-overlay-right-sidebar.html">Column 2 <span class="g-opacity-0_5">(right sidebar)</span></a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-background-overlay-3' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-background-overlay-3.html">Column 3</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-background-overlay-3-fullwidth' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-background-overlay-3-fullwidth.html">Column 3 <span class="g-opacity-0_5">(full width)</span></a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-background-overlay-4' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-background-overlay-4.html">Column 4</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-background-overlay-4-fullwidth' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-background-overlay-4-fullwidth.html">Column 4 <span class="g-opacity-0_5">(full width)</span></a>
            </li>
          </ul>
          <!-- End Submenu (level 2) -->
        </li>
        <!-- End Blog - Grid Background -->

        <!-- Blog - Grid Classic -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'blog-grid-classic' %}active{% endif %}">
          <a id="nav-link--pages--blog--grid-classic" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--pages--blog--grid-classic"
          >Grid Classic</a>

          <!-- Submenu (level 2) -->
          <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--pages--blog--grid-classic"
              aria-labelledby="nav-link--pages--blog--grid-classic">
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-classic-2' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-classic-2.html">Column 2</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-classic-left-sidebar' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-classic-left-sidebar.html">Column 2 <span class="g-opacity-0_5">(left sidebar)</span></a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-classic-right-sidebar' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-classic-right-sidebar.html">Column 2 <span class="g-opacity-0_5">(right sidebar)</span></a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-classic-3' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-classic-3.html">Column 3</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-classic-3-fullwidth' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-classic-3-fullwidth.html">Column 3 <span class="g-opacity-0_5">(full width)</span></a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-classic-4' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-classic-4.html">Column 4</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-classic-4-fullwidth' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-classic-4-fullwidth.html">Column 4 <span class="g-opacity-0_5">(full width)</span></a>
            </li>
          </ul>
          <!-- End Submenu (level 2) -->
        </li>
        <!-- End Blog - Grid Classic -->

        <!-- Blog - Grid Modern -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'blog-grid-modern' %}active{% endif %}">
          <a id="nav-link--pages--blog--grid-modern" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--pages--blog--grid-modern"
          >Grid Modern</a>

          <!-- Submenu (level 2) -->
          <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--pages--blog--grid-modern"
              aria-labelledby="nav-link--pages--blog--grid-modern">
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-modern-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-modern-1.html">Modern 1</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-modern-2' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-modern-2.html">Modern 2</a>
            </li>
          </ul>
          <!-- End Submenu (level 2) -->
        </li>
        <!-- End Blog - Grid Modern -->

        <!-- Blog - Grid Overlap -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'blog-grid-overlap' %}active{% endif %}">
          <a id="nav-link--pages--blog--grid-overlap" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--pages--blog--grid-overlap"
          >Grid Overlap</a>

          <!-- Submenu (level 2) -->
          <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--pages--blog--grid-overlap"
              aria-labelledby="nav-link--pages--blog--grid-overlap">
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-overlap-2' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-overlap-2.html">Column 2</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-overlap-left-sidebar' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-overlap-left-sidebar.html">Column 2 <span class="g-opacity-0_5">(left sidebar)</span></a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-overlap-right-sidebar' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-overlap-right-sidebar.html">Column 2 <span class="g-opacity-0_5">(right sidebar)</span></a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-overlap-3' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-overlap-3.html">Column 3</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-overlap-3-fullwidth' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-overlap-3-fullwidth.html">Column 3 <span class="g-opacity-0_5">(full width)</span></a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-grid-overlap-4-fullwidth' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-grid-overlap-4-fullwidth.html">Column 4 <span class="g-opacity-0_5">(full width)</span></a>
            </li>
          </ul>
          <!-- End Submenu (level 2) -->
        </li>
        <!-- End Blog - Grid Overlap -->

        <!-- Blog - Masonry -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'blog-masonry' %}active{% endif %}">
          <a id="nav-link--pages--blog--masonry" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--pages--blog--masonry"
          >Masonry</a>

          <!-- Submenu (level 2) -->
          <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--pages--blog--masonry"
              aria-labelledby="nav-link--pages--blog--masonry">
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-masonry-col-2' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-masonry-col-2.html">Column 2</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-masonry-col-3' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-masonry-col-3.html">Column 3</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-masonry-col-3-fullwidth' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-masonry-col-3-fullwidth.html">Column 3 <span class="g-opacity-0_5">(full width)</span></a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-masonry-col-4' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-masonry-col-4.html">Column 4</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-masonry-col-4-fullwidth' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-masonry-col-4-fullwidth.html">Column 4 <span class="g-opacity-0_5">(full width)</span></a>
            </li>
          </ul>
          <!-- End Submenu (level 2) -->
        </li>
        <!-- End Blog - Masonry -->

        <!-- Blog - Single items -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'blog-single-items' %}active{% endif %}">
          <a id="nav-link--pages--blog--single-item" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--pages--blog--single-item"
          >Single items</a>

          <!-- Submenu (level 2) -->
          <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--pages--blog--single-item"
              aria-labelledby="nav-link--pages--blog--single-item">
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-single-item-1' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-single-item-1.html">Single item 1</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'blog-single-item-2' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/blog/blog-single-item-2.html">Single item 2</a>
            </li>
          </ul>
          <!-- End Submenu (level 2) -->
        </li>
        <!-- End Blog - Single items -->
      </ul>
    </li>
    <!-- End Blog -->

    <!-- Features -->
    <li class="nav-item hs-has-sub-menu {% if mainNavActive_1 == 'features' %}active{% endif %} g-mx-10--lg g-mx-15--xl"
        data-animation-in="fadeIn"
        data-animation-out="fadeOut">
      <a id="nav-link--features" class="nav-link g-py-7 g-px-0" href="#!"
         aria-haspopup="true"
         aria-expanded="false"
         aria-controls="nav-submenu--features"
      >Features</a>

      <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-18 g-mt-8--lg--scrolling" id="nav-submenu--features"
          aria-labelledby="nav-link--features">
        <!-- Features - Headers -->
        <li class="dropdown-item {% if mainNavActive_2 == 'features-headers' %}active{% endif %}">
          <a class="nav-link" href="{{ root }}unify-main/shortcodes/headers/index.html">Headers</a>
        </li>
        <!-- End Features - Headers -->

        <!-- Features - Promo blocks -->
        <li class="dropdown-item {% if mainNavActive_2 == 'features-promo' %}active{% endif %}">
          <a class="nav-link" href="{{ root }}unify-main/shortcodes/promo/index.html">Promo Blocks</a>
        </li>
        <!-- End Features - Promo blocks -->

        <!-- Features - Sliders -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'features-sliders' %}active{% endif %}">
          <a id="nav-link--features--sliders" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--features--sliders"
          >Sliders</a>

          <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--features--sliders"
              aria-labelledby="nav-link--features--sliders">
            <li class="dropdown-item {% if mainNavActive_3 == 'features-revolution-slider' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}revolution-slider/index.html">Revolution sliders</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'features-master-slider' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}master-slider/index.html">Master sliders</a>
            </li>
          </ul>
        </li>
        <!-- End Features - Sliders -->

        <!-- Features - Pop-ups -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'features-pop-ups' %}active{% endif %}">
          <a id="nav-link--features--pop-ups" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--features--pop-ups"
          >Pop-ups</a>

          <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--features--pop-ups"
              aria-labelledby="nav-link--features--pop-ups">
            <li class="dropdown-item {% if mainNavActive_3 == 'features-shortcode-base-lightbox' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/shortcodes/shortcode-base-lightbox.html">Lightbox</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'features-shortcode-base-modals' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/shortcodes/shortcode-base-modals.html">Modals</a></li>
            <li class="dropdown-item {% if mainNavActive_3 == 'features-shortcode-blocks-gallery' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/shortcodes/shortcode-blocks-gallery-grid.html">Gallery</a>
            </li>
          </ul>
        </li>
        <!-- End Features - Pop-ups -->

        <!-- Features - Maps -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'features-maps' %}active{% endif %}">
          <a id="nav-link--features--maps" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--features--maps"
          >Maps</a>

          <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--features--maps"
              aria-labelledby="nav-link--features--maps">
            <li class="dropdown-item {% if mainNavActive_3 == 'features-shortcode-base-google-maps' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/shortcodes/shortcode-base-google-maps.html">Google Maps</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'features-shortcode-base-maps-with-pins' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/shortcodes/shortcode-base-maps-with-pins.html">Maps With Pins</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'features-shortcode-base-vector-maps' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/shortcodes/shortcode-base-vector-maps.html">Vector Maps</a>
            </li>
          </ul>
        </li>
        <!-- End Features - Maps -->

        <!-- Features - Footers -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'features-footers' %}active{% endif %}">
          <a id="nav-link--features--footers" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--features--footers"
          >Footers</a>

          <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2" id="nav-submenu--features--footers"
              aria-labelledby="nav-link--features--footers">
            <li class="dropdown-item {% if mainNavActive_3 == 'features-shortcode-blocks-footer-classic' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/shortcodes/footers/shortcode-blocks-footer-classic.html">Classic Footers</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'features-shortcode-blocks-footer-contact-forms' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/shortcodes/footers/shortcode-blocks-footer-contact-forms.html">Contact Forms</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'features-shortcode-blocks-footer-maps' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/shortcodes/footers/shortcode-blocks-footer-maps.html">Footers Maps</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'features-shortcode-blocks-footer-modern' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}unify-main/shortcodes/footers/shortcode-blocks-footer-modern.html">Modern Footers</a>
            </li>
          </ul>
        </li>
        <!-- End Features - Footers -->
      </ul>
    </li>
    <!-- End Features -->

    <!-- Shortcodes -->
    <li class="nav-item {% if mainNavActive_1 == 'shortcodes' %}active{% endif %} g-mx-10--lg g-mx-15--xl">
      <a href="{{ root }}unify-main/shortcodes/index.html" class="nav-link g-py-7 g-px-0">Shortcodes</a>
    </li>
    <!-- End Shortcodes -->

    <!-- Demos -->
    <li class="nav-item hs-has-sub-menu {% if mainNavActive_1 == 'demos' %}active{% endif %} g-mx-10--lg g-mx-15--xl"
        data-animation-in="fadeIn"
        data-animation-out="fadeOut">
      <a id="nav-link-demos" class="nav-link g-py-7 g-px-0" href="#!"
         aria-haspopup="true"
         aria-expanded="false"
         aria-controls="nav-submenu-demos"
      >Demos</a>

      <ul class="hs-sub-menu list-unstyled u-shadow-v11 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-18 g-mt-8--lg--scrolling" id="nav-submenu-demos"
          aria-labelledby="nav-link-demos">
        <!-- Demos - One Pages -->
        <li class="dropdown-item hs-has-sub-menu {% if mainNavActive_2 == 'demos-one-pages' %}active{% endif %}">
          <a id="nav-link--demos--one-page" class="nav-link" href="#!"
             aria-haspopup="true"
             aria-expanded="false"
             aria-controls="nav-submenu--demos--one-page"
          >One Pages</a>

          <ul class="hs-sub-menu list-unstyled u-shadow-v11 u-dropdown-col-2 g-brd-top g-brd-primary g-brd-top-2 g-min-width-220 g-mt-minus-2 hs-reversed" id="nav-submenu--demos--one-page"
              aria-labelledby="nav-link--demos--one-page">
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-accounting' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/accounting/index.html" target="_blank">Accounting</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-agency' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/agency/index.html" target="_blank">Agency</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-app' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/app/index.html" target="_blank">App</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-architecture' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/architecture/index.html" target="_blank">Architecture</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-business' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/business/index.html" target="_blank">Business</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-charity' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/charity/index.html" target="_blank">Charity</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-consulting' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/consulting/index.html" target="_blank">Сonsulting</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-construction' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/construction/index.html" target="_blank">Construction</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-courses' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/courses/index.html" target="_blank">Courses</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-corporate' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/corporate/index.html" target="_blank">Corporate</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-event' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/event/index.html" target="_blank">Event</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-gym' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/gym/index.html" target="_blank">GYM</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-lawyer' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/lawyer/index.html" target="_blank">Lawyer</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-music' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/music/index.html" target="_blank">Music</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-photography' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/photography/index.html" target="_blank">Photography</a>
              </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-real-estate' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/real-estate/index.html" target="_blank">Real Estate</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-restaurant' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/restaurant/index.html" target="_blank">Restaurant</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-shipping' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/shipping/index.html" target="_blank">Shipping</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-spa' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/spa/index.html" target="_blank">Spa</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-travel' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/travel/index.html" target="_blank">Travel</a>
            </li>
            <li class="dropdown-item {% if mainNavActive_3 == 'demos-wedding' %}active{% endif %}">
              <a class="nav-link" href="{{ root }}one-pages/wedding/index.html" target="_blank">Wedding</a>
            </li>
          </ul>
        </li>
        <!-- End Demos - One Pages -->

        <!-- Demos - Admin Template -->
        <li class="dropdown-item {% if mainNavActive_2 == 'demos-admin-template' %}active{% endif %}">
          <a class="nav-link" href="{{ root }}admin-template/dashboards/dashboard-v1.html" target="_blank">Admin Template <span class="u-label g-rounded-3 g-font-size-10 g-bg-lightred g-py-3 g-pos-rel g-top-minus-1 g-ml-5">New</span></a>
        </li>
        <!-- End Demos - Admin Template -->

        <!-- Demos - E-Commerce -->
        <li class="dropdown-item {% if mainNavActive_2 == 'demos-e-commerce' %}active{% endif %}">
          <a class="nav-link" href="{{ root }}e-commerce/home-page-1.html" target="_blank">E-Commerce <span class="g-opacity-0_5">(44 Pages)</span></a>
        </li>
        <!-- End Demos - E-Commerce -->

        <!-- Demos - University -->
        <li class="dropdown-item {% if mainNavActive_3 == 'demos-blog-magazine-classic-bm-classic-home-2' %}active{% endif %}">
          <a class="nav-link" href="{{ root }}multipage/education/home-page-1.html" target="_blank">University <span class="g-opacity-0_5">(13 Pages)</span></a>
        </li>
        <!-- End Demos - University -->

        <!-- Demos - Marketing -->
        <li class="dropdown-item {% if mainNavActive_3 == 'demos-blog-magazine-classic-bm-classic-home-3' %}active{% endif %}">
          <a class="nav-link" href="{{ root }}multipage/marketing/home-page-1.html" target="_blank">Marketing <span class="g-opacity-0_5">(10 Pages)</span></a>
        </li>
        <!-- End Demos - Marketing -->

        <!-- Demos - Real Estate -->
        <li class="dropdown-item {% if mainNavActive_3 == 'demos-blog-magazine-classic-bm-classic-home-2' %}active{% endif %}">
          <a class="nav-link" href="{{ root }}multipage/real-estate/home-page-1.html" target="_blank">Real Estate <span class="g-opacity-0_5">(13 Pages)</span></a>
        </li>
        <!-- End Demos - Real Estate -->

        <!-- Demos - Blogs & Magazines -->
        <li class="dropdown-item {% if mainNavActive_3 == 'demos-blog-magazine-classic-bm-classic-home-1' %}active{% endif %}">
          <a class="nav-link" href="{{ root }}multipage/blog-magazine/classic/bm-classic-home-page-1.html" target="_blank">Blogs &amp; Magazines  <span class="g-opacity-0_5">(6 Pages)</span></a>
        </li>
        <!-- End Demos - Blogs & Magazines -->
      </ul>
    </li>
    <!-- End Demos -->
  </ul>
</div>
<!-- End Navigation -->