Skip to content
Switch branches/tags
Go to file
Cannot retrieve contributors at this time
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-svg lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]><html class="no-svg lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]><html class="no-svg lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--><html lang="en"><!--<![endif]-->
<meta charset="utf-8">
<title>Page Title | Unit or Department at WSU</title>
<!-- The WSU logo as a favicon -->
<link rel="shortcut icon" href="" />
<!-- The primary WSU Spine stylesheet -->
<link href="" rel="stylesheet" type="text/css" />
<!-- Site specific stylesheets should be inserted after the Spine CSS above. -->
<meta name="viewport" content="width=device-width, user-scalable=yes">
<!-- Current library versions can be found at -->
<script src=""></script>
<script src=""></script>
<script src=""></script>
<!-- Site specific JavaScript should be inserted after jQuery and the Spine JS above, ideally at the end of the document. -->
<!-- Include an HTML5 compatibility shim for HTML5 -->
<!--[if lt IE 9]><script src=""></script><![endif]-->
<!-- Ensure the Spine is displayed fully when no-JS -->
#spine .spine-sitenav ul ul li {
display: block !important;
<a href="#wsu-main-content" class="screen-reader-shortcut">Skip to main content</a>
<a href="#spine-navigation" class="screen-reader-shortcut">Skip to navigation</a>
<div id="jacket">
<!-- Fluid layout is recommended and supported. "hybrid" and "fixed" are also possible here. -->
<div id="binder" class="fluid">
<!-- Primary site content should go within this main element. -->
<main id="wsu-main-content">
<!-- A variety of section layouts are available. -->
<section class="row side-right gutter pad-bottom tall">
<!-- Sections (rows) contain one or more columns. -->
<div class="column one">
<p><big>Integer vestibulum</big> quis lacus imperdiet imperdiet. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nulla sollicitudin mauris a augue mattis, in sollicitudin felis tincidunt. Nulla id leo et justo molestie egestas. Mauris ultrices metus nunc, vel tempor diam molestie id. Ut vitae porttitor massa. Ut posuere enim at turpis tristique varius. Praesent pellentesque augue nulla. In consequat dui quam. Duis pellentesque in orci cursus varius. Ut vehicula enim libero, sit amet porta dui suscipit in.</p>
<h3>Cras at bibendum elit.</h3>
<p>Sed facilisis feugiat nunc, quis aliquet nisl tristique vitae. Nam adipiscing mauris metus, eget commodo tortor placerat id. Etiam tincidunt eget nisi id elementum. Nam vel tincidunt nibh, vel lobortis sapien. Aliquam egestas augue nec libero porttitor tincidunt. Curabitur quis sapien a diam adipiscing gravida. Sed sed porta sem. Duis vel sapien nec metus sollicitudin rhoncus. Vestibulum ultrices vulputate mauris, ac ullamcorper magna porta quis. Interdum et malesuada fames ac ante ipsum primis in faucibus.</p>
<p>Etiam dignissim nec felis vel fringilla. Proin imperdiet aliquet ante, quis egestas felis tincidunt id. Duis vel adipiscing quam. Praesent iaculis sagittis mattis. Morbi ac bibendum nulla. Donec quis est augue. Vestibulum rutrum quam ac interdum elementum.</p>
<div class="column two">
<li>Fight, fight, fight for Washington State! Win the victory!</li>
<li>Win the day for Crimson and Gray! Best in the West, we know you'll all do your best, so</li>
<li>On, on, on, on! Fight to the end! Honor and Glory you must win! So</li>
<li>Fight, fight, fight for Washington State and victory!</li>
<li>W-A-S-H-I-N-G-T-O-N-S-T-A-T-E-C-O-U-G-S! <strong>GO COUGS!!</strong></li>
<small>The song appears in the 1985 film <i>Volunteers</i>, sung by John Candy's character Tommy Tuttle from Tacoma, Washington, and later used as a war cry by the Communists.</small>
</section><!-- End .row -->
</main><!-- End #wsu-main-content -->
The #spine contains the site navigation and branding
* Color: By default, the WSU Spine is white. Add the gray-darker class to use the darker Spine.
* Bleed: By default, the Spine is 198px wide. To have it bleed fully to the left, add the bleed class.
<div id="spine">
<div id="glue">
<header class="spine-header">
<a href="" id="wsu-signature">Washington State University</a>
<!-- Both #wsu-actions and .spine-actions are required here. -->
<section id="wsu-actions" class="spine-actions">
<!-- Both #wsu-actions-tabs and .spine-actions-tabs are required here. -->
<ul id="wsu-actions-tabs" class="spine-actions-tabs clearfix">
<li id="wsu-search-tab" class="spine-search-tab closed">
<li id="wsu-contact-tab" class="spine-contact-tab closed">
<li id="wsu-share-tab" class="spine-share-tab closed">
<li id="wsu-print-tab" class="spine-print-tab closed">
</section><!-- End #wsu-actions .spine-actions -->
<!-- Both #spine-navigation and .spine-navigation are required here. -->
<section id="spine-navigation" class="spine-navigation">
<!-- The main navigation for the site. -->
<nav class="spine-sitenav">
Site specific navigation should be output here.
* Active link should be denoted with an "active" or "current" link on the link's parent li element.
* First link should be a home link.
* Replace example navigation list below.
<li><a href="/">Site Home</a></li>
<li><a href="">Options</a>
<li><a href="">The WSU Web Template</a></li>
<li><a href="">Spine standards</a></li>
<li class="current"><a href="spine.html">The Spine framework</a></li>
<!-- Offsite navigation for the site. -->
<nav class="spine-offsitenav">
<li><a href="">Offsite Link</a></li>
<li><a href="">Another</a></li>
</section><!-- End #spine-navigation .spine-navigation -->
<!-- Social and required global WSU links. -->
<footer class="spine-footer">
<nav id="wsu-social-channels" class="spine-social-channels">
SOCIAL CHANNELS: You can replace default social channels with your own. Available channels are:
• Facebook, Twitter, Youtube, Google+ (.googleplus-channel), Tumblr, Pinterest, Flickr,
• Example: <li class="pinterest-channel"><a href="">Pinterest</a></li>
• Maximum number of channels is five -->
<li class="facebook-channel"><a href="">Facebook</a></li>
<li class="twitter-channel"><a href="">Twitter</a></li>
<li class="youtube-channel"><a href="">YouTube</a></li>
<li class="directory-channel"><a href="">Social media at WSU</a></li>
<nav id="wsu-global-links" class="spine-global-links">
<li class="mywsu-link"><a href="">myWSU</a></li>
<li class="access-link"><a href="">Access</a></li>
<li class="policies-link"><a href="">Policies</a></li>
<li class="copyright-link"><a href="">&copy;</a></li>
</footer><!-- End .spine-footer -->
</div><!-- End #glue -->
</div><!-- End #spine -->
</div><!-- End #binder -->
</div><!-- End #jacket -->
<!-- Adjust this sample contact information to reflect appropriate data for the site. -->
<div id="contact-details" itemscope itemtype="">
<span itemprop="department" content="University Unit"></span>
<span itemprop="name" content="Washington State University"></span>
<div itemprop="address" itemscope itemtype="">
<span itemprop="location" content="Your location"></span>
<span itemprop="streetAddress" content="Your PO Box"></span>
<span itemprop="addressLocality" content="Pullman"></span>
<span itemprop="addressRegion" content="WA"></span>
<span itemprop="postalCode" content="99164"></span>
<span itemprop="telephone" content="(509) 335-3564"></span>
<span itemprop="email" content=""></span>
<span itemprop="contactPoint" content=""></span>
<span itemprop="url" content=""></span>