/*
 *  damienmjones.com Responsive Style Sheet
 *  Copyright © 2002-2012 Damien M. Jones
 *  May 8, 2012
 */

/* not enough space for the outside-the-column frills */
@media screen and (max-width: 850px) {
	#header .logo { display: none; }
	#header #nav_tools { right: 0px; }
	#header #nav_panel { right: 0px; }
	#header #nav_search_details { right: 40px; }
}

/* not enough space for the full column */
@media screen and (max-width: 720px) {
	#header .title { padding: 0px 10px; }
	#header > .inside {
		width: 100%;
		min-width: 320px;
	}
	#nav_panel .history .blurb .title { padding: 0; }
	.article .header .backgroundblock .title,
	.article .header .metadata,
	.article .preface,
	.article .body {
		width: 100%;
		min-width: 320px;
	}
	.article .header .backgroundblock .title .inside,
	.article .header .metadata .inside,
	.article .preface .inside,
	.article .body .inside {
		padding: 0px 10px;
	}
	.article .header .backgroundblock .title { font-size: 48px; padding-top: 8px; }

	#footer {
		width: auto;
		padding: 0px 10px;
	}
}

/* not enough space for menu */
@media screen and (max-width: 582px) {
	#header {
		position: static;
		height: auto;
		background: transparent;
	}
	#header #nav_panel {
		position: static;
		width: 100%;
		left: 0px;
		top: 0px;
		background: transparent;
		border: none;
		border-top: 1px solid #ccc;
	}
	#nav_panel .contents .column,
	#nav_panel .history .column {
		float: none;
		width: auto;
		border: none;
	}
	#nav_panel .contents .column {
		border-bottom: 1px solid #ccc;
		padding-bottom: 10px;
	}
	#nav_panel .contents .column3 {
		border-bottom: none;
		padding-bottom: 0px;
	}
	#nav_panel .history {
		border-top: 1px solid #ccc;
		padding-top: 10px;
	}
	#nav_panel .history .column.empty {
		display: none;
	}
	#nav_panel .history .column .label.terse {
		display: inline-block;
	}
	#nav_panel .history .column .label.full {
		display: none;
	}
	#nav_panel .history .column .label {
		width: auto;
	}
	#nav_panel .history .column2 .label {
		text-align: left;
	}
	#nav_panel .history .blurb {
		width: auto;
		white-space: nowrap;
	}
	#nav_panel .history .blurb .title,
	#nav_panel .history .blurb .metadata {
		display: inline-block;
		height: 48px;
		vertical-align: top;
		font-size: inherit !important;
		line-height: 48px !important;
		font-weight: inherit !important;
	}
	#nav_panel .history .blurb .metadata {
		font-size: 15px !important;
	}
	.blurb .thumb {
		display: inline-block;
		float: none;
	}
}

/* really narrow displays */
@media screen and (max-width: 480px) {
	.article .header .backgroundblock .title { font-size: 32px; padding-top: 16px; }
}
