<!DOCTYPE html>
<html class="no-js layout--fixed-header layout--sidebar theme--fp" lang="en">
	<head>
	<meta charset="UTF-8" />
	<meta http-equiv="x-ua-compatible" content="ie=edge" />
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, viewport-fit=cover" />
	<title>Fannypack</title>

	<meta name="robots" content="index, follow">
	<meta name="description" content="An open source HTML and CSS toolkit with prebuilt modules and a responsive design. Build the most awesome sites and applications.">
	<link rel="canonical" href="https://fannypack.dpgmedia.net/sitemap.xml">
	

	<link rel="stylesheet" href="https://fannypack.dpgmedia.net/css/fannypack.css" />
	<link rel="stylesheet" href="https://fannypack.dpgmedia.net/css/docs.css" />

	<meta property="og:locale" content="en_US">
<meta property="og:type" content="product.item">
<meta property="og:title" content="Fannypack">
<meta property="og:description" content="An open source HTML and CSS toolkit with prebuilt modules and a responsive design. Build the most awesome sites and applications.">
<meta property="og:url" content="https://fannypack.dpgmedia.net/sitemap.xml">
<meta property="og:site_name" content="Fannypack">




<meta name="twitter:card" content="summary" />


	<link rel="shortcut icon" type="image/png" href="https://fannypack.dpgmedia.net/img/favicon.png" >
</head>

	<body class="bs-docs-home">
		

		<header class="site-header" role="banner">
	<div class="site-header__section">
		<a href="/" class="app-icon app-icon--neon-pink" aria-labelledby="app-icon-name">
	<span class="app-icon__name" id="app-icon-name">DPG Media <span class="text--muted">/ Fannypack</span></span>
</a>

	</div>
	<div class="site-header__section">
		<nav class="nav" role="navigation">
	<ul class="nav__list">
	
		<li class="nav__item" role="presentation">
			<a class="nav__link" title="" href="/getting-started/">Documentation</a>
		</li>
	
		<li class="nav__item" role="presentation">
			<a class="nav__link" title="" href="https://github.com/depersgroep/fannypack">Github</a>
		</li>
	
	</ul>
</nav>

	</div>
</header>


		<main class="main-container">
			<input type="checkbox" class="sidebar__checkbox" id="sidebar__checkbox" />
<label for="sidebar__checkbox" tabindex="0" class="sidebar__menu" role="button" aria-label="Menu">
	<span class="sidebar__menu-line" role="presentation"></span>
	<span class="sidebar__menu-line" role="presentation"></span>
	<span class="sidebar__menu-line" role="presentation"></span>
</label>

<div class="sidebar">
	<nav class="nav nav--vertical" role="navigation">
	<ul class="nav__list">
		
		
		<li class="nav__item" role="presentation">
			<span class="nav__title">Getting started</span>
			
			<ul class="nav__list nav__list--nested">
			
				<li class="nav__item 1" role="presentation">
					<a class="nav__link" title="Getting started" href="/getting-started/">Getting started</a>
					<!-- /getting-started/ -->
					<!-- /sitemap.xml -->
				</li>
			
			</ul>
			
		</li>
		
		<li class="nav__item" role="presentation">
			<span class="nav__title">Style</span>
			
			<ul class="nav__list nav__list--nested">
			
				<li class="nav__item 1" role="presentation">
					<a class="nav__link" title="Color" href="/style/color/">Color</a>
					<!-- /style/color/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 2" role="presentation">
					<a class="nav__link" title="Typography" href="/style/typography/">Typography</a>
					<!-- /style/typography/ -->
					<!-- /sitemap.xml -->
				</li>
			
			</ul>
			
		</li>
		
		<li class="nav__item" role="presentation">
			<span class="nav__title">Layout</span>
			
			<ul class="nav__list nav__list--nested">
			
				<li class="nav__item 1" role="presentation">
					<a class="nav__link" title="Grid" href="/layout/grid/">Grid</a>
					<!-- /layout/grid/ -->
					<!-- /sitemap.xml -->
				</li>
			
			</ul>
			
		</li>
		
		<li class="nav__item" role="presentation">
			<span class="nav__title">Modules</span>
			
			<ul class="nav__list nav__list--nested">
			
				<li class="nav__item 1" role="presentation">
					<a class="nav__link" title="Alert" href="/modules/alert/">Alert</a>
					<!-- /modules/alert/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 2" role="presentation">
					<a class="nav__link" title="App icons" href="/modules/app-icons/">App icons</a>
					<!-- /modules/app-icons/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 3" role="presentation">
					<a class="nav__link" title="Boxes" href="/modules/boxes/">Boxes</a>
					<!-- /modules/boxes/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 4" role="presentation">
					<a class="nav__link" title="Breadcrumb" href="/modules/breadcrumb/">Breadcrumb</a>
					<!-- /modules/breadcrumb/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 5" role="presentation">
					<a class="nav__link" title="Buttons" href="/modules/buttons/">Buttons</a>
					<!-- /modules/buttons/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 6" role="presentation">
					<a class="nav__link" title="Forms" href="/modules/forms/">Forms</a>
					<!-- /modules/forms/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 7" role="presentation">
					<a class="nav__link" title="Hamburger" href="/modules/hamburger/">Hamburger</a>
					<!-- /modules/hamburger/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 8" role="presentation">
					<a class="nav__link" title="Header" href="/modules/header/">Header</a>
					<!-- /modules/header/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 9" role="presentation">
					<a class="nav__link" title="Icons" href="/modules/icons/">Icons</a>
					<!-- /modules/icons/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 10" role="presentation">
					<a class="nav__link" title="Labels" href="/modules/labels/">Labels</a>
					<!-- /modules/labels/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 11" role="presentation">
					<a class="nav__link" title="Navigation" href="/modules/navigation/">Navigation</a>
					<!-- /modules/navigation/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 12" role="presentation">
					<a class="nav__link" title="Pagination" href="/modules/pagination/">Pagination</a>
					<!-- /modules/pagination/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 13" role="presentation">
					<a class="nav__link" title="Panels" href="/modules/panels/">Panels</a>
					<!-- /modules/panels/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 14" role="presentation">
					<a class="nav__link" title="Tables" href="/modules/tables/">Tables</a>
					<!-- /modules/tables/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 15" role="presentation">
					<a class="nav__link" title="Tabs" href="/modules/tabs/">Tabs</a>
					<!-- /modules/tabs/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 16" role="presentation">
					<a class="nav__link" title="Toolbar" href="/modules/toolbar/">Toolbar</a>
					<!-- /modules/toolbar/ -->
					<!-- /sitemap.xml -->
				</li>
			
			</ul>
			
		</li>
		
		<li class="nav__item" role="presentation">
			<span class="nav__title">Templates</span>
			
			<ul class="nav__list nav__list--nested">
			
				<li class="nav__item 1" role="presentation">
					<a class="nav__link" title="Base" href="/templates/base/">Base</a>
					<!-- /templates/base/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 2" role="presentation">
					<a class="nav__link" title="2 column" href="/templates/2col/">2 column</a>
					<!-- /templates/2col/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 3" role="presentation">
					<a class="nav__link" title="Drawer" href="/templates/drawer/">Drawer</a>
					<!-- /templates/drawer/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 4" role="presentation">
					<a class="nav__link" title="Drawer with gutter" href="/templates/drawer-gutter/">Drawer with gutter</a>
					<!-- /templates/drawer-gutter/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 5" role="presentation">
					<a class="nav__link" title="Drawer with gutter and push" href="/templates/drawer-push-gutter/">Drawer with gutter and push</a>
					<!-- /templates/drawer-push-gutter/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 6" role="presentation">
					<a class="nav__link" title="Fixed header" href="/templates/fixed-header/">Fixed header</a>
					<!-- /templates/fixed-header/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 7" role="presentation">
					<a class="nav__link" title="Vertical header" href="/templates/vertical-header/">Vertical header</a>
					<!-- /templates/vertical-header/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 8" role="presentation">
					<a class="nav__link" title="Login" href="/templates/login/">Login</a>
					<!-- /templates/login/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 9" role="presentation">
					<a class="nav__link" title="403" href="/templates/403/">403</a>
					<!-- /templates/403/ -->
					<!-- /sitemap.xml -->
				</li>
			
				<li class="nav__item 10" role="presentation">
					<a class="nav__link" title="404" href="/templates/404/">404</a>
					<!-- /templates/404/ -->
					<!-- /sitemap.xml -->
				</li>
			
			</ul>
			
		</li>
		
		
	</ul>
</nav>

</div>

			<div class="main-content">
				<header class="page-header">
					<h1></h1>
				</header>
				<div class="main-content__inner">
					<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd" xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
  <url>
    <loc>https://fannypack.dpgmedia.net/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>daily</changefreq>
    <priority>1.0</priority>
  </url>
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/templates/2col/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/templates/403/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/404/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/templates/404/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/modules/alert/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/modules/app-icons/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/templates/base/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/modules/boxes/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/modules/breadcrumb/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/modules/buttons/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/style/color/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/templates/drawer-gutter/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/templates/drawer-push-gutter/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/templates/drawer-push/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/templates/drawer/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/templates/fixed-header/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/modules/forms/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/getting-started/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/layout/grid/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/modules/hamburger/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/modules/header/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/modules/icons/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/modules/labels/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/templates/login/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/modules/navigation/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/modules/pagination/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/modules/panels/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/modules/tables/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/modules/tabs/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/modules/toolbar/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/style/typography/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
  
  <url>
    <loc>https://fannypack.dpgmedia.net/templates/vertical-header/</loc>
    <lastmod>2025-04-14T11:35:15+00:00</lastmod>
    <changefreq>weekly</changefreq>
    <priority>0.7</priority>
  </url>
  
  
</urlset>

				</div>
			</div>
			<footer class="site-footer" role="contentinfo">An Open Source project by DPG Media NV &bull;&nbsp;<a href="https://github.com/depersgroep/fannypack">Source code at GitHub</a>  under <a href="http://www.apache.org/licenses/LICENSE-2.0">Apache 2.0</a> license
</footer>

		</main>
	</body>
</html>
