/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* memorial */

/* banner at top of main memorial page */

#page_section_banners banner.victim_grid div.ds
{
	margin-top: 1rem;
	display: grid;
	grid-template-columns: repeat(9, 1fr);
	grid-column-gap: 1px;
	grid-row-gap: 1px;
}

#page_section_banners banner.victim_grid div.ds a.image
{
	display: block;
	position: relative;
	line-height: 50%;
}

#page_section_banners banner.victim_grid div.ds a.image img
{
	width: 100%;
	height: auto;
}

#page_section_banners banner.victim_grid div.ds a.image div.name
{
	width: 100%;
	line-height: 100%;
	position: absolute;
	bottom: 0;
	color: white;
	padding: .3rem .4rem;
	font-size: 85%;
	background-color: rgba(0, 0, 0, .5);
	font-weight: bold;
}

#page_section_banners banner.victim_grid div.ds div.victim-count
{
	grid-column-start: span 3;
	background-color: #e6e6d6;
	display: flex;
	align-items: center;
	justify-content: center;
}

#page_section_banners banner.victim_grid div.ds div.victim-count > div
{
	flex: 0;
	padding: 1.5rem 0;
	text-align: center;
}

#page_section_banners banner.victim_grid div.ds div.victim-count div.number
{
	color: #900;
	font-size: 350%;
	font-weight: 700;
	letter-spacing: -0.05em;
	font-family: 'Roboto Condensed', sans-serif;
}

#page_section_banners banner.victim_grid div.ds div.victim-count div.info
{
	white-space: nowrap;
}

#page_section_banners banner.victim_grid div.ds div.tagline
{
	grid-column-start: span 9;
	text-align: center;
	font-weight: bold;
	font-size: 105%;
	background-color: #173f57;
	color: white;
	padding: 1.5rem;
}

@media (max-width: 599px)
{
	#page_section_banners banner.victim_grid div.ds
	{
		grid-template-columns: repeat(3, 1fr);
	}

	#page_section_banners banner.victim_grid div.ds a.image:nth-child(n+4)
	{
		display: none;
	}

	#page_section_banners banner.victim_grid div.ds a.image div.name
	{
		font-size: 100%;
	}

	#page_section_banners banner.victim_grid div.ds div.tagline
	{
		grid-column-start: span 3;
	}
}

@media (min-width: 600px) and (max-width: 1029px)
{
	#page_section_banners banner.victim_grid div.ds
	{
		grid-template-columns: repeat(6, 1fr);
	}

	#page_section_banners banner.victim_grid div.ds a.image:nth-child(n+10)
	{
		display: none;
	}

	#page_section_banners banner.victim_grid div.ds a.image div.name
	{
		font-size: 100%;
	}

	#page_section_banners banner.victim_grid div.ds div.tagline
	{
		grid-column-start: span 6;
	}
}

/* main memorial page content */

#page_memorial #page_section_content div.matters
{
	width: 12rem;
	padding: 1rem;
	border: solid 1px #d0d0bc;
	background-color: #eae8db;
	float: right;
	margin: 0.3rem 0 1rem 2rem;
}

#page_memorial #page_section_content div.matters div.links
{
	margin-top: 1rem;
	font-size: 150%;
	font-weight: bold;
}

#page_memorial #page_section_content div.matters div.links a
{
	color: #2f0000;
}

#page_memorial div.memorial-home-highlight
{
	border: solid 1px #d0d0bc;
	background-color: #eae8db;
	padding: 1.5rem;
	margin-top: 0.8em;
	min-height: 135px;
	clear: both;
	overflow: hidden;
}

#page_memorial div.memorial-home-highlight h2
{
	color: #2f0000;
}

#page_memorial div.memorial-home-highlight div.photo
{
	background-color: white;
	line-height: 0;
	float: right;
	margin: 0 0 0.5rem 0.5rem;
}

#page_memorial div.memorial-home-highlight:nth-child(odd) div.photo
{
	background-color: white;
	line-height: 0;
	float: left;
	margin: 0 1rem 0.5rem 0;
}

#page_memorial div.memorial-home-highlight .widget_button
{
	margin-top: 0.5rem;
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* one person's story (memorial) */

#page_memorial-story div.story
{
	color: #808080;
	font-size: 100%;
	font-weight: bold;
	letter-spacing: -0.03em;
	border-bottom: solid 1px #aaa;
	padding-bottom: 0.1rem;
	margin-bottom: 0.6rem;
}

header#memorial_banner div.box
{
	background: #21506c url(/i/story-banner-background.jpg);
	padding-top: 2rem;
	padding-left: 3rem;
	padding-bottom: 2rem;
	padding-right: 0;
	color: white;
	overflow: hidden;
}

header#memorial_banner img
{
	float: left;
	margin-right: 2rem;
	border: solid 2px white;
}

header#memorial_banner div.text_box
{
	width: 310px;
	float: left;
	margin-right: 2rem;
}

header#memorial_banner h3
{
	text-transform: uppercase;
	border-bottom: solid 1px #3c6d8b;
	padding-bottom: 0.7rem;
	margin-bottom: 1rem;
	font-size: 120%;
}

header#memorial_banner div.details
{
	color: white;
}

header#memorial_banner div.details > div
{
	margin: 0.3rem 0;
	line-height: 110%;
}

header#memorial_banner em
{
	color: white;
	text-transform: uppercase;
	font-weight: bold;
	font-style: normal;
	padding-right: 5px;
	opacity: 0.7;
}

/* prevent overly long URLs from warping the page */
#page_memorial-story .remarks .text
{
	word-break: break-word;
}

#memorial-story-magic-sidebar .section
{
	border-top: solid 1px #ccc;
	margin-top: 8px;
	padding-top: 8px;
}

#memorial-story-magic-sidebar .section a.header
{
	display: block;
	text-indent: -18px;
	margin-left: 18px;
	line-height: 120%;
	margin-bottom: 8px;
}

#memorial-story-magic-sidebar .section a.header.closed:before
{
	content: url(/i/icon-reveal.png);
	padding-right: 6px;
}

#memorial-story-magic-sidebar .section a.header.open:before
{
	content: url(/i/icon-hide.png);
	padding-right: 6px;
}

#memorial-story-magic-sidebar .section .content
{
	display: none;
	padding-left: 18px;
}

@media (max-width: 1029px)
{
	header#memorial_banner div.box
	{
		padding: 1rem 1rem 0 1rem;
	}

	header#memorial_banner img
	{
		float: right;
		margin: 0 0 0.5rem 2rem;
		border: solid 2px white;
	}

	header#memorial_banner h3
	{
		font-size: 100%;
		font-weight: normal;
	}

	header#memorial_banner div.text_box
	{
		width: 100%;
		float: none;
		margin-bottom: 1rem;
	}

	header#memorial_banner em
	{
		text-transform: none;
		font-size: 95%;
	}
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* memorial search */

#page_memorial-search a#searchtips-reveal:before
{
	content: '☞ ';
}

form#memorial-search
{
	margin-bottom: 1rem;
}

form#memorial-search .fields
{
	display: flex;
	flex-flow: row wrap;
	margin-right: -0.5rem;
	margin-bottom: 1rem;
}

form#memorial-search .fields .df
{
	padding-top: 1rem;
	margin-right: 0.5rem;
}

form#memorial-search .fields .label,
form#memorial-search .fields .before span,
form#memorial-search .fields .after span
{
	font-size: 80%;
	font-weight: bold;
}

form#memorial-search .fields .before span,
form#memorial-search .fields .after span
{
	display: inline-block;
	width: 3rem;
	text-align: right;
}

form#memorial-search .fields .df_viol_startdate
{
	flex-grow: 4;
	flex-basis: 0;
}

form#memorial-search .fields .df_fnames,
form#memorial-search .fields .df_sname,
form#memorial-search .fields .df_viol_id,
form#memorial-search .fields .df_viol_loca_id,
form#memorial-search .fields .df_charges,
form#memorial-search .fields .df_age_offense
{
	flex-grow: 2;
	flex-basis: 0;
	min-width: 18em;
}

form#memorial-search .fields .df_gend_id,
form#memorial-search .fields .df_age,
form#memorial-search .fields .df_reli_id,
form#memorial-search .fields .df_nati_id
{
	flex-grow: 1;
	flex-basis: 0;
	min-width: 9rem;
}

form#memorial-search #ff_viol_startdate
{
	display: flex;
	flex-flow: row wrap;
	margin-right: -0.5rem;
}

form#memorial-search .fields .before,
form#memorial-search .fields .after
{
	flex-grow: 2;
	flex-basis: 0;
	min-width: 18em;
	margin-right: 0.5rem;
}

form#memorial-search .fields .before select,
form#memorial-search .fields .after select
{
	width: auto;
}

form#memorial-search .fields input[type=text],
form#memorial-search .fields select
{
	width: 100%;
	height: 1.75rem;
	font-size: 90%;
}

@media (max-width: 1029px)
{
	form#memorial-search .fields input[type=text],
	form#memorial-search .fields select
	{
		font-size: 100%;
	}

	form#memorial-search .fields #ff_viol_startdate select
	{
		width: 5rem;
	}
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* memorial quick search */
.memorial-quick-search .df > .label
{
	font-size: 90%;
	padding-bottom: 0.05rem;
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* memorial browse */

div.memorial-browse-letters
{
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	background-color: #eae8db;
	padding: 0.5rem;
	border: solid 1px #d0d0bc;
	width: auto;
	margin: 1rem 0;
}

div.memorial-browse-letters .letter
{
	flex-grow: 0;
	flex-basis: 0;
	text-align: center;
	min-width: 1.5rem;
	padding: 0.25rem 0;
	font-weight: bold;
	font-size: 95%;
}

#page_memorial-browse-date div.memorial-browse-letters .letter
{
	min-width: 2.5rem;
}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
/* memorial browse/search results and pagination */

.personlist .criteria
{
	margin: 1rem 0;
}

.personlist .pagination-top
{
	font-size: 95%;
	display: flex;
	flex-flow: row wrap;
	color: #9a0000;
}

.personlist .pagination-top .result-count
{
	flex: 1;
	white-space: nowrap;
	padding: 0 3rem 0.5rem 0;
}

.personlist .pagination-top .result-count em
{
	color: black;
	font-style: normal;
}

.personlist .pagination
{
	flex: 1;
	text-align: right;
	padding-bottom: 1rem;
	white-space: nowrap;
	margin-right: -0.1rem;
}

.personlist .pagination .page-number
{
	padding: 0.2rem 0.4rem;
}

.personlist .pagination a.page-number
{
	background-color: #eae8db;
	border: solid 1px #d0d0bc;
	margin: 0 0.1rem;
}

.personlist .itemlist .memorial-list
{
	border-top: solid 1px #ddd;
	display: grid;
	grid-template-columns: 4.25rem auto;
	font-size: 95%;
	margin: 0.7rem 0;
	padding-top: 0.9rem;
}

.personlist .itemlist .memorial-list .photo img
{
	width: 3.25rem;
}

.personlist .itemlist .memorial-list .name
{
	font-weight: bold;
	margin-bottom: 0.3rem;
}

.personlist .itemlist .memorial-list .name:after
{
	padding-left: 5px;
	font-size: 85%;
	content: ">";
	font-weight: bold;
	color: #9a0000;
}

.personlist .itemlist .memorial-list .execution
{
	line-height: 120%;
}
