<html lang='en'>

<head>
    <meta charset='UTF-8' />
    <meta name='viewport' content='width=device-width' />
    <link rel='stylesheet' href='../../assets/css/styles.css' />
    <title>Preview Template</title>
</head>

<body class='add-padding'>

    <div id='uhasselt-page'>
        <div class="nav-desktop-wrapper">
            <nav class="nav-desktop uhasselt-container">
                <div class="nav-wrapper">
                    <div class="logo-wrapper">
                        <a class="logo" href="#"><img src="../../assets/img/logo_uhasselt.svg" alt=""></a>
                    </div>
                    <div class="type-utils-wrapper">
                        <ul class="type-nav">
                            <li>
                                <span class="icon far fa-user-graduate   " aria-hidden="true"></span>
                                <a href="#" class="link " aria-label="" title="">

                                    <span class="text">Voor studenten</span>

                                </a>

                            </li>
                            <li>
                                <span class="icon far fa-user-lock   " aria-hidden="true"></span>
                                <a href="#" class="link " aria-label="" title="">

                                    <span class="text">Voor medewerkers</span>

                                </a>

                            </li>
                        </ul>
                        <ul class="util-nav">
                            <li><a href="#" class="link " aria-label="" title="">

                                    <span class="text">Contact</span>

                                    <span class="icon far fa-external-link   " aria-hidden="true"></span>
                                </a>
                            </li>
                            <li><a href="#" class="link " aria-label="" title="">

                                    <span class="text">Wie is wie?</span>

                                    <span class="icon far fa-external-link   " aria-hidden="true"></span>
                                </a>
                            </li>
                            <li><a href="#" class="link " aria-label="" title="">

                                    <span class="text">Bibliotheek</span>

                                    <span class="icon far fa-external-link   " aria-hidden="true"></span>
                                </a>
                            </li>
                            <li><a href="#" class="link " aria-label="" title="">

                                    <span class="text">Vacatures</span>

                                </a>
                            </li>
                            <li><a href="#" class="link " aria-label="" title="">

                                    <span class="text">English</span>

                                </a>
                            </li>
                            <li>Gebruiker</li>
                        </ul>
                    </div>
                    <div class="main-wrapper">
                        <ul class="page-nav">
                            <li class="level-1">
                                <input type="checkbox" id="page-nav-checkbox0" class="page-nav-checkbox">
                                <label for="page-nav-checkbox0" class="page-nav-label">
                                    Info voor
                                    <span class="icon far fa-chevron-down  fa-xs " aria-hidden="true"></span>
                                </label>
                                <div class="page-nav-sub">
                                    <ul>
                                        <li class="level-2">
                                            <a href="#"><span class="icon fas fa-caret-right   " aria-hidden="true"></span>Toekomstige studenten</a>
                                        </li>
                                        <li class="level-2">
                                            <a href="#"><span class="icon fas fa-caret-right   " aria-hidden="true"></span>Studenten</a>
                                        </li>
                                        <li class="level-2">
                                            <a href="#"><span class="icon fas fa-caret-right   " aria-hidden="true"></span>Doctorandi</a>
                                        </li>
                                        <li class="level-2">
                                            <a href="#"><span class="icon fas fa-caret-right   " aria-hidden="true"></span>Alumni</a>
                                        </li>
                                    </ul>
                                </div>
                            </li>
                            <li class="level-1">
                                <a href="#">Studeren</a>
                            </li>
                            <li class="level-1">
                                <a href="#">Onderzoek</a>
                            </li>
                            <li class="level-1">
                                <a href="#">Over ons</a>
                            </li>
                        </ul>
                        <div class="search-field">
                            <span class="atm-form-input  ">
                                <input type="text" name="input" id="input" placeholder="Zoekterm..." class="form-input" value="">
                                <span class="icon far fa-times   form-input-error-icon" aria-hidden="true"></span>
                                <span class="icon far fa-check   form-input-valid-icon" aria-hidden="true"></span>
                            </span>

                            <a href="#" class="button button-black button-noframe">
                                <span>
                                    <span class="icon fal fa-search   " aria-hidden="true"></span>
                                </span>
                            </a>

                        </div>
                    </div>
                </div>
            </nav>
        </div>

        <div class="nav-desktop-mobile">
            <a class="mobile-logo" href="#"><img src="../../assets/img/logo_uhasselt.svg" alt=""></a>
            <a id="nav-toggle-search" href="#nav-mobile">
                <span class="icon far fa-search   " aria-hidden="true"></span>
            </a>
        </div>

        <section class='footer'>
            <div class='uhasselt-container'>
                <div class='footer-top'>
                    <div class='footer-column '>
                        <div class="link-list gray">
                            <div class="link-list-header ">
                                <h3 class="heading title">
                                    Lorem ipsum dolor sit amet
                                </h3>

                            </div>
                            <ul>
                                <li class="link-list-li">
                                    <a href="#" class="link " aria-label="" title="">
                                        <span class="icon fas fa-caret-right   " aria-hidden="true"></span>
                                        <span class="text">A USP for UHasselt</span>

                                    </a>

                                </li>

                                <li class="link-list-li">
                                    <a class="link " aria-label="" title="">
                                        <span class="icon fas fa-caret-right   " aria-hidden="true"></span>
                                        <span class="text">Another USP for UHasselt</span>

                                    </a>

                                </li>

                                <li class="link-list-li">
                                    <a class="link " aria-label="" title="">
                                        <span class="icon fas fa-caret-right   " aria-hidden="true"></span>
                                        <span class="text">And a third USP for UHasselt</span>

                                    </a>

                                </li>

                                <li class="link-list-li">
                                    <a class="link " aria-label="" title="">
                                        <span class="icon fas fa-caret-right   " aria-hidden="true"></span>
                                        <span class="text">And a third USP for UHasselt</span>

                                    </a>

                                </li>

                            </ul>

                            <div class="link-list-bottom-link ">
                                <a href="#" class="button button-black ">
                                    <span>
                                        <span class="icon fal fa-envelope   " aria-hidden="true"></span>
                                        <span class="text">
                                            This is a CTA Button
                                        </span>
                                    </span>
                                </a>

                            </div>
                        </div>
                    </div>

                    <div class='footer-column'>
                        <div class="link-list gray">
                            <div class="link-list-header ">
                                <h3 class="heading title">
                                    Lorem ipsum dolor sit amet
                                </h3>

                            </div>
                            <ul>
                                <li class="link-list-li">
                                    <a href="#" class="link " aria-label="" title="">
                                        <span class="icon fas fa-caret-right   " aria-hidden="true"></span>
                                        <span class="text">A USP for UHasselt</span>

                                    </a>

                                </li>

                                <li class="link-list-li">
                                    <a class="link " aria-label="" title="">
                                        <span class="icon fas fa-caret-right   " aria-hidden="true"></span>
                                        <span class="text">Another USP for UHasselt</span>

                                    </a>

                                </li>

                                <li class="link-list-li">
                                    <a class="link " aria-label="" title="">
                                        <span class="icon fas fa-caret-right   " aria-hidden="true"></span>
                                        <span class="text">And a third USP for UHasselt</span>

                                    </a>

                                </li>

                                <li class="link-list-li">
                                    <a class="link " aria-label="" title="">
                                        <span class="icon fas fa-caret-right   " aria-hidden="true"></span>
                                        <span class="text">And a third USP for UHasselt</span>

                                    </a>

                                </li>

                            </ul>

                            <div class="link-list-bottom-link ">
                                <a href="#" class="button button-black ">
                                    <span>
                                        <span class="icon fal fa-envelope   " aria-hidden="true"></span>
                                        <span class="text">
                                            This is a CTA Button
                                        </span>
                                    </span>
                                </a>

                            </div>
                        </div>
                    </div>

                    <div class='footer-column'>
                        <div class="link-list gray">
                            <div class="link-list-header ">
                                <h3 class="heading title">
                                    Lorem ipsum dolor sit amet
                                </h3>

                            </div>
                            <ul>
                                <li class="link-list-li">
                                    <a href="#" class="link " aria-label="" title="">
                                        <span class="icon fas fa-caret-right   " aria-hidden="true"></span>
                                        <span class="text">A USP for UHasselt</span>

                                    </a>

                                </li>

                                <li class="link-list-li">
                                    <a class="link " aria-label="" title="">
                                        <span class="icon fas fa-caret-right   " aria-hidden="true"></span>
                                        <span class="text">Another USP for UHasselt</span>

                                    </a>

                                </li>

                                <li class="link-list-li">
                                    <a class="link " aria-label="" title="">
                                        <span class="icon fas fa-caret-right   " aria-hidden="true"></span>
                                        <span class="text">And a third USP for UHasselt</span>

                                    </a>

                                </li>

                                <li class="link-list-li">
                                    <a class="link " aria-label="" title="">
                                        <span class="icon fas fa-caret-right   " aria-hidden="true"></span>
                                        <span class="text">And a third USP for UHasselt</span>

                                    </a>

                                </li>

                            </ul>

                            <div class="link-list-bottom-link ">
                                <a href="#" class="button button-black ">
                                    <span>
                                        <span class="icon fal fa-envelope   " aria-hidden="true"></span>
                                        <span class="text">
                                            This is a CTA Button
                                        </span>
                                    </span>
                                </a>

                            </div>
                        </div>
                    </div>

                    <div class='footer-column'>
                        <div class="link-list gray">
                            <div class="link-list-header ">
                                <h3 class="heading title">
                                    Lorem ipsum dolor sit amet
                                </h3>

                            </div>
                            <ul>
                                <li class="link-list-li">
                                    <a href="#" class="link " aria-label="" title="">
                                        <span class="icon fas fa-caret-right   " aria-hidden="true"></span>
                                        <span class="text">A USP for UHasselt</span>

                                    </a>

                                </li>

                                <li class="link-list-li">
                                    <a class="link " aria-label="" title="">
                                        <span class="icon fas fa-caret-right   " aria-hidden="true"></span>
                                        <span class="text">Another USP for UHasselt</span>

                                    </a>

                                </li>

                                <li class="link-list-li">
                                    <a class="link " aria-label="" title="">
                                        <span class="icon fas fa-caret-right   " aria-hidden="true"></span>
                                        <span class="text">And a third USP for UHasselt</span>

                                    </a>

                                </li>

                                <li class="link-list-li">
                                    <a class="link " aria-label="" title="">
                                        <span class="icon fas fa-caret-right   " aria-hidden="true"></span>
                                        <span class="text">And a third USP for UHasselt</span>

                                    </a>

                                </li>

                            </ul>

                            <div class="link-list-bottom-link ">
                                <a href="#" class="button button-black ">
                                    <span>
                                        <span class="icon fal fa-envelope   " aria-hidden="true"></span>
                                        <span class="text">
                                            This is a CTA Button
                                        </span>
                                    </span>
                                </a>

                            </div>
                        </div>

                        <h3 class="heading social-title">
                            Social media
                        </h3>

                        <ul class="social horizontal">
                            <li><a class="facebook" href="https://www.facebook.com" target="_blank" aria-label="facebook"><span class="icon fab fa-facebook  fa-lg " aria-hidden="true"></span></a></li>
                            <li><a class="instagram" href="https://www.instagram.com" target="_blank" aria-label="instagram"><span class="icon fab fa-instagram  fa-lg " aria-hidden="true"></span></a></li>
                            <li><a class="twitter" href="https://www.twitter.com" target="_blank" aria-label="twitter"><span class="icon fab fa-twitter  fa-lg " aria-hidden="true"></span></a></li>
                            <li><a class="youtube" href="https://www.youtube.com" target="_blank" aria-label="youtube"><span class="icon fab fa-youtube  fa-lg " aria-hidden="true"></span></a></li>
                            <li><a class="linkedin" href="https://www.linkedin.com" target="_blank" aria-label="linkedin"><span class="icon fab fa-linkedin  fa-lg " aria-hidden="true"></span></a></li>
                        </ul>
                    </div>
                </div>

                <div class='footer-bottom'>
                    <div class='footer-column first-col'>
                        <ul class='privacy' data-reset-text='Reset cookies'>
                            <li>© 2022 - Universiteit Hasselt</li>

                            <li><a class="link " aria-label="" title="">

                                    <span class="text">Gebruiksvoorwaarden &amp; Privacy</span>

                                </a>
                            </li>
                            <li><a class="link " aria-label="" title="">

                                    <span class="text">Toegankelijkheidsverklaring</span>

                                </a>
                            </li>
                        </ul>
                    </div>

                    <div class='footer-column second-col'>
                        <ul class='language'>
                            <li class='active'><a class="link " aria-label="" title="">

                                    <span class="text">Nederlands</span>

                                </a>
                            </li>
                            <li class=''><a class="link " aria-label="" title="">

                                    <span class="text">English</span>

                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </section>
    </div>

    <nav id='nav-mobile' class='mm-menu' data-title='uHasselt' data-searchurl='#' data-placeholder='Vul je zoekterm in...'>
        <ul>
            <li>
                <span>
                    <span class="icon fal fa-info-circle   fa-fw" aria-hidden="true"></span>Info voor
                </span>
                <ul>
                    <li>
                        <a href='#' title='Toekomstige studenten'>Toekomstige studenten</a>
                    </li>
                    <li>
                        <a href='#' title='Studenten'>Studenten</a>
                    </li>
                    <li>
                        <a href='#' title='Doctorandi'>Doctorandi</a>
                    </li>
                    <li>
                        <a href='#' title='Alumni'>Alumni</a>
                    </li>
                </ul>
            </li>
            <li>
                <a href='#' title='Studeren'>
                    <span class="icon fal fa-user-graduate   fa-fw" aria-hidden="true"></span>Studeren
                </a>
            </li>
            <li>
                <a href='#' title='Onderzoek'>
                    <span class="icon fal fa-vial   fa-fw" aria-hidden="true"></span>Onderzoek
                </a>
            </li>
            <li>
                <a href='#' title='Over ons'>
                    <span class="icon fal fa-info   fa-fw" aria-hidden="true"></span>Over ons
                </a>
            </li>
            <ul class='mobile-language'>
                <li>
                    <a href='' title=''>Nederlands</a>
                </li>
                <li>
                    <a href='' title=''>English</a>
                </li>
            </ul>
            <ul class='mobile-utils'>
                <li>
                    <a href='' title=''>Contact</a>
                </li>
                <li>
                    <a href='' title=''>Wie is wie</a>
                </li>
                <li>
                    <a href='' title=''>Bibliotheek</a>
                </li>
                <li>
                    <a href='' title=''>Vacatures</a>
                </li>
            </ul>
            <ul class='mobile-social'>
                <li><a>Volg ons</a></li>
            </ul>
            <ul class='mobile-social'>
                <li>
                    <a href='' aria-label='' target='_blank' rel='noopener noreferrer'><span class="icon far fa-external-link   " aria-hidden="true"></span></a>
                </li>
            </ul>
        </ul>
    </nav>

    <nav id='nav-mobile-sticky'>
        <div class='nav-mobile-sticky-inner'>

            <a href='#' title='Home'>
                <span class="icon fal fa-home   " aria-hidden="true"></span><span class='text'>Home</span>
            </a>
            <a href='#' title='Student'>
                <span class="icon fal fa-user-graduate   " aria-hidden="true"></span><span class='text'>Student</span>
            </a>
            <a href='#' title='Medewerker'>
                <span class="icon fal fa-user-lock   " aria-hidden="true"></span><span class='text'>Medewerker</span>
            </a>
            <a href='#' title='Info voor'>
                <span class="icon fal fa-info-circle   " aria-hidden="true"></span><span class='text'>Info voor</span>
            </a>

            <a id='nav-mobile-toggle' href='#nav-mobile'>
                <span class="icon far fa-bars   " aria-hidden="true"></span><span class='text'>Menu</span>
            </a>

        </div>
    </nav>

    <div class="back-to-top">
        <a href="">
            <span class="icon far fa-arrow-to-top   " aria-hidden="true"></span>
        </a>
    </div>

    <script src='../../assets/js/scripts.js'></script>

</body>

</html>
<html lang='en'>
    <head>
        <meta charset='UTF-8' />
        <meta name='viewport' content='width=device-width' />
        <link rel='stylesheet' href='{{path '/assets/css/styles.css'}}' />
        <title>Preview Template</title>
    </head>
    <body class='add-padding'>

        <div id='uhasselt-page'>
            {{render '@nav-desktop'}}
            {{{yield}}}
            {{render '@footer'}}
        </div>

        {{render '@nav-mobile'}}

        {{render '@back-to-top'}}

        <script src='{{path '/assets/js/scripts.js'}}'></script>

    </body>
</html>
/* No context defined. */

No notes defined.