Module Themes
Menu Options
Menu Styles
Headers
Layouts
Footers
Breadcrumbs
Granular Styling
Accessibility
Google Translator
RTL
Fast-Track design & development with enterprise functionality in just a few clicks
Customize the font, size, foreground and background colors of each individual component including header, menu (root items, sub menus, active menus, headings, mobile menu, vertical menu, mega menu), body, headings, paragraphs, and links (visited, hover, active)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76
<ul class="nav nav-pills sort-source" data-sort-id="portfolio" data-option-key="filter"> <li data-option-value="*" class="nav-item active"><a class="nav-link" href="#">Show All</a></li> <li data-option-value=".websites" class="nav-item"><a class="nav-link" href="#">Websites</a></li> <li data-option-value=".logos" class="nav-item"><a class="nav-link" href="#">Logos</a></li> <li data-option-value=".brands" class="nav-item"><a class="nav-link" href="#">Brands</a></li> </ul> <ul class="row image-gallery sort-destination lightbox" data-sort-id="portfolio" data-plugin-options="{'delegate': 'a', 'type': 'image', 'gallery': {'enabled': true}}"> <li class="col-md-3 col-sm-6 isotope-item websites"> <div class="image-gallery-item"> <a href="/portals/22/img/projects/project.jpg"> <div class="thumb-info"> <span class="thumb-info-wrapper"> <img alt="Project-Image-1" src="/portals/22/img/projects/project.jpg" class="img-fluid" /> <span class="thumb-info-title"> <span class="thumb-info-inner">Project Title</span> <span class="thumb-info-type">Project Type</span> </span> <span class="thumb-info-action-icon"> <em class="fas fa-link"></em> </span> </span> </div> <span class="btn-text-indent">Project Title</span> </a> </div> </li> <li class="col-md-3 col-sm-6 isotope-item logos"> <div class="image-gallery-item"> <a href="/portals/22/img/projects/project-2.jpg"> <div class="thumb-info"> <span class="thumb-info-wrapper"> <img alt="Project-Image-2" src="/portals/22/img/projects/project-2.jpg" class="img-fluid" /> <span class="thumb-info-title"> <span class="thumb-info-inner">Project Title</span> <span class="thumb-info-type">Project Type</span> </span> <span class="thumb-info-action-icon"> <em class="fas fa-link"></em> </span> </span> </div> <span class="btn-text-indent">Project Title</span> </a> </div> </li> <li class="col-md-3 col-sm-6 isotope-item brands"> <div class="image-gallery-item"> <a href="/portals/22/img/projects/project-4.jpg"> <div class="thumb-info"> <span class="thumb-info-wrapper"> <img alt="Project-Image-4" src="/portals/22/img/projects/project-4.jpg" class="img-fluid" /> <span class="thumb-info-title"> <span class="thumb-info-inner">Project Title</span> <span class="thumb-info-type">Project Type</span> </span> <span class="thumb-info-action-icon"> <em class="fas fa-link"></em> </span> </span> </div> <span class="btn-text-indent">Project Title</span> </a> </div> </li> <li class="col-md-3 col-sm-6 isotope-item websites"> <div class="image-gallery-item"> <a href="/portals/22/img/projects/project-5.jpg"> <div class="thumb-info"> <span class="thumb-info-wrapper"> <img alt="Project-Image-5" src="/portals/22/img/projects/project-5.jpg" class="img-fluid" /> <span class="thumb-info-title"> <span class="thumb-info-inner">Project Title</span> <span class="thumb-info-type">Project Type</span> </span> <span class="thumb-info-action-icon"> <em class="fas fa-link"></em> </span> </span> </div> <span class="btn-text-indent">Project Title</span> </a> </div> </li> </ul>
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87
<ul class="image-gallery sort-destination full-width"> <li class="isotope-item"> <div class="image-gallery-item"> <a href="../../Portfolio/Single-Project"> <div class="thumb-info thumb-info-centered-info thumb-info-no-borders"> <div class="thumb-info-wrapper"> <img alt="Project-Image-1" src="/portals/22/img/projects/project.jpg" class="img-fluid" /> <div class="thumb-info-title"> <span class="thumb-info-inner">Project Title</span> <span class="thumb-info-type">Project Type</span> </div> <span class="thumb-info-action-icon"> <em class="fas fa-link"></em> </span> </div> </div> <span class="btn-text-indent">Single Project</span> </a> </div> </li> <li class="isotope-item"> <div class="image-gallery-item"> <a href="../../Portfolio/Single-Project"> <div class="thumb-info thumb-info-centered-info thumb-info-no-borders"> <div class="thumb-info-wrapper"> <img alt="Project-Image-2" src="/portals/22/img/projects/project-2.jpg" class="img-fluid" /> <div class="thumb-info-title"> <span class="thumb-info-inner">Project Title</span> <span class="thumb-info-type">Project Type</span> </div> <span class="thumb-info-action-icon"> <em class="fas fa-link"></em> </span> </div> </div> <span class="btn-text-indent">Single Project</span> </a> </div> </li> <li class="isotope-item"> <div class="image-gallery-item"> <a href="../../Portfolio/Single-Project"> <div class="thumb-info thumb-info-centered-info thumb-info-no-borders"> <div class="thumb-info-wrapper"> <img alt="Project-Image-4" src="/portals/22/img/projects/project-4.jpg" class="img-fluid" /> <div class="thumb-info-title"> <span class="thumb-info-inner">Project Title</span> <span class="thumb-info-type">Project Type</span> </div> <span class="thumb-info-action-icon"> <em class="fas fa-link"></em> </span> </div> </div> <span class="btn-text-indent">Single Project</span> </a> </div> </li> <li class="isotope-item"> <div class="image-gallery-item"> <a href="../../Portfolio/Single-Project"> <div class="thumb-info thumb-info-centered-info thumb-info-no-borders"> <div class="thumb-info-wrapper"> <img alt="Project-Image-5" src="/portals/22/img/projects/project-5.jpg" class="img-fluid" /> <div class="thumb-info-title"> <span class="thumb-info-inner">Project Title</span> <span class="thumb-info-type">Project Type</span> </div> <span class="thumb-info-action-icon"> <em class="fas fa-link"></em> </span> </div> </div> <span class="btn-text-indent">Single Project</span> </a> </div> </li> <li class="isotope-item"> <div class="image-gallery-item"> <a href="../../Portfolio/Single-Project"> <div class="thumb-info thumb-info-centered-info thumb-info-no-borders"> <div class="thumb-info-wrapper"> <img alt="Project-Image-6" src="/portals/22/img/projects/project-6.jpg" class="img-fluid" /> <div class="thumb-info-title"> <span class="thumb-info-inner">Project Title</span> <span class="thumb-info-type">Project Type</span> </div> <span class="thumb-info-action-icon"> <em class="fas fa-link"></em> </span> </div> </div> <span class="btn-text-indent">Single Project</span> </a> </div> </li> </ul>
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 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
<div class="masonry" data-plugin-options="{'itemSelector': '.masonry-item'}" data-plugin-masonry="masonry"> <div class="masonry-item"> <a href="../../Portfolio/Single-Project"> <div class="thumb-info thumb-info-centered-info thumb-info-no-borders"> <div class="thumb-info-wrapper"> <img alt="Gallery-1" src="/portals/22/img/gallery/gallery-1.jpg" class="img-fluid" /> <div class="thumb-info-title"> <span class="thumb-info-inner">Project Title</span> <span class="thumb-info-type">Project Type</span> </div> <div class="thumb-info-action"> <span class="thumb-info-action-icon"><em class="fas fa-link"></em></span> </div> </div> </div> <span class="btn-text-indent">Single Project</span> </a> </div> <div class="masonry-item"> <a href="../../Portfolio/Single-Project"> <div class="thumb-info thumb-info-centered-info thumb-info-no-borders"> <div class="thumb-info-wrapper"> <img alt="Gallery-2" src="/portals/22/img/gallery/gallery-2.jpg" class="img-fluid" /> <div class="thumb-info-title"> <span class="thumb-info-inner">Project Title</span> <span class="thumb-info-type">Project Type</span> </div> <div class="thumb-info-action"> <span class="thumb-info-action-icon"><em class="fas fa-link"></em></span> </div> </div> </div> <span class="btn-text-indent">Single Project</span> </a> </div> <div class="masonry-item"> <a href="../../Portfolio/Single-Project"> <div class="thumb-info thumb-info-centered-info thumb-info-no-borders"> <div class="thumb-info-wrapper"> <img alt="Gallery-4" src="/portals/22/img/gallery/gallery-4.jpg" class="img-fluid" /> <div class="thumb-info-title"> <span class="thumb-info-inner">Project Title</span> <span class="thumb-info-type">Project Type</span> </div> <div class="thumb-info-action"> <span class="thumb-info-action-icon"><em class="fas fa-link"></em></span> </div> </div> </div> <span class="btn-text-indent">Single Project</span> </a> </div> <div class="masonry-item"> <a href="../../Portfolio/Single-Project"> <div class="thumb-info thumb-info-centered-info thumb-info-no-borders"> <div class="thumb-info-wrapper"> <img alt="Gallery-3" src="/portals/22/img/gallery/gallery-3.jpg" class="img-fluid" /> <div class="thumb-info-title"> <span class="thumb-info-inner">Project Title</span> <span class="thumb-info-type">Project Type</span> </div> <div class="thumb-info-action"> <span class="thumb-info-action-icon"> <em class="fas fa-link"></em> </span> </div> </div> </div> <span class="btn-text-indent">Single Project</span> </a> </div> <div class="masonry-item"> <a href="../../Portfolio/Single-Project"> <div class="thumb-info thumb-info-centered-info thumb-info-no-borders"> <div class="thumb-info-wrapper"> <img alt="Gallery-6" src="/portals/22/img/gallery/gallery-6.jpg" class="img-fluid" /> <div class="thumb-info-title"> <span class="thumb-info-inner">Project Title</span> <span class="thumb-info-type">Project Type</span> </div> <div class="thumb-info-action"> <span class="thumb-info-action-icon"> <em class="fas fa-link"></em> </span> </div> </div> </div> <span class="btn-text-indent">Single Project</span> </a> </div> <div class="masonry-item"> <a href="../../Portfolio/Single-Project"> <div class="thumb-info thumb-info-centered-info thumb-info-no-borders"> <div class="thumb-info-wrapper"> <img alt="Gallery-5" src="/portals/22/img/gallery/gallery-5.jpg" class="img-fluid" /> <div class="thumb-info-title"> <span class="thumb-info-inner">Project Title</span> <span class="thumb-info-type">Project Type</span> </div> <div class="thumb-info-action"> <span class="thumb-info-action-icon"> <em class="fas fa-link"></em> </span> </div> </div> </div> <span class="btn-text-indent">Single Project</span> </a> </div> <div class="masonry-item"> <a href="../../Portfolio/Single-Project"> <div class="thumb-info thumb-info-centered-info thumb-info-no-borders"> <div class="thumb-info-wrapper"> <img alt="Gallery-8" src="/portals/22/img/gallery/gallery-8.jpg" class="img-fluid" /> <div class="thumb-info-title"> <span class="thumb-info-inner">Project Title</span> <span class="thumb-info-type">Project Type</span> </div> <div class="thumb-info-action"> <span class="thumb-info-action-icon"> <em class="fas fa-link"></em> </span> </div> </div> </div> <span class="btn-text-indent">Single Project</span> </a> </div> <div class="masonry-item"> <a href="../../Portfolio/Single-Project"> <div class="thumb-info thumb-info-centered-info thumb-info-no-borders"> <div class="thumb-info-wrapper"> <img alt="Gallery-7" src="/portals/22/img/gallery/gallery-7.jpg" class="img-fluid" /> <div class="thumb-info-title"> <span class="thumb-info-inner">Project Title</span> <span class="thumb-info-type">Project Type</span> </div> <div class="thumb-info-action"> <span class="thumb-info-action-icon"> <em class="fas fa-link"></em> </span> </div> </div> </div> <span class="btn-text-indent">Single Project</span> </a> </div> </div>
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49
<div class="lightbox restaurant" data-plugin-options="{'delegate': 'a', 'type': 'image', 'gallery': {'enabled': true}}"> <div class="masonry" data-plugin-masonry="masonry" data-plugin-options="{'itemSelector': '.masonry-item'}"> <div class="masonry-item"> <span class="thumb-info thumb-info-centered-icons thumb-info-no-borders"> <span class="thumb-info-wrapper"> <img src="/portals/22/Restaurant/restaurant-gallery-1.jpg" class="img-fluid" alt="restaurant"> <span class="thumb-info-action thumb-info-action-custom"> <a href="/portals/22/Restaurant/restaurant-gallery-1.jpg"> <span class="thumb-info-icon-custom"></span> <span class="btn-text-indent">Restaurant Gallery</span> </a> </span> </span> </span> </div> <div class="masonry-item w2"> <span class="thumb-info thumb-info-centered-icons thumb-info-no-borders"> <span class="thumb-info-wrapper"> <img src="/portals/22/Restaurant/restaurant-gallery-2.jpg" class="img-fluid" alt="restaurant"> <span class="thumb-info-action thumb-info-action-custom"> <a href="/portals/22/Restaurant/restaurant-gallery-2.jpg"> <span class="thumb-info-icon-custom"></span> <span class="btn-text-indent">Restaurant Gallery</span> </a> </span> </span> </span> </div> <div class="masonry-item"> <span class="thumb-info thumb-info-centered-icons thumb-info-no-borders"> <span class="thumb-info-wrapper"> <img src="/portals/22/Restaurant/restaurant-gallery-4.jpg" class="img-fluid" alt="restaurant"> <span class="thumb-info-action thumb-info-action-custom"> <a href="/portals/22/Restaurant/restaurant-gallery-4.jpg"> <span class="thumb-info-icon-custom"></span> <span class="btn-text-indent">Restaurant Gallery</span> </a> </span> </span> </span> </div> <div class="masonry-item"> <span class="thumb-info thumb-info-centered-icons thumb-info-no-borders"> <span class="thumb-info-wrapper"> <img src="/portals/22/Restaurant/restaurant-gallery-3.jpg" class="img-fluid" alt="restaurant"> <span class="thumb-info-action thumb-info-action-custom"> <a href="/portals/22/Restaurant/restaurant-gallery-3.jpg"> <span class="thumb-info-icon-custom"></span> <span class="btn-text-indent">Restaurant Gallery</span> </a> </span> </span> </span> </div> <div class="masonry-item"> <span class="thumb-info thumb-info-centered-icons thumb-info-no-borders"> <span class="thumb-info-wrapper"> <img src="/portals/22/Restaurant/restaurant-gallery-5.jpg" class="img-fluid" alt="restaurant"> <span class="thumb-info-action thumb-info-action-custom"> <a href="/portals/22/Restaurant/restaurant-gallery-5.jpg"> <span class="thumb-info-icon-custom"></span> <span class="btn-text-indent">Restaurant Gallery</span> </a> </span> </span> </span> </div> </div> </div>