Docs: http://tachyons.io/docs/debug/

  Just add the debug class to any element to see outlines on its

  children.

*/

.debug * { outline: 1px solid gold; }

.debug-white * { outline: 1px solid white; }

.debug-black * { outline: 1px solid black; }

/*

   DEBUG GRID

   http://tachyons.io/docs/debug-grid/

   Can be useful for debugging layout issues

   or helping to make sure things line up perfectly.

   Just tack one of these classes onto a parent element.

*/

.debug-grid { background: transparent url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAAFElEQVR4AWPAC97/9x0eCsAEPgwAVLshdpENIxcAAAAASUVORK5CYII= ) repeat top left; }

.debug-grid-16 { background: transparent url( data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAMklEQVR4AWOgCLz/b0epAa6UGuBOqQHOQHLUgFEDnAbcBZ4UGwDOkiCnkIhdgNgNxAYAiYlD+8sEuo8AAAAASUVORK5CYII= ) repeat top left; }

.debug-grid-8-solid { background: white url( data:image/gif;base64,R0lGODdhCAAIAPEAAADw/wDx/////wAAACwAAAAACAAIAAACDZQvgaeb/lxbAIKA8y0AOw== ) repeat top left; }

.debug-grid-16-solid { background: white url( data:image/gif;base64,R0lGODdhEAAQAPEAAADw/wDx/xXy/////ywAAAAAEAAQAAACIZyPKckYDQFsb6ZqD85jZ2+BkwiRFKehhqQCQgDHcgwEBQA7 ) repeat top left; }

/* Uncomment out the line below to help debug layout issues */

@media screen and (min-width: 30em) {

 .aspect-ratio-ns { height: 0; position: relative; }

 .aspect-ratio--16x9-ns { padding-bottom: 56.25%; }

 .aspect-ratio--9x16-ns { padding-bottom: 177.77%; }

 .aspect-ratio--4x3-ns { padding-bottom: 75%; }

 .aspect-ratio--3x4-ns { padding-bottom: 133.33%; }

 .aspect-ratio--6x4-ns { padding-bottom: 66.6%; }

 .aspect-ratio--4x6-ns { padding-bottom: 150%; }

 .aspect-ratio--8x5-ns { padding-bottom: 62.5%; }

 .aspect-ratio--5x8-ns { padding-bottom: 160%; }

 .aspect-ratio--7x5-ns { padding-bottom: 71.42%; }

 .aspect-ratio--5x7-ns { padding-bottom: 140%; }

 .aspect-ratio--1x1-ns { padding-bottom: 100%; }

 .aspect-ratio--object-ns { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 100; }

 .cover-ns { background-size: cover !important; }

 .contain-ns { background-size: contain !important; }

 .bg-center-ns { background-repeat: no-repeat; background-position: center center; }

 .bg-top-ns { background-repeat: no-repeat; background-position: top center; }

 .bg-right-ns { background-repeat: no-repeat; background-position: center right; }

 .bg-bottom-ns { background-repeat: no-repeat; background-position: bottom center; }

 .bg-left-ns { background-repeat: no-repeat; background-position: center left; }

 .outline-ns { outline: 1px solid; }

 .outline-transparent-ns { outline: 1px solid transparent; }

 .outline-0-ns { outline: 0; }