/* @override http://osl.slettenostvold.com/public/docs/css/dev.css */


/* GRID ======================================================================
 Hash Grid Options
 showGridKey: 'g', 
 holdGridKey: 'h', 
 foregroundKey: 'f', 
 jumpGridsKey: 'j', 
 numberOfGrids: 2

 ========================================================================== */

/* general */
#grid 						{ overflow: hidden!important; position: absolute; top: 0; left: calc(50% + 31px); }
/* Baselines. Remember CSS properties that define box model: visible height = height + borders + margins + padding */
#grid div.horiz 			{ border-bottom: 1px dotted darkgray; margin: 0; padding: 0; }
#grid.grid-1 div.horiz 		{ height: 11px; }
#grid.grid-2 div.horiz 		{ height: 23px; }
/* Grid offset top*/
#grid div.horiz:first-child { margin-top: 1px; }
/* Column background colour */
#grid div.vert 				{ margin-right: 23px/* gutter */; opacity: .25; background-color: lightgrey; border-color: blue; border: solid blue; border-width: 0 1px; }
/* Vertical grid lines width - needs outer gutter because of bug */
#grid div.vert.first-line 	{ margin-left: 23px; }


/* landscape tablet and small desktop */
@media only screen and (min-width: 952px) { 
	#grid.grid-1, #grid.grid-2 { width: 888px; margin-left: -444px; }
	#grid.grid-1 div.vert { width: 85px; }
	#grid.grid-2 div.vert { width: 193px; }
}
/* big desktop */
/*@media only screen and (min-width: 1280px) { 
	#grid.grid-1, #grid.grid-2 { width: 1080px; margin-left: -540px; }
	#grid.grid-1 div.vert { width: 109px; }
	#grid.grid-2 div.vert { width: 241px; }
}*/
/* super big desktop */
/*@media only screen and (min-width: 1366px) { 
	#grid.grid-1, #grid.grid-2 { width: 1272px; margin-left: -636px; }
	#grid.grid-1 div.vert { width: 133px; }
	#grid.grid-2 div.vert { width: 289px; }
}*/



/* DEV ======================================================================
 Breadcrumbs

 ========================================================================== */

.crumbs	a					{ display: inline-block; }
/*.crumbs a:after 			{ content: "\002F"/*http://css-tricks.com/css-content*!/; }
.crumbs a:last-child:after 	{ content: ""; }*/



/* VARIOUS DOCS ===================================================================
 Columns

 ========================================================================== */

.docs #columns * 			{ background: rgba(44,50,56,0.125); }


/* SITEMAP ===================================================================
 Tree

 ========================================================================== */
#tree						{ text-indent: -1px; margin-top: 6px; }

#tree ul					{ margin-left: 0px; position: relative; margin-bottom: 18px; }
#tree ul li 				{ padding-left: 21px/*width*/; position: relative; }

#tree ul:before				{ top: 3px; bottom: 0px; border-left: 2px solid #6B6F73; width: 0; }
#tree ul li:before			{ top: 15px; width: 13px; border-top: 2px solid #6B6F73; height: 0; }

#tree ul:before,
#tree ul li:before			{ position: absolute; left: 0; content: ""; display: block; }

#tree ul li:last-child:before{ background: #fff; bottom: 0; height: auto; }

/* 5 levels */
/*ul.l-1						{ }
ul.l-2						{ }
ul.l-3						{ }
ul.l-4						{ }
ul.l-5						{ }*/