div#page-content
{
	display:					table;
	margin-bottom:				12px;
	width:						100%;
}

div#main-browse-nav,
div#main-browse-body
{
	vertical-align:				top;
}

div#main-browse-nav
{
	display:					table-cell;
	max-width:					306px;
	padding:					0 6px 0 0;
	width:						306px;
}

div.browse-document-area
{
	padding-top:				12px;
}

div.browse-document-link-container
{
	display:					table;
}

div.browse-document-entry
{
	display:					table-row;
}

div.browse-document-thumbnail,
div.browse-document-link
{
	display:					table-cell;
	padding:					4px 6px;
	vertical-align:				top;
}

img.browse-document-thumbnail
{
	width:						24px;
}

img.document-locked
{
	padding-left:				8px;
	text-align:					center;
	vertical-align:				middle;
	/* The following width includes the specified 'padding-left': */
	width:						20px;
}

div#main-browse-nav div.form-group select
{
	width:						300px;
}

div#main-browse-body
{
	display:					table-cell;
	padding:					0 0 0 8px;
}

div.main-browse-nav-toggle-hideable
{
	display:					none;
	padding:					5px 0 10px 0;
}

div.browse-current-filter-area
{
	padding-bottom:				5px;
}

div.browse-current-filter-area a
{
	border-bottom:				0;
	color:						inherit;
}

div.browse-current-filter
{
	border:						1px solid #365473;
	display:					table;
	margin-bottom:				10px;
	width:						100%;
}

div.browse-current-filter-area a:focus div.browse-current-filter,
div.browse-current-filter:hover
{
	background-color:			#edf3f7;
}

div.browse-current-filter div
{
	display:					table-cell;
	padding:					5px 10px;
	vertical-align:				middle;
}

div.browse-current-filter div:first-child
{
	padding-right:				0;
}

div.browse-current-filter div.fill-width
{
	width:						100%;
}

div.checkbox-group-heading
{
	background-color:			#c9d9e5;
	border-top:					1px solid #365473;
	cursor:						pointer;
	display:					table;
	padding:					6px;
	text-align:					left;
	width:						100%;

	/* No double-click text selection: */
	-webkit-user-select:		none; /* Webkit (Safari, Chrome) browsers. */
	-moz-user-select:			none; /* Mozilla browsers. */
	-khtml-user-select:			none; /* Webkit (Konqueror) browsers. */
	-ms-user-select:			none; /* IE10+. */
}

div.checkbox-group-heading-label,
div.checkbox-group-heading-icon
{
	display:					table-cell;
}

div.checkbox-group-heading-icon
{
	max-width:					22px;
	padding:					0 5px;
	width:						22px;
}

img.checkbox-group-heading-icon
{
	width:						12px;
}

img.checkbox-group-heading-icon-hidden
{
	display:					none;
}

div.category-checkbox-group
{
	margin-bottom:				10px;
	max-height:					300px;
	overflow-y:					auto;
	padding:					5px 0 0 5px;
	text-align:					left;
}

div.category-checkbox-group-closed
{
	display:					none;
}

div.category-checkbox
{
	display:					table-row;
}

div.category-checkbox input,
div.category-checkbox label
{
	display:					table-cell;
	padding-bottom:				5px;
	vertical-align:				middle;
}

div.category-checkbox label
{
	padding-left:				5px;

	/* No double-click text selection: */
	-webkit-user-select:		none; /* Webkit (Safari, Chrome) browsers. */
	-moz-user-select:			none; /* Mozilla browsers. */
	-khtml-user-select:			none; /* Webkit (Konqueror) browsers. */
	-ms-user-select:			none; /* IE10+. */
}

div.category-checkbox input[type="checkbox"]:disabled+label
{
	color:						#aaa;
}

a.browse-thumbnail-cell
{
	border-bottom:				none;
}

div.browse-thumbnail-cell
{
	border:						2px solid #eee;
	display:					inline-block;
	margin:						0 0 12px 10px;
	max-width:					218px;
	min-width:					218px;
	/* Left/right padding provided by img element; see below. */
	padding:					10px 0;
	text-align:					center;
	vertical-align:				top;
}

div.browse-thumbnail-cell div.browse-thumbnail-button
{
	padding-top:				10px;
}

/* With a 4:3 aspect ratio, min-height (minus padding) is 0.75 of the width
 * (again minus padding), e.g., (149px - 5px) = (212px - 20px) * 0.75. */
img.browse-thumbnail
{
	/* The actual image height is the following minus the top/bottom
	 * padding. */
	height:						149px;
	/* Left/right padding on image rather than cell to allow caption to be
	 * wider than the image. */
	padding:					0 10px 5px 10px;
	/* The actual image width is the following minus the left/right padding. */
	width:						212px;
}

div.browse-thumbnail-caption
{
	color:						#333;
	font-size:					13px;
}

div.browse-thumbnail-desc
{
	color:						#666;
	height:						122px;
	padding:					10px 10px 0 10px;
}

.part-number
{
	font-family:				consolas, "Lucida Console", Monaco, monospace;
}

/* Styles for width 960px to 1278px. --------------------------------------- */

@media only screen
	and (max-width: 1278px)
{

div#main-browse-nav
{
	max-width:					230px;
	padding:					0 8px 0 0;
	width:						230px;
}

div#main-browse-nav div.form-group select
{
	width:						222px;
}

div.browse-thumbnail-cell
{
}

img.browse-thumbnail
{
}

}

/* Styles for width 720px to 959px (two-column layout). -------------------- */

@media only screen
	and (max-width: 959px)
{

div.browse-thumbnail-cell
{
	max-width:					215px;
	min-width:					215px;
}

img.browse-thumbnail
{
	/* The actual image height is the following minus the top/bottom
	 * padding. */
	height:						146px;
	/* The actual image width is the following minus the left/right padding. */
	width:						208px;
}

}

/* Styles for width 620px to 719px. ---------------------------------------- */

@media only screen
	and (max-width: 719px)
{

div#page-content
{
	padding:					6px;
}

div#main-browse-nav
{
	max-width:					228px;
	padding:					0 6px 0 0;
	width:						228px;
}

div#main-browse-body
{
	padding:					0 0 0 6px;
}

div.browse-thumbnail-cell
{
	max-width:					164px;
	min-width:					164px;
}

img.browse-thumbnail
{
	/* The actual image height is the following minus the top/bottom
	 * padding. */
	height:						110px;
	/* The actual image width is the following minus the left/right padding. */
	width:						160px;
}

}

/* Styles for width < 620px. ----------------------------------------------- */

@media only screen
	and (max-width: 619px)
{

div#page-content
{
	display:					block;
	padding:					5px;
}

div#main-browse-nav
{
	display:					block;
	margin:						0 auto;
	max-width:					300px;
	padding:					0 0 10px 0;
	text-align:					center;
	width:						300px;
}

div#main-browse-nav div.form-group select
{
	width:						300px;
}

div.main-browse-nav-toggle-hideable
{
	display:					block;
}

div.main-browse-nav-hideable-container > div.hideable
{
	display:					none;
}

div#main-browse-body
{
	display:					block;
	padding:					0;
}

div#main-browse-body h1
{
	text-align:					center;
}

div.browse-thumbnail-cell
{
	max-width:					285px;
	min-width:					285px;
}

img.browse-thumbnail
{
	/* The actual image height is the following minus the top/bottom
	 * padding. */
	height:						152px;
	/* The actual image width is the following minus the left/right padding. */
	width:						216px;
}

}