Buttons can be used by either <a class="button"> or <button>. Make a full size button by adding a .full class. Control the color of the button by adding .primary or .secondary classes (the color of the button is the primary color by default).


The layout uses Typegrid, that is similar to how and Skeleton works. The layout is already being used with the Pathway Website, so please refer to it for a working example.

<div class="desktop-12 columns">Contents go here.</div>


The layout is mobile-ready.

						@media screen and (min-width: 768px) and (max-width: 1159px) {
							/* Desktop (smaller than widescreen) */

						@media screen and (min-width: 1200px) {
							/* Widescreen */

						@media screen and (max-width: 767px) {
							/* Mobile viewports (phone landscape, portrait) */


Currently, Lato is used because it's free and lightweight.

font-family: 'Lato', sans-serif; 

You can also control the weight of the font by assigning a font-weight property.

						font-weight: 100; /* same as font-weight: thin; */
						font-weight: 300; /* same as font-weight: light; */
						font-weight: 400; /* same as font-weight: normal; */
						font-weight: 700; /* same as font-weight: bold; */
						font-weight: 900;