Return to the home page Demo of UH Hilo 2019 (Simple) Design

Most content should be within an <section> or element with class="container" tag for enhanced readability, but content directly under the <article> will span the full width.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec non sem lorem. Curabitur orci sem, gravida et porta et, lobortis quis nulla. Ut scelerisque augue id ante aliquam interdum. Ut maximus nec ante nec pulvinar. Etiam maximus mauris vel tortor maximus cursus. Praesent nec orci non tortor congue volutpat vestibulum vitae ligula. Pellentesque dapibus ut arcu in vulputate. Aliquam facilisis sapien at lacus ultrices hendrerit. Pellentesque luctus velit eu ligula venenatis mollis. Suspendisse viverra enim id nibh molestie, vitae sollicitudin nibh congue.

Samples

Section 1

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Blanditiis alias, ducimus perspiciatis beatae repudiandae, id atque eveniet consectetur quia maxime voluptates mollitia voluptas. Saepe inventore voluptatibus, nemo nobis ad illum.

Section 2

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quas itaque, molestias nemo ipsam aut blanditiis, debitis earum consectetur excepturi odit maxime. Tempora assumenda officia illum sequi numquam quis dignissimos temporibus?

Grids

.two-by

.two-by

.three-by .info

.three-by .info

.three-by .info

.four-by .warning .padded

.four-by .warning .padded

.four-by .warning .padded

.four-by .warning .padded

.five-by .error

.five-by .error

.five-by .error

.five-by .error

.five-by .error

.six-by .success

.six-by .success

.six-by .success

.six-by .success

.six-by .success

.six-by .success

Code

<body>
<div id="page-wrapper" class="page-wrapper">
    <header>
        <h1>Heading</h1>
    </header>
    <main id="content">
        <p>Content</p>
    </main>
    <footer>
        <p>Footer</p>
    </footer>
</div>
</body>

Included Styling