/* ================================= INFO ================================= */
/* ------------------------------------------------------------------------ */

/*
   These are styles specific to the application Provisional Ballot Status, on
   top of styles from the Cerulean19 theme. See the Cerulean19 styles and
   documentation for more.
 */


/* ================================ COLORS ================================ */
/* ------------------------------------------------------------------------ */

.VR.PF #ElectionResults hr {
	border-top-color: #052387;
}

.VR.PF .Page-PrecinctDirectory h2 {
	border-bottom-color: #CCCCCC;

	color: #505050;
}


/* ================================ GENERAL =============================== */
/* ------------------------------------------------------------------------ */

.VR.PF #google_translate_element {
	margin-bottom: 1.25rem;
}


/* ========================= ADDRESS SEARCH FORM ========================== */
/* ------------------------------------------------------------------------ */

.VR.PF #AddressSearchForm .FieldGroup > .Field.KVP .Label {
	flex-basis: 21.5ex;
}

.VR.PF #AddressSearchForm #SubmissionButtons .ButtonContainer + .ButtonContainer {
	margin-left: 1.0em;
}

.VR.PF #AddressSearchForm #SubmissionButtons div.ButtonContainer {
	margin-top: 0.5em;
}

.VR.PF #AddressSearchForm:not(.withResults) .ResultField {
	display: none;
}

.VR.PF #AddressSearchForm .ResultField .ValueText {
	font-weight: bold;
}

.VR.PF #AddressSearchForm:not(.withResults) #ResultsButtons {
	display: none;
}

.VR.PF #AddressSearchForm.withResults #SearchButtons {
	display: none;
}

.VR.PF:not(.noJS) #AddressSearchForm #FallbackSubmitButton {
	display: none;
}

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

	.VR.PF #SubmissionButtons .ButtonContainer {
		display: block;

		margin-top: 0.75em;
	}

	.VR.PF #AddressSearchForm #SubmissionButtons .ButtonContainer + .ButtonContainer {
		margin-left: 0;
	}
}

@media screen and (min-width: 760px) and (max-width: 979px) {

	.VR.PF #AddressSearchForm form .FieldGroup > .Field.KVP {
		flex-wrap: none;
	}
}

@media screen and (min-width: 760px) {

	.VR.PF #AddressSearchForm #SubmissionButtons {
		margin-left: 19.5ex;
	}
}

/* Autocomplete widget */

.VR.PF #AddressSearchForm .autocomplete.open {
	max-height: none;

	background: transparent;

	overflow-y: visible;
}

.VR.PF #AddressSearchForm .autocomplete > ul {
	position: relative;
	top: 1.125em;
	left: -0.75em;

	background-color: #E7F2F9;
	border-radius: 0.5em;

	color: #333333;
}

.VR.PF #AddressSearchForm .autocomplete > ul:not(:empty) {
	border: 1px solid #AED4EB;
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.125);
}

.VR.PF #AddressSearchForm .autocomplete > ul > li {
	padding-top: 0.5em;
	padding-bottom: 0.5em;
}

.VR.PF #AddressSearchForm .autocomplete > ul > li.active {
	background-color: #AED4EB;
}


/* ========================= ADDRESS SEARCH PAGE ========================== */
/* ------------------------------------------------------------------------ */

.VR.PF .Page-AddressSearch .PageContent {
	margin-top: 1.75rem;
}

.VR.PF .Page-AddressSearch .Preamble {
	margin-bottom: 2.0rem;
}

.VR.PF .Page-AddressSearch .Preamble p {
	margin-left: 0.5rem;
	margin-right: 0.5rem;

	font-size: 0.9rem;
}


/* ===================== ADDRESS SEARCH RESULTS PAGE ====================== */
/* ------------------------------------------------------------------------ */

.VR.PF .Page-AddressSearchResults {
}

.VR.PF .Page-AddressSearchResults .PageContent {
	margin-top: 1.75rem;
}

.VR.PF #ElectionResults {
	margin-top: 2.0rem;
	margin-bottom: 2.0rem;
}

.VR.PF #ElectionResults hr {
	margin: 2.0rem 0;

	border-top-width: 2px;
	border-top-style: solid;
	border-bottom: none;
}

.VR.PF #ElectionResults .SampleBallotUnavailable {
	font-style: italic;

	opacity: 0.8;
}

/* ========================== PRECINCT DIRECTORY ========================== */
/* ------------------------------------------------------------------------ */

.VR.PF .Page-PrecinctDirectory .PrecinctSummaries {
	margin: 1.0rem auto 0 auto;

	max-width: 700px;
}

.VR.PF .Page-PrecinctDirectory .PrecinctSummary {
	margin-top: 0;
	margin-right: 2.5rem;
}

.VR.PF .Page-PrecinctDirectory .PrecinctSummary:not(.Vacant) .ContentGroup.Address {
	display: grid;
	grid-template-rows: auto 4.25em;
	grid-template-columns: auto 190px;

	margin-top: 0.75em;
	margin-right: 0.75rem;
}

.VR.PF .Page-PrecinctDirectory .PrecinctSummary:not(.Vacant) .ContentGroup.Address .NameAndAddress {
	grid-row: 1 / 2;
	grid-column: 1 / 2;

	margin-top: 0;
	margin-bottom: 1.25em;
}

.VR.PF .Page-PrecinctDirectory .PrecinctSummary:not(.Vacant) .ContentGroup.Address .Name {
	margin-bottom: 0.5em;
}

.VR.PF .Page-PrecinctDirectory .PrecinctSummary:not(.Vacant) .ContentGroup.Address .Photos {
	grid-row: 1 / 3;
	grid-column: 2 / 3;

	margin-top: 0;

	text-align: right;
}

.VR.PF .Page-PrecinctDirectory .PrecinctSummary:not(.Vacant) .ContentGroup.Address .Photos img {
	max-width: 180px;
	max-height: 180px;
	border: 1px solid #A0A0A0;
}

.VR.PF .Page-PrecinctDirectory .PrecinctSummary:not(.Vacant) .ContentGroup.Address .SummaryButton {
	grid-row: 2 / 3;
	grid-column: 1 / 2;
}

.VR.PF .Page-PrecinctDirectory .PrecinctSummary:not(.Vacant) .ContentGroup.Address .SummaryButton .Button {
	position: relative;
	bottom: 0.5em;
}

.VR.PF .Page-PrecinctDirectory .PrecinctSummary.Vacant {
	margin-bottom: 0.75rem;
}

.VR.PF .Page-PrecinctDirectory .PrecinctSummary.Vacant .VacancyMessage {
	margin-right: 0.75rem;
	padding: 0.75em 1.125em;

	border-width: 1px;
	border-style: solid;
	border-color: #D0D0D0;
	border-radius: 0.75em;
	background: #E1E1E1;
	box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.125);

	color: #404040;
}

@media screen and (min-width: 1700px) {

	.VR.PF .Page-PrecinctDirectory .PrecinctSummaries {
		margin-left: auto;
		margin-right: auto;
	
		width: 1400px;
		max-width: none;

		columns: 2;
	}
	
	.VR.PF .Page-PrecinctDirectory .PrecinctSummary {
		break-inside: avoid;
	}
}

@media screen and (min-width: 600px) and (max-width: 1699px) {

	.VR.PF .Page-PrecinctDirectory .PrecinctSummaries {
		max-width: 700px;
	}
}

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

	.VR.PF .Page-PrecinctDirectory .PrecinctSummary {
		margin-top: 2.0rem;
		margin-bottom: 0;
	}

	.VR.PF .Page-PrecinctDirectory .PrecinctSummary:not(.Vacant) .ContentGroup.Address {
		display: block;
	}

	.VR.PF .Page-PrecinctDirectory .PrecinctSummary:not(.Vacant) .ContentGroup.Address .Photos {
		margin-top: 1.0rem;

		text-align: center;
	}
	
	.VR.PF .Page-PrecinctDirectory .PrecinctSummary:not(.Vacant) .ContentGroup.Address .Photos img {
		max-width: 65vw;
		max-height: 60vh;
	}
	
	.VR.PF .Page-PrecinctDirectory .PrecinctSummary:not(.Vacant) .ContentGroup.Address .Photos img.rotate {
		max-width: 60vh;
		max-height: 65vw;
	}

	.VR.PF .Page-PrecinctDirectory .PrecinctSummary:not(.Vacant) .ContentGroup.Address .SummaryButton {
		margin-top: 1.0rem;

		text-align: center;
	}
	
	.VR.PF .Page-PrecinctDirectory .PrecinctSummary:not(.Vacant) .ContentGroup.Address .SummaryButton .Button {
		position: static;
	}
}


/* =========================== PRECINCT SUMMARY =========================== */
/* ------------------------------------------------------------------------ */

.VR.PF .Page-PrecinctSummary .ContentGroup.Address {
	margin-left: auto;
	margin-right: auto;

	max-width: 500px;

	color: #646464;
}

.VR.PF .Page-PrecinctSummary .ContentGroup.Address .Name {
	color: #505050;
}

.VR.PF .Page-PrecinctSummary .ContentGroup.Address .Address {
	font-weight: normal;
	color: #646464;
}

.VR.PF .Page-PrecinctSummary .Buttons {
	margin: 1.25rem auto 1.5rem auto;

	text-align: center;
}

.VR.PF .Page-PrecinctSummary .Photos {
	text-align: center;
}

.VR.PF .Page-PrecinctSummary .Photos img {
	max-width: 80vw;
	border: 1px solid black;
}

.VR.PF .Page-PrecinctSummary .Photos img.rotate {
	max-width: none;
	max-height: 80vw;
}

@media screen and (min-width: 480px) {

	.VR.PF .Page-PrecinctSummary .Buttons .Button + .Button {
		margin-left: 1.0em;
	}
}

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

	.VR.PF .Page-PrecinctSummary .Buttons .Button {
		display: block;

		margin-top: 1.0em;
	}
}


/* ========================= PRECINCT STATISTICS ========================== */
/* ------------------------------------------------------------------------ */

.VR.PF .Page-PrecinctStatistics .DataSet:first-child > h1 {
	margin-top: 0;
}

.VR.PF .Page-PrecinctStatistics .DataVisualizationOptions {
	margin-bottom: 1.5rem;
	padding-left: 0.5rem;
}

.VR.PF .Page-PrecinctStatistics .DataTable {
	width: 85%;
	max-width: 920px;
}

.VR.PF .Page-PrecinctStatistics .DataTable.Demographics thead tr > *:first-child {
	width: 20%;
}

.VR.PF .Page-PrecinctStatistics .DataTable.Demographics thead tr > *:last-child {
	width: 10%;
}

@media screen and (min-width: 760px) {

	.VR.PF .Page-PrecinctStatistics .DataVisualizationOptions .DataTable {
	}

	.VR.PF .Page-PrecinctStatistics .DataVisualizationOptions .DataListing {
		display: none;
	}
}
@media screen and (max-width: 759px) {

	.VR.PF .Page-PrecinctStatistics .DataVisualizationOptions .DataTable {
		display: none;
	}

	.VR.PF .Page-PrecinctStatistics .DataVisualizationOptions .DataListing {
	}
}