Navigation menu

You can change navigation menu bar by adding the following classes to body tag:

.ct-headroom–scrollUpMenu – navigation menu is hidden with delay,
.ct-headroom–scrollUpTopBar – top bar is hidden with delay,
.ct-headroom–scrollUpBoth – both top bar and navigation menu is hidden with delay
.ct-headroom–fixedTopBar – top bar is always visible at the top of the screen.
.ct-headroom–fixedMenu – menu is always visible at the top of the screen

Fixed Menu
.ct-headroom–fixedBoth – both top bar and navigation menu are always visible,
.ct-headroom–hideMenu – top bar is always visible on the top of the screen, navigation menu is hidden after scroll

Hide Menu

HTML markup:

<body class="ct-headroom--scrollUpBoth cssAnimate">

<nav class="navbar yamm" role="navigation" data-heighttopbar="40px" data-startnavbar="0">
    <div class="container">
        <div class="navbar-header ct-panel--navbar">
            <a href="index.html">
                <img src="assets/images/demo-content/logo.png" alt="logo">
            </a>
        </div>
        <div class="ct-panelBox">
            <div class="ct-panel--text ct-panel--navbar ct-fw-600"><a href="#">8 534 Listings</a></div>
            <ul class="ct-panel--socials ct-panel--navbar list-inline list-unstyled">
                <li><a href="https://www.facebook.com/createITpl"><div class="ct-socials ct-socials--circle"><i class="fa fa-facebook"></i></div></a></li>
                <li><a href="https://twitter.com/createitpl"><div class="ct-socials ct-socials--circle"><i class="fa fa-twitter"></i></div></a></li>
                <li><a href="#"><div class="ct-socials ct-socials--circle"><i class="fa fa-instagram"></i></div></a></li>
            </ul>
        </div>
        <div class="collapse navbar-collapse">
            <ul class="nav navbar-nav ct-navbar--fadeInUp">
                <li class="dropdown active"><a href="index.html">Home<span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li>
                            <div class="yamm-content">
                                <div class="ct-u-displayTableVertical">
                                    <div class="ct-u-displayTableCell">
                                        <ul class="list-unstyled pull-left">
                                            <li><a href="index.html">Home V1 - Portal Slider</a></li>
                                            <li><a href="index2.html">Home V2 - Portal Map</a></li>
                                            <li><a href="index3.html">Home V3 - Portal Map (Light)</a></li>
                                            <li><a href="index4.html">Home V4 - Real Estate Agency</a></li>
                                            <li><a href="index5.html">Home V5 - Property Slider</a></li>
                                            <li><a href="index6.html">Home V6 - Simple Onepager</a></li>
                                        </ul>
                                    </div>
                                    <div class="ct-u-displayTableCell">
                                        <img class="pull-right" src="assets/images/demo-content/megamenu-image.jpg" alt="">
                                    </div>
                                </div>
                                <div class="ct-menuBrand ct-u-displayTableVertical">
                                    <div class="ct-u-displayTableCell">
                                        <a href="index.html">
                                            <img src="assets/images/demo-content/logo.png" alt="logo">
                                        </a>
                                    </div>
                                    <div class="ct-u-displayTableCell">
                                        <div class="ct-panel--text ct-panel--navbar ct-fw-600"><a href="#">Real Estate Theme</a></div>
                                    </div>
                                </div>
                            </div>
                        </li>
                    </ul>
                </li>
                <li class="dropdown"><a href="properties.html">Properties<span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li>
                            <div class="yamm-content">
                                <div class="ct-u-displayTableVertical">
                                    <div class="ct-u-displayTableCell">
                                        <ul class="list-unstyled pull-left">
                                            <li><a href="product-single.html">Property Page V1</a></li>
                                            <li><a href="product-single2.html">Property Page V2</a></li>
                                            <li><a href="search-grid.html">Properties Page - Grid</a></li>
                                            <li><a href="search-list.html">Properties Page - Listing</a></li>
                                            <li><a href="properties.html">My Properties Page</a></li>
                                        </ul>
                                    </div>
                                    <div class="ct-u-displayTableCell">
                                        <ul class="list-unstyled pull-left">
                                            <li><a href="product-singleEdit.html">Front Editing - Property Page V1</a></li>
                                            <li><a href="product-single2Edit.html">Front Editing - Property Page V2</a></li>
                                        </ul>
                                    </div>
                                    <div class="ct-u-displayTableCell">
                                        <img class="pull-right" src="assets/images/demo-content/megamenu-image-2.jpg" alt="">
                                    </div>
                                </div>
                                <div class="ct-menuBrand ct-u-displayTableVertical">
                                    <div class="ct-u-displayTableCell">
                                        <a href="index.html">
                                            <img src="assets/images/demo-content/logo.png" alt="logo">
                                        </a>
                                    </div>
                                    <div class="ct-u-displayTableCell">
                                        <div class="ct-panel--text ct-panel--navbar ct-fw-600"><a href="#">Real Estate Theme</a></div>
                                    </div>
                                </div>
                            </div>
                        </li>
                    </ul>
                </li>
                <li class="dropdown ct-yamm--dropdownRight"><a href="agent.html">Agents<span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li>
                            <div class="yamm-content">
                                <div class="ct-u-displayTableVertical">
                                    <div class="ct-u-displayTableCell">
                                        <img class="pull-right" src="assets/images/demo-content/megamenu-image-3.jpg" alt="">
                                    </div>
                                    <div class="ct-u-displayTableCell middle-element">
                                        <ul class="list-unstyled pull-left">
                                            <li><a href="agency.html">Agency Page</a></li>
                                            <li><a href="agent.html">Agent's Profile</a></li>
                                            <li><a href="about.html">About Us</a></li>
                                        </ul>
                                    </div>
                                    <div class="ct-u-displayTableCell">
                                        <ul class="list-unstyled pull-left">
                                            <li><a href="agency-edit.html">Front Editing - Agency Page</a></li>
                                            <li><a href="agent-edit.html">Front Editing - Agent's Profile</a></li>
                                        </ul>
                                    </div>
                                </div>
                                <div class="ct-menuBrand ct-u-displayTableVertical">
                                    <div class="ct-u-displayTableCell">
                                        <a href="index.html">
                                            <img src="assets/images/demo-content/logo.png" alt="logo">
                                        </a>
                                    </div>
                                    <div class="ct-u-displayTableCell">
                                        <div class="ct-panel--text ct-panel--navbar ct-fw-600"><a href="#">Real Estate Theme</a></div>
                                    </div>
                                </div>
                            </div>
                        </li>
                    </ul>
                </li>
                <li class="dropdown"><a href="pricing.html">Features<span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li><a href="pricing.html">Pricing Tables</a></li>
                    </ul>
                </li>
                <li class="dropdown"><a href="about.html">Pages<span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li><a href="faq.html">FAQ</a></li>
                        <li><a href="terms.html">Terms</a></li>
                        <li><a href="policy.html">Privacy Policy</a></li>
                        <li><a href="blog.html">Blog</a></li>
                        <li><a href="blog-single.html">Blog Single</a></li>
                        <li><a href="registration.html">Registration</a></li>
                        <li><a href="404.html">404</a></li>
                        <li><a href="maintenance.html">Maintenance</a></li>
                    </ul>
                </li>
                <li><a href="contact.html">Contact Us</a></li>
            </ul>
            <a class="btn btn-primary btn-transparent--border ct-u-text--motive" href="properties.html">List Property</a>
        </div>
        <div class="clearfix"></div>
        <div class="ct-shapeBottom"></div>
    </div>
</nav>

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

</a>

</div>

<div class="ct-panel--text ct-panel--navbar ct-fw-600"><a href="#">8 534 Listings</a></div>

</ul>

</div>

<li>

<li><a href="index.html">Home V1 - Portal Slider</a></li>

<li><a href="index2.html">Home V2 - Portal Map</a></li>

<li><a href="index3.html">Home V3 - Portal Map (Light)</a></li>

<li><a href="index4.html">Home V4 - Real Estate Agency</a></li>

<li><a href="index5.html">Home V5 - Property Slider</a></li>

<li><a href="index6.html">Home V6 - Simple Onepager</a></li>

</ul>

</div>

</div>

</a>

</div>

<div class="ct-panel--text ct-panel--navbar ct-fw-600"><a href="#">Real Estate Theme</a></div>

</div>

</li>

</ul>

</li>

<li class="dropdown"><a href="properties.html">Properties<span class="caret"></span></a>

<li>

<li><a href="product-single.html">Property Page V1</a></li>

<li><a href="product-single2.html">Property Page V2</a></li>

<li><a href="search-grid.html">Properties Page - Grid</a></li>

<li><a href="search-list.html">Properties Page - Listing</a></li>

<li><a href="properties.html">My Properties Page</a></li>

</ul>

</div>

<li><a href="product-singleEdit.html">Front Editing - Property Page V1</a></li>

<li><a href="product-single2Edit.html">Front Editing - Property Page V2</a></li>

</ul>

</div>

</div>

</a>

</div>

<div class="ct-panel--text ct-panel--navbar ct-fw-600"><a href="#">Real Estate Theme</a></div>

</div>

</li>

</ul>

</li>

<li class="dropdown ct-yamm--dropdownRight"><a href="agent.html">Agents<span class="caret"></span></a>

<li>

</div>

<li><a href="agency.html">Agency Page</a></li>

<li><a href="agent.html">Agent's Profile</a></li>

<li><a href="about.html">About Us</a></li>

</ul>

</div>

<li><a href="agency-edit.html">Front Editing - Agency Page</a></li>

<li><a href="agent-edit.html">Front Editing - Agent's Profile</a></li>

</ul>

</div>

</a>

</div>

<div class="ct-panel--text ct-panel--navbar ct-fw-600"><a href="#">Real Estate Theme</a></div>

</div>

</li>

</ul>

</li>

<li class="dropdown"><a href="pricing.html">Features<span class="caret"></span></a>

<li><a href="pricing.html">Pricing Tables</a></li>

</ul>

</li>

<li class="dropdown"><a href="about.html">Pages<span class="caret"></span></a>

<li><a href="terms.html">Terms</a></li>

<li><a href="policy.html">Privacy Policy</a></li>

<li><a href="blog-single.html">Blog Single</a></li>

<li><a href="registration.html">Registration</a></li>

<li><a href="maintenance.html">Maintenance</a></li>

</ul>

</li>

<li><a href="contact.html">Contact Us</a></li>

</ul>

<a class="btn btn-primary btn-transparent--border ct-u-text--motive" href="properties.html">List Property</a>

</div>

</div>

</nav>

News

Siver

Estato

Disrupt

We are elite