Files
dev-chiefworks b085356c99 first commit
2022-09-25 15:25:10 -04:00

757 lines
51 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="An impressive and flawless site template that includes various UI elements and countless features, attractive ready-made blocks and rich pages, basically everything you need to create a unique and professional website.">
<meta name="keywords" content="bootstrap 5, business, corporate, creative, gulp, marketing, minimal, modern, multipurpose, one page, responsive, saas, sass, seo, startup, html5 template, site template">
<meta name="author" content="elemis">
<title>Sandbox - Modern & Multipurpose Bootstrap 5 Template</title>
<link rel="shortcut icon" href="../assets/img/favicon.png">
<link rel="stylesheet" href="../assets/css/plugins.css">
<link rel="stylesheet" href="../assets/css/style.css">
</head>
<body>
<div class="content-wrapper">
<header class="wrapper bg-soft-primary">
<nav class="navbar navbar-expand-lg center-nav transparent navbar-light">
<div class="container flex-lg-row flex-nowrap align-items-center">
<div class="navbar-brand w-100">
<a href="../index.html">
<img src="../assets/img/logo.png" srcset="../assets/img/logo@2x.png 2x" alt="" />
</a>
</div>
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
<div class="offcanvas-header d-lg-none">
<h3 class="text-white fs-30 mb-0">Sandbox</h3>
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="offcanvas" aria-label="Close"></button>
</div>
<div class="offcanvas-body ms-lg-auto d-flex flex-column h-100">
<ul class="navbar-nav">
<li class="nav-item dropdown dropdown-mega">
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Demos</a>
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
<li class="mega-menu-content">
<ul class="row row-cols-1 row-cols-lg-6 gx-0 gx-lg-4 gy-lg-2 list-unstyled">
<li class="col"><a class="dropdown-item" href="../demo1.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi1.jpg" srcset="../assets/img/demos/mi1@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo I</span>
</a></li>
<li class="col"><a class="dropdown-item" href="../demo2.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi2.jpg" srcset="../assets/img/demos/mi2@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo II</span>
</a></li>
<li class="col"><a class="dropdown-item" href="../demo3.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi3.jpg" srcset="../assets/img/demos/mi3@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo III</span>
</a></li>
<li class="col"><a class="dropdown-item" href="../demo4.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi4.jpg" srcset="../assets/img/demos/mi4@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo IV</span>
</a></li>
<li class="col"><a class="dropdown-item" href="../demo5.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi5.jpg" srcset="../assets/img/demos/mi5@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo V</span>
</a></li>
<li class="col"><a class="dropdown-item" href="../demo6.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi6.jpg" srcset="../assets/img/demos/mi6@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo VI</span>
</a></li>
<li class="col"><a class="dropdown-item" href="../demo7.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi7.jpg" srcset="../assets/img/demos/mi7@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo VII</span>
</a></li>
<li class="col"><a class="dropdown-item" href="../demo8.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi8.jpg" srcset="../assets/img/demos/mi8@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo VIII</span>
</a></li>
<li class="col"><a class="dropdown-item" href="../demo9.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi9.jpg" srcset="../assets/img/demos/mi9@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo IX</span>
</a></li>
<li class="col"><a class="dropdown-item" href="../demo10.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi10.jpg" srcset="../assets/img/demos/mi10@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo X</span>
</a></li>
<li class="col"><a class="dropdown-item" href="../demo11.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi11.jpg" srcset="../assets/img/demos/mi11@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo XI</span>
</a></li>
<li class="col"><a class="dropdown-item" href="../demo12.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi12.jpg" srcset="../assets/img/demos/mi12@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo XII</span>
</a></li>
<li class="col"><a class="dropdown-item" href="../demo13.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi13.jpg" srcset="../assets/img/demos/mi13@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo XIII</span>
</a></li>
<li class="col"><a class="dropdown-item" href="../demo14.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi14.jpg" srcset="../assets/img/demos/mi14@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo XIV</span>
</a></li>
<li class="col"><a class="dropdown-item" href="../demo15.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi15.jpg" srcset="../assets/img/demos/mi15@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo XV</span>
</a></li>
<li class="col"><a class="dropdown-item" href="../demo16.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi16.jpg" srcset="../assets/img/demos/mi16@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo XVI</span>
</a></li>
<li class="col"><a class="dropdown-item" href="../demo17.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi17.jpg" srcset="../assets/img/demos/mi17@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo XVII</span>
</a></li>
<li class="col"><a class="dropdown-item" href="../demo18.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi18.jpg" srcset="../assets/img/demos/mi18@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo XVIII</span>
</a></li>
<li class="col"><a class="dropdown-item" href="../demo19.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi19.jpg" srcset="../assets/img/demos/mi19@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo XIX</span>
</a></li>
<li class="col"><a class="dropdown-item" href="../demo20.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi20.jpg" srcset="../assets/img/demos/mi20@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo XX</span>
</a></li>
<li class="col"><a class="dropdown-item" href="../demo21.html">
<figure class="rounded lift d-none d-lg-block"><img src="../assets/img/demos/mi21.jpg" srcset="../assets/img/demos/mi21@2x.jpg 2x" alt=""></figure>
<span class="d-lg-none">Demo XXI</span>
</a></li>
</ul>
<!--/.row -->
</li>
<!--/.mega-menu-content-->
</ul>
<!--/.dropdown-menu -->
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Pages</a>
<ul class="dropdown-menu">
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
<ul class="dropdown-menu">
<li class="nav-item"><a class="dropdown-item" href="../services.html">Services I</a></li>
<li class="nav-item"><a class="dropdown-item" href="../services2.html">Services II</a></li>
</ul>
</li>
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
<ul class="dropdown-menu">
<li class="nav-item"><a class="dropdown-item" href="../about.html">About I</a></li>
<li class="nav-item"><a class="dropdown-item" href="../about2.html">About II</a></li>
</ul>
</li>
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
<ul class="dropdown-menu">
<li class="nav-item"><a class="dropdown-item" href="../shop.html">Shop I</a></li>
<li class="nav-item"><a class="dropdown-item" href="../shop2.html">Shop II</a></li>
<li class="nav-item"><a class="dropdown-item" href="../shop-product.html">Product Page</a></li>
<li class="nav-item"><a class="dropdown-item" href="../shop-cart.html">Shopping Cart</a></li>
<li class="nav-item"><a class="dropdown-item" href="../shop-checkout.html">Checkout</a></li>
</ul>
</li>
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
<ul class="dropdown-menu">
<li class="nav-item"><a class="dropdown-item" href="../contact.html">Contact I</a></li>
<li class="nav-item"><a class="dropdown-item" href="../contact2.html">Contact II</a></li>
<li class="nav-item"><a class="dropdown-item" href="../contact3.html">Contact III</a></li>
</ul>
</li>
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
<ul class="dropdown-menu">
<li class="nav-item"><a class="dropdown-item" href="../career.html">Job Listing I</a></li>
<li class="nav-item"><a class="dropdown-item" href="../career2.html">Job Listing II</a></li>
<li class="nav-item"><a class="dropdown-item" href="../career-job.html">Job Description</a></li>
</ul>
</li>
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
<ul class="dropdown-menu">
<li class="nav-item"><a class="dropdown-item" href="../404.html">404 Not Found</a></li>
<li class="nav-item"><a class="dropdown-item" href="../page-loader.html">Page Loader</a></li>
<li class="nav-item"><a class="dropdown-item" href="../signin.html">Sign In I</a></li>
<li class="nav-item"><a class="dropdown-item" href="../signin2.html">Sign In II</a></li>
<li class="nav-item"><a class="dropdown-item" href="../signup.html">Sign Up I</a></li>
<li class="nav-item"><a class="dropdown-item" href="../signup2.html">Sign Up II</a></li>
<li class="nav-item"><a class="dropdown-item" href="../terms.html">Terms</a></li>
</ul>
</li>
<li class="nav-item"><a class="dropdown-item" href="../pricing.html">Pricing</a></li>
<li class="nav-item"><a class="dropdown-item" href="../onepage.html">One Page</a></li>
</ul>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Projects</a>
<div class="dropdown-menu dropdown-lg">
<div class="dropdown-lg-content">
<div>
<h6 class="dropdown-header">Project Pages</h6>
<ul class="list-unstyled">
<li><a class="dropdown-item" href="../projects.html">Projects I</a></li>
<li><a class="dropdown-item" href="../projects2.html">Projects II</a></li>
<li><a class="dropdown-item" href="../projects3.html">Projects III</a></li>
<li><a class="dropdown-item" href="../projects4.html">Projects IV</a></li>
</ul>
</div>
<!-- /.column -->
<div>
<h6 class="dropdown-header">Single Projects</h6>
<ul class="list-unstyled">
<li><a class="dropdown-item" href="../single-project.html">Single Project I</a></li>
<li><a class="dropdown-item" href="../single-project2.html">Single Project II</a></li>
<li><a class="dropdown-item" href="../single-project3.html">Single Project III</a></li>
</ul>
</div>
<!-- /.column -->
</div>
<!-- /auto-column -->
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog</a>
<ul class="dropdown-menu">
<li class="nav-item"><a class="dropdown-item" href="../blog.html">Blog without Sidebar</a></li>
<li class="nav-item"><a class="dropdown-item" href="../blog2.html">Blog with Sidebar</a></li>
<li class="nav-item"><a class="dropdown-item" href="../blog3.html">Blog with Left Sidebar</a></li>
<li class="dropdown dropdown-submenu dropend"><a class="dropdown-item dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
<ul class="dropdown-menu">
<li class="nav-item"><a class="dropdown-item" href="../blog-post.html">Post without Sidebar</a></li>
<li class="nav-item"><a class="dropdown-item" href="../blog-post2.html">Post with Sidebar</a></li>
<li class="nav-item"><a class="dropdown-item" href="../blog-post3.html">Post with Left Sidebar</a></li>
</ul>
</li>
</ul>
</li>
<li class="nav-item dropdown dropdown-mega">
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Blocks</a>
<ul class="dropdown-menu mega-menu mega-menu-dark mega-menu-img">
<li class="mega-menu-content">
<ul class="row row-cols-1 row-cols-lg-6 gx-0 gx-lg-6 gy-lg-4 list-unstyled">
<li class="col"><a class="dropdown-item" href="../docs/blocks/about.html">
<div class="rounded img-svg d-none d-lg-block p-4 mb-lg-2"><img class="rounded-0" src="../assets/img/demos/block1.svg" alt=""></div>
<span>About</span>
</a>
</li>
<li class="col"><a class="dropdown-item" href="../docs/blocks/blog.html">
<div class="rounded img-svg d-none d-lg-block p-4 mb-lg-2"><img class="rounded-0" src="../assets/img/demos/block2.svg" alt=""></div>
<span>Blog</span>
</a>
</li>
<li class="col"><a class="dropdown-item" href="../docs/blocks/call-to-action.html">
<div class="rounded img-svg d-none d-lg-block p-4 mb-lg-2"><img class="rounded-0" src="../assets/img/demos/block3.svg" alt=""></div>
<span>Call to Action</span>
</a>
</li>
<li class="col"><a class="dropdown-item" href="../docs/blocks/clients.html">
<div class="rounded img-svg d-none d-lg-block p-4 mb-lg-2"><img class="rounded-0" src="../assets/img/demos/block4.svg" alt=""></div>
<span>Clients</span>
</a>
</li>
<li class="col"><a class="dropdown-item" href="../docs/blocks/contact.html">
<div class="rounded img-svg d-none d-lg-block p-4 mb-lg-2"><img class="rounded-0" src="../assets/img/demos/block5.svg" alt=""></div>
<span>Contact</span>
</a>
</li>
<li class="col"><a class="dropdown-item" href="../docs/blocks/facts.html">
<div class="rounded img-svg d-none d-lg-block p-4 mb-lg-2"><img class="rounded-0" src="../assets/img/demos/block6.svg" alt=""></div>
<span>Facts</span>
</a>
</li>
<li class="col"><a class="dropdown-item" href="../docs/blocks/faq.html">
<div class="rounded img-svg d-none d-lg-block p-4 mb-lg-2"><img class="rounded-0" src="../assets/img/demos/block7.svg" alt=""></div>
<span>FAQ</span>
</a>
</li>
<li class="col"><a class="dropdown-item" href="../docs/blocks/features.html">
<div class="rounded img-svg d-none d-lg-block p-4 mb-lg-2"><img class="rounded-0" src="../assets/img/demos/block8.svg" alt=""></div>
<span>Features</span>
</a>
</li>
<li class="col"><a class="dropdown-item" href="../docs/blocks/footer.html">
<div class="rounded img-svg d-none d-lg-block p-4 mb-lg-2"><img class="rounded-0" src="../assets/img/demos/block9.svg" alt=""></div>
<span>Footer</span>
</a>
</li>
<li class="col"><a class="dropdown-item" href="../docs/blocks/hero.html">
<div class="rounded img-svg d-none d-lg-block p-4 mb-lg-2"><img class="rounded-0" src="../assets/img/demos/block10.svg" alt=""></div>
<span>Hero</span>
</a>
</li>
<li class="col"><a class="dropdown-item" href="../docs/blocks/misc.html">
<div class="rounded img-svg d-none d-lg-block p-4 mb-lg-2"><img class="rounded-0" src="../assets/img/demos/block17.svg" alt=""></div>
<span>Misc</span>
</a>
</li>
<li class="col"><a class="dropdown-item" href="../docs/blocks/navbar.html">
<div class="rounded img-svg d-none d-lg-block p-4 mb-lg-2"><img class="rounded-0" src="../assets/img/demos/block11.svg" alt=""></div>
<span>Navbar</span>
</a>
</li>
<li class="col"><a class="dropdown-item" href="../docs/blocks/portfolio.html">
<div class="rounded img-svg d-none d-lg-block p-4 mb-lg-2"><img class="rounded-0" src="../assets/img/demos/block12.svg" alt=""></div>
<span>Portfolio</span>
</a>
</li>
<li class="col"><a class="dropdown-item" href="../docs/blocks/pricing.html">
<div class="rounded img-svg d-none d-lg-block p-4 mb-lg-2"><img class="rounded-0" src="../assets/img/demos/block13.svg" alt=""></div>
<span>Pricing</span>
</a>
</li>
<li class="col"><a class="dropdown-item" href="../docs/blocks/process.html">
<div class="rounded img-svg d-none d-lg-block p-4 mb-lg-2"><img class="rounded-0" src="../assets/img/demos/block14.svg" alt=""></div>
<span>Process</span>
</a>
</li>
<li class="col"><a class="dropdown-item" href="../docs/blocks/team.html">
<div class="rounded img-svg d-none d-lg-block p-4 mb-lg-2"><img class="rounded-0" src="../assets/img/demos/block15.svg" alt=""></div>
<span>Team</span>
</a>
</li>
<li class="col"><a class="dropdown-item" href="../docs/blocks/testimonials.html">
<div class="rounded img-svg d-none d-lg-block p-4 mb-lg-2"><img class="rounded-0" src="../assets/img/demos/block16.svg" alt=""></div>
<span>Testimonials</span>
</a>
</li>
</ul>
<!--/.row -->
</li>
<!--/.mega-menu-content-->
</ul>
<!--/.dropdown-menu -->
</li>
<li class="nav-item dropdown dropdown-mega">
<a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Documentation</a>
<ul class="dropdown-menu mega-menu">
<li class="mega-menu-content">
<div class="row gx-0 gx-lg-3">
<div class="col-lg-4">
<h6 class="dropdown-header">Usage</h6>
<ul class="list-unstyled cc-2 pb-lg-1">
<li><a class="dropdown-item" href="../docs/index.html">Get Started</a></li>
<li><a class="dropdown-item" href="../docs/forms.html">Forms</a></li>
<li><a class="dropdown-item" href="../docs/faq.html">FAQ</a></li>
<li><a class="dropdown-item" href="../docs/changelog.html">Changelog</a></li>
<li><a class="dropdown-item" href="../docs/credits.html">Credits</a></li>
</ul>
<h6 class="dropdown-header mt-lg-6">Styleguide</h6>
<ul class="list-unstyled cc-2">
<li><a class="dropdown-item" href="../docs/styleguide/colors.html">Colors</a></li>
<li><a class="dropdown-item" href="../docs/styleguide/fonts.html">Fonts</a></li>
<li><a class="dropdown-item" href="../docs/styleguide/icons-svg.html">SVG Icons</a></li>
<li><a class="dropdown-item" href="../docs/styleguide/icons-font.html">Font Icons</a></li>
<li><a class="dropdown-item" href="../docs/styleguide/illustrations.html">Illustrations</a></li>
<li><a class="dropdown-item" href="../docs/styleguide/backgrounds.html">Backgrounds</a></li>
<li><a class="dropdown-item" href="../docs/styleguide/misc.html">Misc</a></li>
</ul>
</div>
<!--/column -->
<div class="col-lg-8">
<h6 class="dropdown-header">Elements</h6>
<ul class="list-unstyled cc-3">
<li><a class="dropdown-item" href="../docs/elements/accordion.html">Accordion</a></li>
<li><a class="dropdown-item" href="../docs/elements/alerts.html">Alerts</a></li>
<li><a class="dropdown-item" href="../docs/elements/animations.html">Animations</a></li>
<li><a class="dropdown-item" href="../docs/elements/avatars.html">Avatars</a></li>
<li><a class="dropdown-item" href="../docs/elements/background.html">Background</a></li>
<li><a class="dropdown-item" href="../docs/elements/badges.html">Badges</a></li>
<li><a class="dropdown-item" href="../docs/elements/breadcrumb.html">Breadcrumb</a></li>
<li><a class="dropdown-item" href="../docs/elements/buttons.html">Buttons</a></li>
<li><a class="dropdown-item" href="../docs/elements/card.html">Card</a></li>
<li><a class="dropdown-item" href="../docs/elements/carousel.html">Carousel</a></li>
<li><a class="dropdown-item" href="../docs/elements/dividers.html">Dividers</a></li>
<li><a class="dropdown-item" href="../docs/elements/form-elements.html">Form Elements</a></li>
<li><a class="dropdown-item" href="../docs/elements/image-hover.html">Image Hover</a></li>
<li><a class="dropdown-item" href="../docs/elements/image-mask.html">Image Mask</a></li>
<li><a class="dropdown-item" href="../docs/elements/lightbox.html">Lightbox</a></li>
<li><a class="dropdown-item" href="../docs/elements/player.html">Media Player</a></li>
<li><a class="dropdown-item" href="../docs/elements/modal.html">Modal</a></li>
<li><a class="dropdown-item" href="../docs/elements/progressbar.html">Progressbar</a></li>
<li><a class="dropdown-item" href="../docs/elements/shadows.html">Shadows</a></li>
<li><a class="dropdown-item" href="../docs/elements/shapes.html">Shapes</a></li>
<li><a class="dropdown-item" href="../docs/elements/tables.html">Tables</a></li>
<li><a class="dropdown-item" href="../docs/elements/tabs.html">Tabs</a></li>
<li><a class="dropdown-item" href="../docs/elements/text-animations.html">Text Animations</a></li>
<li><a class="dropdown-item" href="../docs/elements/text-highlight.html">Text Highlight</a></li>
<li><a class="dropdown-item" href="../docs/elements/tiles.html">Tiles</a></li>
<li><a class="dropdown-item" href="../docs/elements/tooltips-popovers.html">Tooltips & Popovers</a></li>
<li><a class="dropdown-item" href="../docs/elements/typography.html">Typography</a></li>
</ul>
</div>
<!--/column -->
</div>
<!--/.row -->
</li>
<!--/.mega-menu-content-->
</ul>
<!--/.dropdown-menu -->
</li>
</ul>
<!-- /.navbar-nav -->
<div class="offcanvas-footer d-lg-none">
<div>
<a href="mailto:first.last@email.com" class="link-inverse">info@email.com</a>
<br /> 00 (123) 456 78 90 <br />
<nav class="nav social social-white mt-4">
<a href="#"><i class="uil uil-twitter"></i></a>
<a href="#"><i class="uil uil-facebook-f"></i></a>
<a href="#"><i class="uil uil-dribbble"></i></a>
<a href="#"><i class="uil uil-instagram"></i></a>
<a href="#"><i class="uil uil-youtube"></i></a>
</nav>
<!-- /.social -->
</div>
</div>
<!-- /.offcanvas-footer -->
</div>
<!-- /.offcanvas-body -->
</div>
<!-- /.navbar-collapse -->
<div class="navbar-other w-100 d-flex ms-auto">
<ul class="navbar-nav flex-row align-items-center ms-auto">
<li class="nav-item dropdown language-select text-uppercase">
<a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
<ul class="dropdown-menu">
<li class="nav-item"><a class="dropdown-item" href="#">En</a></li>
<li class="nav-item"><a class="dropdown-item" href="#">De</a></li>
<li class="nav-item"><a class="dropdown-item" href="#">Es</a></li>
</ul>
</li>
<li class="nav-item d-none d-md-block">
<a href="../contact.html" class="btn btn-sm btn-primary rounded-pill">Contact</a>
</li>
<li class="nav-item d-lg-none">
<button class="hamburger offcanvas-nav-btn"><span></span></button>
</li>
</ul>
<!-- /.navbar-nav -->
</div>
<!-- /.navbar-other -->
</div>
<!-- /.container -->
</nav>
<!-- /.navbar -->
</header>
<!-- /header -->
<section class="wrapper bg-soft-primary">
<div class="container pt-10 pb-12 pt-md-14 pb-md-16 text-center">
<div class="row">
<div class="col-md-9 col-lg-7 col-xl-6 mx-auto">
<h1 class="display-1 mb-3">FAQ</h1>
<p class="lead px-xxl-10">Find answers to some frequently asked questions here.</p>
</div>
<!-- /column -->
</div>
<!-- /.row -->
</div>
<!-- /.container -->
</section>
<!-- /section -->
<div class="container">
<div class="row">
<aside class="col-xl-2 sidebar doc-sidebar mt-md-0 py-16 d-none d-xl-block">
<div class="widget pb-3">
<h6 class="widget-title fs-17 mb-2">Usage</h6>
<nav id="collapse-usage">
<ul class="list-unstyled fs-sm lh-sm text-reset">
<li><a href="../docs/index.html">Get Started</a></li>
<li><a href="../docs/forms.html">Forms</a></li>
<li><a href="../docs/faq.html" class="active">FAQ</a></li>
<li><a href="../docs/changelog.html">Changelog</a></li>
<li><a href="../docs/credits.html">Credits</a></li>
</ul>
</nav>
<!-- /nav -->
</div>
<!-- /.widget -->
<div class="widget pb-3">
<h6 class="widget-title fs-17 mb-2">Styleguide</h6>
<nav id="collapse-style">
<ul class="list-unstyled fs-sm lh-sm text-reset">
<li><a href="../docs/styleguide/colors.html">Colors</a></li>
<li><a href="../docs/styleguide/fonts.html">Fonts</a></li>
<li><a href="../docs/styleguide/icons-svg.html">SVG Icons</a></li>
<li><a href="../docs/styleguide/icons-font.html">Font Icons</a></li>
<li><a href="../docs/styleguide/illustrations.html">Illustrations</a></li>
<li><a href="../docs/styleguide/backgrounds.html">Backgrounds</a></li>
<li><a href="../docs/styleguide/misc.html">Misc</a></li>
</ul>
</nav>
<!-- /nav -->
</div>
<!-- /.widget -->
<div class="widget pb-3">
<h6 class="widget-title fs-17 mb-2">Elements</h6>
<nav id="collapse-elements">
<ul class="list-unstyled fs-sm lh-sm text-reset">
<li><a href="../docs/elements/accordion.html">Accordion</a></li>
<li><a href="../docs/elements/alerts.html">Alerts</a></li>
<li><a href="../docs/elements/animations.html">Animations</a></li>
<li><a href="../docs/elements/avatars.html">Avatars</a></li>
<li><a href="../docs/elements/background.html">Background</a></li>
<li><a href="../docs/elements/badges.html">Badges</a></li>
<li><a href="../docs/elements/breadcrumb.html">Breadcrumb</a></li>
<li><a href="../docs/elements/buttons.html">Buttons</a></li>
<li><a href="../docs/elements/card.html">Card</a></li>
<li><a href="../docs/elements/carousel.html">Carousel</a></li>
<li><a href="../docs/elements/dividers.html">Dividers</a></li>
<li><a href="../docs/elements/form-elements.html">Form Elements</a></li>
<li><a href="../docs/elements/image-hover.html">Image Hover</a></li>
<li><a href="../docs/elements/image-mask.html">Image Mask</a></li>
<li><a href="../docs/elements/lightbox.html">Lightbox</a></li>
<li><a href="../docs/elements/player.html">Media Player</a></li>
<li><a href="../docs/elements/modal.html">Modal</a></li>
<li><a href="../docs/elements/progressbar.html">Progressbar</a></li>
<li><a href="../docs/elements/shadows.html">Shadows</a></li>
<li><a href="../docs/elements/shapes.html">Shapes</a></li>
<li><a href="../docs/elements/tables.html">Tables</a></li>
<li><a href="../docs/elements/tabs.html">Tabs</a></li>
<li><a href="../docs/elements/text-animations.html">Text Animations</a></li>
<li><a href="../docs/elements/text-highlight.html">Text Highlight</a></li>
<li><a href="../docs/elements/tiles.html">Tiles</a></li>
<li><a href="../docs/elements/tooltips-popovers.html">Tooltips & Popovers</a></li>
<li><a href="../docs/elements/typography.html">Typography</a></li>
</ul>
</nav>
<!-- /nav -->
</div>
<!-- /.widget -->
</aside>
<!-- /column -->
<div class="col-xl-8 order-xl-2">
<section id="snippet-1" class="wrapper py-16">
<h2 class="mb-3">Frequently Asked Questions</h2>
<p class="lead mb-5">If you don't see an answer to your question here, please feel free to contact us with the links below:</p>
<a href="https://1.envato.market/VKeok" class="btn btn-primary rounded-pill me-2" target="_blank">Contact Form</a>
<a href="https://1.envato.market/ZdVOOX" class="btn btn-soft-primary rounded-pill" target="_blank">Discussions Page</a>
<div class="accordion accordion-wrapper mt-10" id="accordion">
<div class="card accordion-item">
<div class="card-header" id="faq-0">
<button class="collapsed" data-bs-toggle="collapse" data-bs-target="#faq-collapse-0" aria-expanded="true" aria-controls="faq-collapse-0"> How to reach v2.0.0 documentation? </button>
</div>
<!--/.card-header -->
<div id="faq-collapse-0" class="accordion-collapse collapse" aria-labelledby="faq-0">
<div class="card-body">
<p>You can reach the v2.0.0 documentation <a href="https://sandbox.elemisthemes.com/sandbox200/docs/index.html" class="external bg-primary text-white" target="_blank">here</a></p>
</div>
<!--/.card-body -->
</div>
<!--/.accordion-collapse -->
</div>
<!--/.accordion-item -->
<div class="card accordion-item">
<div class="card-header" id="faq-1">
<button class="collapsed" data-bs-toggle="collapse" data-bs-target="#faq-collapse-1" aria-expanded="true" aria-controls="faq-collapse-1"> Can I use this template without using Gulp or SCSS? </button>
</div>
<!--/.card-header -->
<div id="faq-collapse-1" class="accordion-collapse collapse" aria-labelledby="faq-1">
<div class="card-body">
<p>Yes. Gulp is optional. You can use plain HTML / CSS / JS to customize Sandbox. Files you need are located in <code class="folder">dev</code> folder.</p>
</div>
<!--/.card-body -->
</div>
<!--/.accordion-collapse -->
</div>
<!--/.accordion-item -->
<div class="card accordion-item">
<div class="card-header" id="faq-2">
<button class="collapsed" data-bs-toggle="collapse" data-bs-target="#faq-collapse-2" aria-expanded="true" aria-controls="faq-collapse-2"> How can I remove unwanted plugins?</button>
</div>
<!--/.card-header -->
<div id="faq-collapse-2" class="accordion-collapse collapse" aria-labelledby="faq-2">
<div class="card-body">
<p>All third-party plugin JS files are located in <code class="folder">src/assets/js/vendor</code> and their CSS files are in <code class="folder">src/assets/css/vendor</code>. Just remove unwanted vendor JS / CSS files from vendor folders and then remove unwanted functions from <code class="file">src/assets/js/theme.js</code> and recompile.</p>
<p>If you're <strong>not using</strong> Gulp, you can remove unwanted plugins manually from <code class="file">dev/assets/js/plugins.js</code>, <code class="file">dev/assets/js/theme.js</code> and their CSS from <code class="file">dev/assets/css/plugins.css</code>.</p>
</div>
<!--/.card-body -->
</div>
<!--/.accordion-collapse -->
</div>
<!--/.accordion-item -->
<div class="card accordion-item">
<div class="card-header" id="faq-6">
<button class="collapsed" data-bs-toggle="collapse" data-bs-target="#faq-collapse-6" aria-expanded="true" aria-controls="faq-collapse-6">How can I remove unwanted CSS?</button>
</div>
<!--/.card-header -->
<div id="faq-collapse-6" class="accordion-collapse collapse" aria-labelledby="faq-6">
<div class="card-body">
<p>Bootstrap SCSS imports are located in <code class="file">src/assets/scss/_bootstrap.scss</code> and theme SCSS imports are in <code class="file">src/assets/scss/theme/_theme.scss</code>. Remove or comment any unwanted import and recompile.</p>
<p>If you're <strong>not using</strong> Gulp, you can remove unwanted CSS manually from <code class="file">dev/assets/css/style.css</code></p>
</div>
<!--/.card-body -->
</div>
<!--/.accordion-collapse -->
</div>
<!--/.accordion-item -->
<div class="card accordion-item">
<div class="card-header" id="faq-3">
<button class="collapsed" data-bs-toggle="collapse" data-bs-target="#faq-collapse-3" aria-expanded="true" aria-controls="faq-collapse-3"> Does Sandbox support RTL? </button>
</div>
<!--/.card-header -->
<div id="faq-collapse-3" class="accordion-collapse collapse" aria-labelledby="faq-3">
<div class="card-body">
<p>No, not currently. Although with the use of <a href="https://rtlcss.com/learn/usage-guide/install/" target="_blank" class="external">RTLCSS</a> project you can generate RTL version of <code class="file">style.css</code>, however some template specific styles wont have support for RTL out of the box.</p>
</div>
<!--/.card-body -->
</div>
<!--/.accordion-collapse -->
</div>
<!--/.accordion-item -->
<div class="card accordion-item">
<div class="card-header" id="faq-4">
<button class="collapsed" data-bs-toggle="collapse" data-bs-target="#faq-collapse-4" aria-expanded="true" aria-controls="faq-collapse-4"> Why SVG icons appear black? </button>
</div>
<!--/.card-header -->
<div id="faq-collapse-4" class="accordion-collapse collapse" aria-labelledby="faq-4">
<div class="card-body">
<p>Due to the <a href="https://en.wikipedia.org/wiki/Same-origin_policy" target="_blank" class="external">same-origin policy</a> SVGInject does not work when run from the local file system in many browsers (Chrome, Safari). Please test on a working web server.</p>
</div>
<!--/.card-body -->
</div>
<!--/.accordion-collapse -->
</div>
<!--/.accordion-item -->
<div class="card accordion-item">
<div class="card-header" id="faq-5">
<button class="collapsed" data-bs-toggle="collapse" data-bs-target="#faq-collapse-5" aria-expanded="true" aria-controls="faq-collapse-5"> How to make the contact or newsletter forms work? </button>
</div>
<!--/.card-header -->
<div id="faq-collapse-5" class="accordion-collapse collapse" aria-labelledby="faq-5">
<div class="card-body">
<p>Follow the instructions <a href="../docs/forms.html" target="_blank" class="external">here</a> to reach the guide on configuring the contact or newsletter forms in Sandbox. If the forms don't work or if you receive any errors please keep in mind that the contact forms won't work on local environment. Please test them on a working web server.</p>
</div>
<!--/.card-body -->
</div>
<!--/.accordion-collapse -->
</div>
<!--/.accordion-item -->
<div class="card accordion-item">
<div class="card-header" id="faq-7">
<button class="collapsed" data-bs-toggle="collapse" data-bs-target="#faq-collapse-7" aria-expanded="true" aria-controls="faq-collapse-7"> Does Sandbox require jQuery? </button>
</div>
<!--/.card-header -->
<div id="faq-collapse-7" class="accordion-collapse collapse" aria-labelledby="faq-7">
<div class="card-body">
<p>No, as of v3.0.0, Sandbox no longer requires jQuery.</p>
</div>
<!--/.card-body -->
</div>
<!--/.accordion-collapse -->
</div>
<!--/.accordion-item -->
<div class="card accordion-item">
<div class="card-header" id="faq-8">
<button class="collapsed" data-bs-toggle="collapse" data-bs-target="#faq-collapse-8" aria-expanded="true" aria-controls="faq-collapse-8"> Why am I getting an error while installing to Wordpress? </button>
</div>
<!--/.card-header -->
<div id="faq-collapse-8" class="accordion-collapse collapse" aria-labelledby="faq-8">
<div class="card-body">
<p>Sandbox is an HTML template, not a Wordpress theme. So it cannot be installed in Wordpress.</p>
</div>
<!--/.card-body -->
</div>
<!--/.accordion-collapse -->
</div>
<!--/.accordion-item -->
<div class="card accordion-item">
<div class="card-header" id="faq-9">
<button class="collapsed" data-bs-toggle="collapse" data-bs-target="#faq-collapse-9" aria-expanded="true" aria-controls="faq-collapse-9"> Why the image mask doesn't work on my copy of the item? </button>
</div>
<!--/.card-header -->
<div id="faq-collapse-9" class="accordion-collapse collapse" aria-labelledby="faq-9">
<div class="card-body">
<p>There is a known browsers-spesific issue regarding image-mask that prevents them from working on local environments. (Running from a filesystem is now restricted, so you can no longer reference one file from another.) If you upload the template on a working server image masks should work properly.</p>
</div>
<!--/.card-body -->
</div>
<!--/.accordion-collapse -->
</div>
<!--/.accordion-item -->
<div class="card accordion-item">
<div class="card-header" id="faq-10">
<button class="collapsed" data-bs-toggle="collapse" data-bs-target="#faq-collapse-10" aria-expanded="true" aria-controls="faq-collapse-10"> How to disable sourcemaps? </button>
</div>
<!--/.card-header -->
<div id="faq-collapse-10" class="accordion-collapse collapse" aria-labelledby="faq-10">
<div class="card-body">
<p>You can disable sourcemaps in <code class="file">dist/asssets/css/style.css</code> by uncommenting lines <mark class="doc">148</mark> and <mark class="doc">158</mark> on <code class="file">gulpfile.js</code> and then running <kbd class="terminal bg-pale-primary">gulp serve</kbd> command.</p>
</div>
<!--/.card-body -->
</div>
<!--/.accordion-collapse -->
</div>
<!--/.accordion-item -->
<div class="card accordion-item">
<div class="card-header" id="faq-11">
<button class="collapsed" data-bs-toggle="collapse" data-bs-target="#faq-collapse-11" aria-expanded="true" aria-controls="faq-collapse-11"> How to add a link to dropdown parent? </button>
</div>
<!--/.card-header -->
<div id="faq-collapse-11" class="accordion-collapse collapse" aria-labelledby="faq-11">
<div class="card-body">
<p>Use the code below to add link to dropdown parent:</p>
</div>
<!--/.card-body -->
<div class="code-wrapper">
<div class="code-wrapper-inner">
<pre class="language-html bg-dark rounded-bottom"><code>&lt;li class=&quot;nav-item dropdown dropdown-mega parent-link&quot;&gt;
&lt;a class=&quot;nav-link&quot; href=&quot;PARENT LINK&quot;&gt;Dropdown&lt;/a&gt;
&lt;a class=&quot;nav-link dropdown-toggle&quot; href=&quot;#&quot; data-bs-toggle=&quot;dropdown&quot;&gt;&lt;span class=&quot;visually-hidden&quot;&gt;Toggle Dropdown&lt;/span&gt;&lt;/a&gt;
&lt;ul class=&quot;dropdown-menu mega-menu&quot;&gt;
...
&lt;/ul&gt;
&lt;/li&gt;</code></pre>
</div>
</div>
</div>
<!--/.accordion-collapse -->
</div>
<!--/.accordion-item -->
<div class="card accordion-item">
<div class="card-header" id="faq-12">
<button class="collapsed" data-bs-toggle="collapse" data-bs-target="#faq-collapse-12" aria-expanded="true" aria-controls="faq-collapse-12"> What font is used on the Sandbox logo? </button>
</div>
<!--/.card-header -->
<div id="faq-collapse-12" class="accordion-collapse collapse" aria-labelledby="faq-12">
<div class="card-body">
<p>The font used in the Sandbox logo is <a class="external my-0" href="https://fonts.google.com/specimen/Manrope" target="_blank">Manrope</a></p>
</div>
<!--/.card-body -->
</div>
<!--/.accordion-collapse -->
</div>
<!--/.accordion-item -->
</div>
<!--/.accordion -->
</section>
</div>
<!-- /column -->
</div>
<!-- /.row -->
</div>
<!-- /.container -->
</div>
<!-- /.content-wrapper -->
<section class="wrapper bg-dark text-white">
<div class="container pt-14 pt-md-16 text-center">
<div class="row">
<div class="col-md-10 col-lg-9 col-xl-8 col-xxl-7 mx-auto">
<h2 class="display-3 text-white mt-3 mb-3 px-lg-8">Think unique and be creative. Make a difference with Sandbox.</h2>
<p class="lead fs-lg mb-6">Everything you need to create your next unique and professional website, including impressive and ready-made blocks and pages.</p>
<a href="https://1.envato.market/NKGrx2" target="_blank" class="btn btn-lg btn-white rounded-pill mb-10">Buy Sandbox</a>
</div>
<!-- /column -->
</div>
<!-- /.row -->
<img class="img-fluid" src="../assets/img/demos/f1.png" srcset="../assets/img/demos/f1@2x.png 2x" alt="" />
</div>
<!-- /.container -->
</section>
<!-- /section -->
<div class="progress-wrap">
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
<path d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
</svg>
</div>
<script src="../assets/js/plugins.js"></script>
<script src="../assets/js/theme.js"></script>
</body>
</html>