Digital Style Guide
Welcome to the digital style guide for your brand.
Image Blocks #
Two verticals
<div class="panel img-block vert"> <div class="inner"> <div class="columns"> <div class="column"> <div> <img src="/assets/qub/images/templates/01-homepage/study-at-queens.jpg" alt=""> </div> <h2 class="alt">Study at Queen's</h2> <h3>We have over 300 courses to choose from</h3> <p><a title="" href="#">Find out more</a></p> </div> <div class="column"> <div> <img src="/assets/qub/images/templates/01-homepage/career-ready-graduates.jpg" alt=""> </div> <h2 class="alt">Career Ready Graduates</h2> <h3>Employability is at the heart of the Queen's curriculum</h3> <p><a title="" href="#">Find out more</a></p> </div> </div> </div></div>
Three verticals
<div class="panel img-block vert"> <div class="inner"> <div class="columns"> <div class="column"> <div> <img src="/assets/qub/images/templates/01-homepage/entry-requirements.jpg" alt=""> </div> <h2 class="alt">Entry Requirements</h2> <h3>Important information for applicants</h3> <p><a title="" href="#">Find out more</a></p> </div> <div class="column"> <div> <img src="/assets/qub/images/templates/01-homepage/facilities.jpg" alt=""> </div> <h2 class="alt">Facilities</h2> <h3>Award-winning facilities</h3> <p><a title="" href="#">Find out more</a></p> </div> <div class="column"> <div> <img src="/assets/qub/images/templates/01-homepage/about-queens.jpg" alt=""> </div> <h2 class="alt">About Queen's</h2> <h3>Central to the world</h3> <p><a title="" href="#">Find out more</a></p> </div> </div> </div></div>
Four verticals
<div class="panel img-block vert"> <div class="inner"> <div class="columns"> <div class="column"> <div> <img src="/assets/qub/images/templates/01-homepage/student-1.jpg" alt=""> </div> <h2 class="alt">Student Stories</h2> <h3>Eshal Amara</h3> <h4>Pharmacy</h4> <p><a title="" href="#">See her story</a></p> </div> <div class="column"> <div> <img src="/assets/qub/images/templates/01-homepage/student-2.jpg" alt=""> </div> <h2 class="alt">Student Stories</h2> <h3>Adam Taylor</h3> <h4>Software Engineering</h4> <p><a title="" href="#">See his story</a></p> </div> <div class="column"> <div> <img src="/assets/qub/images/templates/01-homepage/student-3.jpg" alt=""> </div> <h2 class="alt">Student Stories</h2> <h3>Kelly Marno</h3> <h4>Biomedical Science</h4> <p><a title="" href="#">See her story</a></p> </div> <div class="column"> <div> <img src="/assets/qub/images/templates/01-homepage/student-4.jpg" alt=""> </div> <h2 class="alt">Student Stories</h2> <h3>Zhang Wei</h3> <h4>Aerospace Engineering</h4> <p><a title="" href="#">See his story</a></p> </div> </div> </div></div>
One horizontal

Northern Ireland - a unique location
Northern Ireland is renowned for its beautiful beaches and coastal scenery and has a fascinating history and cultural heritage that showcases stunning castles, monasteries and historic industry.
It is the perfect UK study destination for students who want to easily explore Ireland, the UK and mainland Europe.
<div class="panel img-block horz"> <div class="inner"> <div class="columns max-2"> <div class="column"> <div class="stretch-h"> <img src="/assets/qub/images/templates/06-content-page-images-set-aside/northern-ireland.jpg" alt=""> </div> </div> <div class="column"> <h2 class="alt">Northern Ireland - a unique location</h2> <p class="intro">Northern Ireland is renowned for its beautiful beaches and coastal scenery and has a fascinating history and cultural heritage that showcases stunning castles, monasteries and historic industry.</p> <p>It is the perfect UK study destination for students who want to easily explore Ireland, the UK and mainland Europe.</p> </div> </div> </div></div>
Two horizontals

Queen's campus: access all areas
Queen’s University’s historic, city-based campus is set in south Belfast, 15 minutes’ walk from the vibrant city centre. Travelling to and from Northern Ireland is easy and cheap.
Other major UK cities are within an hour’s flying time from Belfast’s two airports and are serviced by multiple daily flights.

The ultimate student city
Queen’s is at the heart of the city’s culture, arts and social scenes.
Whatever the time of year, Belfast is the ultimate student city, offering a huge selection of places to shop, socialise, eat and relax – all within walking distance of the cosmopolitan University campus. No matter how large or small your budget is, or what your interests are, you are sure to find something to see and do in Belfast.
<div class="panel img-block horz"> <div class="inner"> <div class="columns max-2"> <div class="column"> <div class="stretch-h"> <img src="/assets/qub/images/templates/06-content-page-images-set-aside/queens-campus.jpg" alt=""> </div> </div> <div class="column"> <h2 class="alt">Queen's campus: access all areas</h2> <p class="intro">Queen’s University’s historic, city-based campus is set in south Belfast, 15 minutes’ walk from the vibrant city centre. Travelling to and from Northern Ireland is easy and cheap.</p> <p>Other major UK cities are within an hour’s flying time from Belfast’s two airports and are serviced by multiple daily flights.</p> </div> <div class="column"> <div class="stretch-h"> <img src="/assets/qub/images/templates/06-content-page-images-set-aside/ultimate-student-city.jpg" alt=""> </div> </div> <div class="column"> <h2 class="alt">The ultimate student city</h2> <p class="intro">Queen’s is at the heart of the city’s culture, arts and social scenes.</p> <p>Whatever the time of year, Belfast is the ultimate student city, offering a huge selection of places to shop, socialise, eat and relax – all within walking distance of the cosmopolitan University campus. No matter how large or small your budget is, or what your interests are, you are sure to find something to see and do in Belfast.</p> </div> </div> </div></div>
One horizontal with colspan

Latest News
Film Studies student secures internship at Northern Ireland screen
29/06/2015
<div class="panel img-block horz"> <div class="inner"> <div class="columns max-2"> <div class="column colspan-8"> <div> <img src="/assets/qub/images/templates/02-school-homepage/latest-news-1.jpg" alt=""> </div> </div> <div class="column colspan-4"> <h2 class="alt">Latest News</h2> <h3>Film Studies student secures internship at Northern Ireland screen</h3> <p><small>29/06/2015</small></p> <p><a href="#" class="button">Read article</a></p> </div> </div> </div></div>
One horizontal with background

Latest news from the School of English
MA in Poetry: £10,000 scholarship available for international student
<div class="panel bg--red img-block horz"> <div class="inner"> <div class="columns max-2"> <div class="column"> <div class="stretch-h"> <img src="/assets/qub/images/templates/14d-undergraduate-page/school-of-english-news.jpg" alt=""> </div> </div> <div class="column"> <h2 class="alt">Latest news from the School of English</h2> <h3>MA in Poetry: £10,000 scholarship available for international student</h3> <p><a title="" href="#">Find out more</a></p> </div> </div> </div></div>