Default page layout

    <div class="page">
        <div class="page-header">
            <div class="page-header-content">
            ...
            </div>
        </div>

        <div class="page-region">
            <div class="page-region-content">
                ...
            </div>
        </div>
    </div>

Secondary page layout

    <div class="page secondary">
        <div class="page-header">
            <div class="page-header-content">
            ...
            </div>
        </div>

        <div class="page-region">
            <div class="page-region-content">
                ...
            </div>
        </div>
    </div>

Fill View

    <div class="page fill">
        ...
    </div>

Snapped View

    <div class="page snapped">
        ...
    </div>

Fill & Snapped View

    <div class="page snapped">
        ...
    </div>
    <div class="page fill">
        ...
    </div>

Application Bar

    <div class="app-bar">
        ...
    </div>

Sharms

    <div class="charms">
        ...
    </div>

Flyouts

Message Dialogs

    <div class="message-dialog">
        ...
    </div>

Notification Dialogs

    <div class="error(info, warning)-bar">
        ...
    </div>