There are no notes for this item.
<header class="header-site" id="header-site">
<div class="wrap">
<div class="header-site__flexContainer">
<a class="site-logo" title="Home" href="/">
<img src="../../img/logo.png" alt="Staffordshire University Logo" class="no-lazy-load">
</a>
<button class="toggle-megaNav" id="toggle-megaNav" aria-controls="megaNav"><span class="toggle-megaNav__label">Menu</span></button>
<button class="toggle-search-site" id="toggle-search-site" aria-controls="search-site"><span class="toggle-search-site__label">Search</span></button>
<nav class="megaNav" id="megaNav" role="navigation">
<div class="megaNav__controls">
<button class="megaNav__close" id="megaNav__close"><span class="visually-hidden">Close</span></button>
</div>
<div class="megaNav__topLevel">
<ul class="megaNav__topLevel-list">
<li class="megaNav__topLevel-item has-children">
<a class="megaNav__topLevel-link " href="">Courses</a>
<div class="megaNav__level megaNav__secondLevel">
<div class="megaNav__levelHeader">
<button class="megaNav__closeLevel">Courses</button>
</div>
<ul class="megaNav__levelList megaNav__secondLevel-list">
<li class="megaNav__secondLevel-item has-children">
<a class="megaNav__secondLevel-link " href="">Subject Areas</a>
<div class="megaNav__level megaNav__thirdLevel">
<div class="megaNav__levelHeader">
<button class="megaNav__closeLevel">Subject Areas</button>
</div>
<ul class="megaNav__levelList megaNav__thirdLevel-list">
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">Accounting and Finance</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">Allied Health and Paramedic Science</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">Animation</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">Art and Design</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">Augmented and Virtual Realities</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">Biological and Biomedical Sciences</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">Business and Marketing</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">Computer Science, AI and Robotics</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">Drama, Performance and Theatre Studies</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">Education</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">Engineering</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">...</a></li>
</ul>
<div class="megaNav__levelMobileFooter">
<button class="megaNav__closeLevel">Back</button>
</div>
</div>
</li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Undergraduate</a></li>
<li class="megaNav__secondLevel-item has-children">
<a class="megaNav__secondLevel-link " href="">Postgraduate</a>
<div class="megaNav__level megaNav__thirdLevel">
<div class="megaNav__levelHeader">
<button class="megaNav__closeLevel">Postgraduate</button>
</div>
<ul class="megaNav__levelList megaNav__thirdLevel-list">
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Accounting and Finance</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Allied Health and Paramedic Science</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Animation</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Art and Design</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Augmented and Virtual Realities</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Biological and Biomedical Sciences</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Business and Marketing</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Computer Science, AI and Robotics</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Drama, Performance and Theatre Studies</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Education</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Engineering</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG ...</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Accounting and Finance</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Allied Health and Paramedic Science</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Animation</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Art and Design</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Augmented and Virtual Realities</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Biological and Biomedical Sciences</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Business and Marketing</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Computer Science, AI and Robotics</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Drama, Performance and Theatre Studies</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Education</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG Engineering</a></li>
<li class="megaNav__thirdLevel-item"><a class="megaNav__thirdLevel-link" href="">PG ...</a></li>
</ul>
<div class="megaNav__levelMobileFooter">
<button class="megaNav__closeLevel">Back</button>
</div>
</div>
</li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Professional</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Distance Leaning</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Partnerships</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Apprenticeships</a></li>
</ul>
<div class="megaNav__levelFooter">
<p>Find a Course</p>
<form>
<input type="text" placeholder="Search on keyword / subject" />
<input type="submit" class="button" />
</form>
</div>
</div>
</li>
<li class="megaNav__topLevel-item has-children">
<a class="megaNav__topLevel-link " href="">Student life</a>
<div class="megaNav__level megaNav__secondLevel">
<div class="megaNav__levelHeader">
<button class="megaNav__closeLevel">Student Life</button>
</div>
<ul class="megaNav__levelList megaNav__secondLevel-list">
<li class="megaNav__secondLevel-item has-children">
<a class="megaNav__secondLevel-link " href="">Accommodation</a>
<div class="megaNav__level megaNav__thirdLevel">
<div class="megaNav__levelHeader">
<button class="megaNav__closeLevel">Accommodation</button>
</div>
<ul class="megaNav__levelList megaNav__thirdLevel-list">
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Stoke-on-Trent</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Stafford</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Shrewsbury</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Private accommodation</a></li>
</ul>
<ul class="megaNav__levelList megaNav__thirdLevel-list">
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">How to apply</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Guaranteed accommodation</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">International students</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Special requirements</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Frequently asked questions</a></li>
</ul>
</div>
</li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Campus and facilities</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Life in Staffordshire</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Getting involved</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Student support</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Life on campus</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Sport</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Chat to a Student</a></li>
</ul>
<div class="megaNav__levelFooter">
<p>What’s it like living here?</p>
<p><a href="" class="button">Book an open day</a></p>
</div>
</div>
</li>
<li class="megaNav__topLevel-item">
<a class="megaNav__topLevel-link" href="">International</a>
</li>
<li class="megaNav__topLevel-item has-children has-simple-children">
<a class="megaNav__topLevel-link " href="">Research</a>
<div class="megaNav__level megaNav__secondLevel">
<div class="megaNav__levelHeader">
<button class="megaNav__closeLevel">Research</button>
</div>
<ul class="megaNav__levelList megaNav__secondLevel-list">
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
</ul>
<div class="megaNav__levelFooter">
<p>What’s it like living here?</p>
<p><a href="" class="button">Book an open day</a></p>
</div>
</div>
</li>
<li class="megaNav__topLevel-item has-children">
<a class="megaNav__topLevel-link " href="">Business</a>
<div class="megaNav__level megaNav__secondLevel">
<div class="megaNav__levelHeader">
<button class="megaNav__closeLevel">Business</button>
</div>
<ul class="megaNav__levelList megaNav__secondLevel-list">
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
<li class="megaNav__secondLevel-item has-children">
<a class="megaNav__secondLevel-link " href="">Test Item</a>
<div class="megaNav__level megaNav__thirdLevel">
<div class="megaNav__levelHeader">
<button class="megaNav__closeLevel">Test Item</button>
</div>
<ul class="megaNav__levelList megaNav__thirdLevel-list">
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
</ul>
</div>
</li>
</ul>
<div class="megaNav__levelFooter">
<p>What’s it like living here?</p>
<p><a href="" class="button">Book an open day</a></p>
</div>
</div>
</li>
<li class="megaNav__topLevel-item has-children">
<a class="megaNav__topLevel-link " href="">About us</a>
<div class="megaNav__level megaNav__secondLevel">
<div class="megaNav__levelHeader">
<button class="megaNav__closeLevel">About us</button>
</div>
<ul class="megaNav__levelList megaNav__secondLevel-list">
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
<li class="megaNav__secondLevel-item has-children">
<a class="megaNav__secondLevel-link " href="">Test Item</a>
<div class="megaNav__level megaNav__thirdLevel">
<div class="megaNav__levelHeader">
<button class="megaNav__closeLevel">Test Item</button>
</div>
<ul class="megaNav__levelList megaNav__thirdLevel-list">
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
</ul>
<ul class="megaNav__levelList megaNav__thirdLevel-list">
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
</ul>
<div class="megaNav__levelMobileFooter">
<button class="megaNav__closeLevel">Back</button>
</div>
</div>
</li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
<li class="megaNav__secondLevel-item has-children">
<a class="megaNav__secondLevel-link " href="">Test Item</a>
<div class="megaNav__level megaNav__thirdLevel">
<div class="megaNav__levelHeader">
<button class="megaNav__closeLevel">Test Item</button>
</div>
<ul class="megaNav__levelList megaNav__thirdLevel-list">
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
<li class="megaNav__thirdLevel-item"><a href="" class="megaNav__thirdLevel-link">Test Item</a></li>
</ul>
</div>
</li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
<li class="megaNav__secondLevel-item"><a class="megaNav__secondLevel-link" href="">Test Item</a></li>
</ul>
<div class="megaNav__levelFooter">
<p>What’s it like living here?</p>
<p><a href="" class="button">Book an open day</a></p>
</div>
</div>
</li>
</ul>
</div>
</nav>
</div>
</div>
</header>
<div class="masthead">
<div class="masthead__inner">
<div class="masthead__bg">
<img src="../../img/masthead0.jpg" />
</div>
<div class="wrap">
<div class="title title--has-tail js-waypoint">
<h1 class="title__highlight h2">
Shortlisted for "University of the year"
</h1>
</div>
<div class="title title--bg-white title--has-tail js-waypoint">
<h6 class="title__highlight">
- The Times and The Sunday Times Good University Guide 2020
</h6>
</div>
<a href="" class="button">
Book an open day
</a>
</div>
</div>
</div>
<main id="main-content" role="main" class="">
<div class="slab slab--bg-slate">
<div class="wrap">
<div class="course-search">
<label class="visually-hidden" for="course-search__keywords">Search courses by keyword</label>
<input class="course-search__keywords" id="course-search__keywords" name="cQueryH" type="search" placeholder="Search courses by keyword">
<label class="visually-hidden" for="course-search__level">Filter</label>
<select id="course-search__level" name="cFilter">
<option value="">All levels of study</option>
<option value="undergraduate">Undergraduate</option>
<option value="postgraduate">Postgraduate</option>
</select>
<button class="button" id="course-search__submit" name="cSubmit" type="button">Search</button>
</div>
</div>
</div>
<div class="slab slab--bg-offwhite">
<div class="wrap">
<div class="title title--has-tail js-waypoint">
<h2 class="title__highlight">
Open days
</h2>
</div>
<div class="grid grid-4-cols">
<div>
<div class="box box--has-shadow">
<div class="box__content">
<div class="title">
<h3 class="h6 title__highlight"><a href="">Undergraduate Open day</a></h3>
</div>
<time class="strong">28 March 2020</time>
<p>Centre of Excellence Shrewsbury</p>
</div>
<footer class="box__footer">
<a href="" class="button button--block caps align-center">Book Now</a>
</footer>
</div>
</div>
<div>
<div class="box box--has-shadow">
<div class="box__content">
<div class="title">
<h3 class="h6 title__highlight"><a href="">Undergraduate Open day</a></h3>
</div>
<time class="strong">28 March 2020</time>
<p>Centre of Excellence Shrewsbury</p>
</div>
<footer class="box__footer">
<a href="" class="button button--block caps align-center">Book Now</a>
</footer>
</div>
</div>
<div>
<div class="box box--has-shadow">
<div class="box__content">
<div class="title">
<h3 class="h6 title__highlight"><a href="">Undergraduate Open day</a></h3>
</div>
<time class="strong">28 March 2020</time>
<p>Centre of Excellence Shrewsbury</p>
</div>
<footer class="box__footer">
<a href="" class="button button--block caps align-center">Book Now</a>
</footer>
</div>
</div>
<div>
<div class="box box--has-shadow">
<div class="box__content">
<div class="title">
<h3 class="h6 title__highlight"><a href="">Undergraduate Open day</a></h3>
</div>
<time class="strong">28 March 2020</time>
<p>Centre of Excellence Shrewsbury</p>
</div>
<footer class="box__footer">
<a href="" class="button button--block caps align-center">Book Now</a>
</footer>
</div>
</div>
</div>
</div>
</div>
<div class="slab slab--light">
<div class="wrap">
<div class="title title--has-tail js-waypoint">
<h2 class="title__highlight">
Features and highlights
</h2>
</div>
<div class="grid grid--flush grid-2-cols@mobile-wide grid-3-cols@tablet-wide feature-tiles">
<div class="feature-tiles__item js-waypoint">
<a class="tile" href="">
<figure class="tile__figure">
<img src="https://placeimg.com/500/500/people" class="tile__img" alt="" />
</figure>
<div class="tile__content">
<div class="title tile__title">
<h3 class="h4 title__highlight">Digital Institute London</h3>
</div>
<div class="tile__content-body">
<p>Study Esports, Computer Games Design, Cyber Security, and more, with us in London.</p>
</div>
</div>
</a>
</div>
<div class="feature-tiles__item feature-tiles__item--accent-pink js-waypoint">
<a class="tile" href="">
<figure class="tile__figure">
<img src="https://placeimg.com/500/500/tech" class="tile__img" alt="" />
</figure>
<div class="tile__content">
<div class="title tile__title">
<h3 class="h4 title__highlight">Developing knowledge</h3>
</div>
<div class="tile__content-body">
<p>Reach your full potential with our postgraduate courses.</p>
</div>
</div>
</a>
</div>
<div class="feature-tiles__item feature-tiles__item--accent-maroon js-waypoint">
<a class="tile" href="">
<figure class="tile__figure">
<img src="https://placeimg.com/500/500/architecture" class="tile__img" alt="" />
</figure>
<div class="tile__content">
<div class="title tile__title">
<h3 class="h4 title__highlight">Connecting Continents</h3>
</div>
<div class="tile__content-body">
<p>Study with us, no matter where in the world you come from.</p>
</div>
</div>
</a>
</div>
<div class="feature-tiles__item feature-tiles__item--accent-pink js-waypoint">
<a class="tile" href="">
<figure class="tile__figure">
<img src="https://placeimg.com/500/500/tech" class="tile__img" alt="" />
</figure>
<div class="tile__content">
<div class="title tile__title">
<h3 class="h4 title__highlight">Breaking boundaries</h3>
</div>
<div class="tile__content-body">
<p>Public lecture from Ade Adepitan MBE</p>
</div>
</div>
</a>
</div>
<div class="feature-tiles__item js-waypoint">
<a class="tile" href="">
<figure class="tile__figure">
<img src="https://placeimg.com/500/500" class="tile__img" alt="" />
</figure>
<div class="tile__content">
<div class="title tile__title">
<h3 class="h4 title__highlight">There’s still time to apply for 2020 entry</h3>
</div>
<div class="tile__content-body">
<p>Apply for a full-time undergraduate degree at Staffordshire University and get guaranteed accommodation.</p>
</div>
</div>
</a>
</div>
<div class="feature-tiles__item feature-tiles__item--accent-tef-gold js-waypoint">
<a class="tile" href="">
<figure class="tile__figure">
<img src="https://placeimg.com/500/500/nature" class="tile__img" alt="" />
</figure>
<div class="tile__content">
<div class="title title--bg-tef-gold tile__title">
<h3 class="h4 title__highlight">TEF Gold</h3>
</div>
<div class="tile__content-body">
<p>Staffordshire University achieves Gold in the Teaching Excellence and Student Outcomes Framework</p>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
<div class="slab slab--bg-offwhite">
<div class="wrap">
<div class="title title--has-tail js-waypoint">
<h2 class="title__highlight">
Be the change
</h2>
</div>
<div class="grid grid--spaced">
<div class="col-1/3">
<p class="intro">Choose Staffordshire University for its friendly vibe, its world-class facilities, specialist courses and dedicated international student support.</p>
</div>
<div class="col-2/3">
<a class="feature-link" href="">
<div class="feature-link__content">
<h3 class="h4 feature-link__title">Postgraduate</h3>
<p>Boost your knowledge and discover a world of new career opportunities with postgraduate study.</p>
</div>
</a>
<a class="feature-link" href="">
<div class="feature-link__content">
<h3 class="h4 feature-link__title">International</h3>
<p>We’ll support you every step of the way from visa and immigration advice to tips on the local area and its attractions.</p>
</div>
</a>
<a class="feature-link" href="">
<div class="feature-link__content">
<h3 class="h4 feature-link__title">Digital Institute London</h3>
<p>Study Esports, Computer Games Design, Cyber Security, and more, with us in London.</p>
</div>
</a>
</div>
</div>
</div>
</div>
<div class="slab ">
<div class="wrap">
<header class="section-header section-header--border-bottom">
<div class="title title--has-tail js-waypoint">
<h2 class="title__highlight">
Upcoming Events
</h2>
</div>
</header>
<div class="grid grid-3-cols@tablet-wide">
<div>
<div class="card card--event card--flex card--maroon">
<figure class="card__figure">
<img src="https://placeimg.com/720/360" alt="" />
</figure>
<div class="card__date">
<span class="card__day">28</span>
<span class="card__month">September</span>
</div>
<div class="card__content">
<div class="title">
<h2 class="h6 title__highlight"><a href="" class="">Enjoying the View? How computer games can help evaluate landscapes</a></h2>
</div>
<p>The founders of an immersive storytelling app have returned to their university stomping ground to film their latest episode.</p>
</div>
</div>
</div>
<div>
<div class="card card--event card--flex card--pink">
<figure class="card__figure">
<img src="https://placeimg.com/720/360" alt="" />
</figure>
<div class="card__date">
<span class="card__day">23</span>
<span class="card__month">September</span>
</div>
<div class="card__content">
<a href="" class="link--stretched">
<div class="title">
<h2 class="h6 title__highlight">Enjoying the View? How computer games can help evaluate landscapes</h2>
</div>
</a>
<p>Whole card linked using link--stretched. NB: This must sit outside/around the highlight title.</p>
</div>
</div>
</div>
<div>
<div class="card card--event card--flex card--red" href="">
<div class="card__date">
<span class="card__day">30</span>
<span class="card__month">September</span>
</div>
<div class="card__content">
<a href="" class="link--stretched">
<div class="title">
<h2 class="h6 title__highlight">Enjoying the View? How computer games can help evaluate landscapes</h2>
</div>
</a>
<p>Example without a figure image.</p>
</div>
</div>
</div>
</div>
<div class="text-right">
<a href="" class="button">View all events</a>
</div>
</div>
</div>
<div class="slab slab--bg-offwhite">
<div class="wrap">
<header class="section-header section-header--border-bottom">
<div class="title title--has-tail js-waypoint">
<h2 class="title__highlight">
Latest News
</h2>
</div>
</header>
<div class="grid grid-4-cols">
<div>
<div class="card card--course">
<figure class="card__figure">
<img src="https://placeimg.com/480/240/people" alt="" />
</figure>
<div class="card__content">
<h3 class="h6 card__title"><a href="#" class="link--stretched">Research into poverty in Stoke-on-Trent gets new funding boost</a></h3>
<p>University's pioneering work with community researchers will help inform new model of community research</p>
</div>
</div>
</div>
<div>
<div class="card card--course">
<figure class="card__figure">
<img src="https://placeimg.com/480/240/people" alt="" />
</figure>
<div class="card__content">
<h3 class="h6 card__title"><a href="#" class="link--stretched">Research into poverty in Stoke-on-Trent gets new funding boost</a></h3>
<p>University's pioneering work with community researchers will help inform new model of community research</p>
</div>
</div>
</div>
<div>
<div class="card card--course">
<figure class="card__figure">
<img src="https://placeimg.com/480/240/people" alt="" />
</figure>
<div class="card__content">
<h3 class="h6 card__title"><a href="#" class="link--stretched">Research into poverty in Stoke-on-Trent gets new funding boost</a></h3>
<p>University's pioneering work with community researchers will help inform new model of community research</p>
</div>
</div>
</div>
<div>
<div class="card card--course">
<figure class="card__figure">
<img src="https://placeimg.com/480/240/people" alt="" />
</figure>
<div class="card__content">
<h3 class="h6 card__title"><a href="#" class="link--stretched">Research into poverty in Stoke-on-Trent gets new funding boost</a></h3>
<p>University's pioneering work with community researchers will help inform new model of community research</p>
</div>
</div>
</div>
</div>
<div class="text-right">
<a href="" class="button">View all news</a>
</div>
</div>
</div>
<div class="quote-banner margin-top-3xs">
<div class="wrap">
<div class="quote-banner__flexContainer">
<div class="quote-banner__quoteContainer">
<div class="card card--testimonial card--maroon">
<div class="card__content">
<blockquote class="blockquote--large">
<q class="blockquote__title">Since coming to Staffordshire Uni I’ve become much more creative and confident in myself and my abilities</q>
<footer class="blockquote__footer">
<cite class="cite">Dan Sheerman</cite>
<p>Vice President of naming complicated variants of things</p>
</footer>
</blockquote>
</div>
</div>
</div>
<figure class="quote-banner__figure quote-banner__figure--align-bottom">
<img src="../../img/placeholder-transparent-person.png" alt="person smiling" />
</figure>
</div>
</div>
</div>
</main>
<div class="slab slab--bg-slate-light ">
<div class="wrap">
<div class="accolade-slider js-slider--accolades">
<div>
<div class="accolade-slider__item">
<div class="h6 accolade-slider__item-title">Rated Gold for Teaching Excellence</div>
<div class="accolade-slider__item-description">
<p>Teaching Excellence Framework</p>
</div>
<figure class="accolade-slider__item-figure">
<img class="accolade-slider__item-img" src="../../img/logo-tef-gold.png">
</figure>
</div>
</div>
<div>
<div class="accolade-slider__item">
<div class="h6 accolade-slider__item-title">Top 40 UK University</div>
<div class="accolade-slider__item-description">
<p>
37th out of 121 institutions University League Tables 2020</p>
</div>
<figure class="accolade-slider__item-figure">
<img class="accolade-slider__item-img" src="../../img/logo-guardian.png">
</figure>
</div>
</div>
<div>
<div class="accolade-slider__item">
<div class="h6 accolade-slider__item-title">University of the Year Shortlist</div>
<div class="accolade-slider__item-description">
<p>Teaching Excellence Framework</p>
</div>
<figure class="accolade-slider__item-figure">
<img class="accolade-slider__item-img" src="../../img/logo-times.png">
</figure>
</div>
</div>
<div>
<div class="accolade-slider__item">
<div class="h6 accolade-slider__item-title">Top 1000 in the World Rankings</div>
<div class="accolade-slider__item-description">
<p>
Times Higher Education Awards</p>
</div>
<figure class="accolade-slider__item-figure">
<img class="accolade-slider__item-img" src="../../img/logo-wur.png">
</figure>
</div>
</div>
<div>
<div class="accolade-slider__item">
<div class="h6 accolade-slider__item-title">Lorem Ipsum is simply dummy text of the printing and typesetting industry</div>
<div class="accolade-slider__item-description">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry</p>
</div>
<figure class="accolade-slider__item-figure">
<img class="accolade-slider__item-img" src="../../img/logo-wur.png">
</figure>
</div>
</div>
<div>
<div class="accolade-slider__item">
<div class="h6 accolade-slider__item-title">Lorem Ipsum is simply dummy text of the printing and typesetting industry</div>
<div class="accolade-slider__item-description">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry</p>
</div>
<figure class="accolade-slider__item-figure">
<img class="accolade-slider__item-img" src="../../img/logo-wur.png">
</figure>
</div>
</div>
<div>
<div class="accolade-slider__item">
<div class="h6 accolade-slider__item-title">Rated Gold for Teaching Excellence</div>
<div class="accolade-slider__item-description">
<p>Teaching Excellence Framework</p>
</div>
<figure class="accolade-slider__item-figure">
<img class="accolade-slider__item-img" src="../../img/logo-tef-gold.png">
</figure>
</div>
</div>
<div>
<div class="accolade-slider__item">
<div class="h6 accolade-slider__item-title">Top 40 UK University</div>
<div class="accolade-slider__item-description">
<p>
37th out of 121 institutions University League Tables 2020</p>
</div>
<figure class="accolade-slider__item-figure">
<img class="accolade-slider__item-img" src="../../img/logo-guardian.png">
</figure>
</div>
</div>
<div>
<div class="accolade-slider__item">
<div class="h6 accolade-slider__item-title">University of the Year Shortlist</div>
<div class="accolade-slider__item-description">
<p>Teaching Excellence Framework</p>
</div>
<figure class="accolade-slider__item-figure">
<img class="accolade-slider__item-img" src="../../img/logo-times.png">
</figure>
</div>
</div>
<div>
<div class="accolade-slider__item">
<div class="h6 accolade-slider__item-title">Top 1000 in the World Rankings</div>
<div class="accolade-slider__item-description">
<p>
Times Higher Education Awards</p>
</div>
<figure class="accolade-slider__item-figure">
<img class="accolade-slider__item-img" src="../../img/logo-wur.png">
</figure>
</div>
</div>
<div>
<div class="accolade-slider__item">
<div class="h6 accolade-slider__item-title">Lorem Ipsum is simply dummy text of the printing and typesetting industry</div>
<div class="accolade-slider__item-description">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry</p>
</div>
<figure class="accolade-slider__item-figure">
<img class="accolade-slider__item-img" src="../../img/logo-wur.png">
</figure>
</div>
</div>
<div>
<div class="accolade-slider__item">
<div class="h6 accolade-slider__item-title">Lorem Ipsum is simply dummy text of the printing and typesetting industry</div>
<div class="accolade-slider__item-description">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry</p>
</div>
<figure class="accolade-slider__item-figure">
<img class="accolade-slider__item-img" src="../../img/logo-wur.png">
</figure>
</div>
</div>
</div>
</div>
</div>
<footer class="footer-site">
<div class="wrap">
<a class="footer-site__logo" title="Home" href="/">
<img src="../../img/logo.png" alt="Staffordshire University Logo">
</a>
<div class="footer-site__main">
<div class="grid grid--spaced">
<div class="col-3/5 col-reverse">
<div class="grid grid--spaced grid-3-cols">
<div>
<h6>Study list</h6>
<ul class="list--unstyled list--links">
<li><a href="">Undergraduate</a></li>
<li><a href="">Postgraduate</a></li>
<li><a href="">Part-time</a></li>
<li><a href="">Professional</a></li>
<li><a href="">Distance learning</a></li>
<li><a href="">Two-year accelerated degrees</a></li>
<li><a href="">Partnerships</a></li>
</ul>
</div>
<div>
<h6>Information for</h6>
<ul class="list--unstyled list--links">
<li><a href="">Current students</a></li>
<li><a href="">Current staff</a></li>
<li><a href="">Schools and colleges</a></li>
<li><a href="">Alumni</a></li>
</ul>
</div>
<div>
<h6>Also see</h6>
<ul class="list--unstyled list--links">
<li><a href="">A-Z index</a></li>
<li><a href="">News</a></li>
<li><a href="">Events</a></li>
<li><a href="">Job vacancies</a></li>
<li><a href="">Legal</a></li>
<li><a href="">Accessibility</a></li>
<li><a href="">Modern slavery</a></li>
<li><a href="">Transparency return</a></li>
</ul>
</div>
</div>
<h6>Connect with us</h6>
<ul class="list--inline footer-site__social-list">
<li><a href=""><i class="icon"><img src="../../img/icon-facebook-white.svg" alt="Facebook" /></i></a></li>
<li><a href=""><i class="icon"><img src="../../img/icon-twitter-white.svg" alt="Twitter" /></i></a></li>
<li><a href=""><i class="icon"><img src="../../img/icon-youtube-white.svg" alt="YouTube" /></i></a></li>
<li><a href=""><i class="icon"><img src="../../img/icon-pinterest-white.svg" alt="Pinterest" /></i></a></li>
<li><a href=""><i class="icon"><img src="../../img/icon-linkedin-white.svg" alt="LinkedIn" /></i></a></li>
<li><a href=""><i class="icon"><img src="../../img/icon-instagram-white.svg" alt="Instagram" /></i></a></li>
<li><a href=""><i class="icon"><img src="../../img/icon-snapchat-white.svg" alt="Snapchat" /></i></a></li>
</ul>
</div>
<div class="col-2/5">
<h6><strong>Staffordshire University</strong></h6>
<p>
College Road<br />
University Quarter<br />
Stoke-on-Trent<br />
Staffordshire ST4 2DE<br />
</p>
<p>+44 (0)1782 294000</p>
<p><a href="">Contact us</a></p>
<p>© Staffordshire University 2020</p>
</div>
</div>
</div>
</div>
</footer>
{% include '@meganav' %}
<div class="masthead">
<div class="masthead__inner">
<div class="masthead__bg">
<img src="{{ ('/img/masthead0.jpg') | path }}"/>
</div>
<div class="wrap">
{% include '@title' with {
text: 'Shortlisted for "University of the year"',
modifiers: ['has-tail'],
textElement: 'h1',
textElementStyle: 'h2',
animate: true
} %}
{% include '@title' with {
text: '- The Times and The Sunday Times Good University Guide 2020',
modifiers: ['bg-white', 'has-tail'],
textElement: 'h6',
animate: true
} %}
{% include '@button' with {
text: 'Book an open day',
} %}
</div>
</div>
</div>
<main id="main-content" role="main" class="">
<div class="slab slab--bg-slate">
<div class="wrap">
<div class="course-search">
<label class="visually-hidden" for="course-search__keywords">Search courses by keyword</label>
<input class="course-search__keywords" id="course-search__keywords" name="cQueryH" type="search" placeholder="Search courses by keyword">
<label class="visually-hidden" for="course-search__level">Filter</label>
<select id="course-search__level" name="cFilter">
<option value="">All levels of study</option>
<option value="undergraduate">Undergraduate</option>
<option value="postgraduate">Postgraduate</option>
</select>
<button class="button" id="course-search__submit" name="cSubmit" type="button">Search</button>
</div>
</div>
</div>
<div class="slab slab--bg-offwhite">
<div class="wrap">
{% include '@title' with {
text: 'Open days',
textElement: 'h2',
tail: true,
animate: true
} %}
<div class="grid grid-4-cols">
{% for i in 1..4 %}
<div>
<div class="box box--has-shadow">
<div class="box__content">
<div class="title">
<h3 class="h6 title__highlight"><a href="">Undergraduate Open day</a></h3>
</div>
<time class="strong">28 March 2020</time>
<p>Centre of Excellence Shrewsbury</p>
</div>
<footer class="box__footer">
<a href="" class="button button--block caps align-center">Book Now</a>
</footer>
</div>
</div>
{% endfor %}
</div>
</div>
</div>
<div class="slab slab--light">
<div class="wrap">
{% include '@title' with {
text: 'Features and highlights',
textElement: 'h2',
tail: true,
animate: true
} %}
<div class="grid grid--flush grid-2-cols@mobile-wide grid-3-cols@tablet-wide feature-tiles">
<div class="feature-tiles__item js-waypoint">
<a class="tile" href="">
<figure class="tile__figure">
<img src="https://placeimg.com/500/500/people" class="tile__img" alt=""/>
</figure>
<div class="tile__content">
<div class="title tile__title">
<h3 class="h4 title__highlight">Digital Institute London</h3>
</div>
<div class="tile__content-body">
<p>Study Esports, Computer Games Design, Cyber Security, and more, with us in London.</p>
</div>
</div>
</a>
</div>
<div class="feature-tiles__item feature-tiles__item--accent-pink js-waypoint">
<a class="tile" href="">
<figure class="tile__figure">
<img src="https://placeimg.com/500/500/tech" class="tile__img" alt=""/>
</figure>
<div class="tile__content">
<div class="title tile__title">
<h3 class="h4 title__highlight">Developing knowledge</h3>
</div>
<div class="tile__content-body">
<p>Reach your full potential with our postgraduate courses.</p>
</div>
</div>
</a>
</div>
<div class="feature-tiles__item feature-tiles__item--accent-maroon js-waypoint">
<a class="tile" href="">
<figure class="tile__figure">
<img src="https://placeimg.com/500/500/architecture" class="tile__img" alt=""/>
</figure>
<div class="tile__content">
<div class="title tile__title">
<h3 class="h4 title__highlight">Connecting Continents</h3>
</div>
<div class="tile__content-body">
<p>Study with us, no matter where in the world you come from.</p>
</div>
</div>
</a>
</div>
<div class="feature-tiles__item feature-tiles__item--accent-pink js-waypoint">
<a class="tile" href="">
<figure class="tile__figure">
<img src="https://placeimg.com/500/500/tech" class="tile__img" alt=""/>
</figure>
<div class="tile__content">
<div class="title tile__title">
<h3 class="h4 title__highlight">Breaking boundaries</h3>
</div>
<div class="tile__content-body">
<p>Public lecture from Ade Adepitan MBE</p>
</div>
</div>
</a>
</div>
<div class="feature-tiles__item js-waypoint">
<a class="tile" href="">
<figure class="tile__figure">
<img src="https://placeimg.com/500/500" class="tile__img" alt=""/>
</figure>
<div class="tile__content">
<div class="title tile__title">
<h3 class="h4 title__highlight">There’s still time to apply for 2020 entry</h3>
</div>
<div class="tile__content-body">
<p>Apply for a full-time undergraduate degree at Staffordshire University and get guaranteed accommodation.</p>
</div>
</div>
</a>
</div>
<div class="feature-tiles__item feature-tiles__item--accent-tef-gold js-waypoint">
<a class="tile" href="">
<figure class="tile__figure">
<img src="https://placeimg.com/500/500/nature" class="tile__img" alt=""/>
</figure>
<div class="tile__content">
<div class="title title--bg-tef-gold tile__title">
<h3 class="h4 title__highlight">TEF Gold</h3>
</div>
<div class="tile__content-body">
<p>Staffordshire University achieves Gold in the Teaching Excellence and Student Outcomes Framework</p>
</div>
</div>
</a>
</div>
</div>
</div>
</div>
<div class="slab slab--bg-offwhite">
<div class="wrap">
{% include '@title' with {
text: 'Be the change',
textElement: 'h2',
tail: true,
animate: true
} %}
<div class="grid grid--spaced">
<div class="col-1/3">
<p class="intro">Choose Staffordshire University for its friendly vibe, its world-class facilities, specialist courses and dedicated international student support.</p>
</div>
<div class="col-2/3">
<a class="feature-link" href="">
<div class="feature-link__content">
<h3 class="h4 feature-link__title">Postgraduate</h3>
<p>Boost your knowledge and discover a world of new career opportunities with postgraduate study.</p>
</div>
</a>
<a class="feature-link" href="">
<div class="feature-link__content">
<h3 class="h4 feature-link__title">International</h3>
<p>We’ll support you every step of the way from visa and immigration advice to tips on the local area and its attractions.</p>
</div>
</a>
<a class="feature-link" href="">
<div class="feature-link__content">
<h3 class="h4 feature-link__title">Digital Institute London</h3>
<p>Study Esports, Computer Games Design, Cyber Security, and more, with us in London.</p>
</div>
</a>
</div>
</div>
</div>
</div>
<div class="slab ">
<div class="wrap">
<header class="section-header section-header--border-bottom">
{% include '@title' with {
text: 'Upcoming Events',
textElement: 'h2',
tail: true,
animate: true
} %}
</header>
{% include '@card--event' %}
<div class="text-right">
<a href="" class="button">View all events</a>
</div>
</div>
</div>
<div class="slab slab--bg-offwhite">
<div class="wrap">
<header class="section-header section-header--border-bottom">
{% include '@title' with {
text: 'Latest News',
textElement: 'h2',
tail: true,
animate: true
} %}
</header>
<div class="grid grid-4-cols">
{% for i in 1..4 %}
<div>
<div class="card card--course">
<figure class="card__figure">
<img src="https://placeimg.com/480/240/people" alt=""/>
</figure>
<div class="card__content">
<h3 class="h6 card__title"><a href="#" class="link--stretched">Research into poverty in Stoke-on-Trent gets new funding boost</a></h3>
<p>University's pioneering work with community researchers will help inform new model of community research</p>
</div>
</div>
</div>
{% endfor %}
</div>
<div class="text-right">
<a href="" class="button">View all news</a>
</div>
</div>
</div>
<div class="quote-banner margin-top-3xs">
<div class="wrap">
<div class="quote-banner__flexContainer">
<div class="quote-banner__quoteContainer">
<div class="card card--testimonial card--maroon">
<div class="card__content">
<blockquote class="blockquote--large">
<q class="blockquote__title">Since coming to Staffordshire Uni I’ve become much more creative and confident in myself and my abilities</q>
<footer class="blockquote__footer">
<cite class="cite">Dan Sheerman</cite>
<p>Vice President of naming complicated variants of things</p>
</footer>
</blockquote>
</div>
</div>
</div>
<figure class="quote-banner__figure quote-banner__figure--align-bottom">
<img src="{{ '/img/placeholder-transparent-person.png' | path }}" alt="person smiling"/>
</figure>
</div>
</div>
</div>
</main>
{% include '@slider--accolades' %}
{% include '@page-footer' %}