Rules for creating hats.

Markup

Layout

Wide hat

Broad hat

An unauthorized user

On the page with the login form button Input you can hide. If there are other pages available to an unauthorized user (Help, Support), then they have a button Input.

Hat - an Unauthorized user

Resize

When you resize the screen width can be shortened some elements and to shorten texts. Items must crawl on each other.

Compress text

Adaptive version

Adaptive layout