@charset "UTF-8";

/* d02.css: styles for Senate District 2's pages, moved from their <style> blocks (CSS plan, Phase 3).
   Each page sets $page_class (on <body>) and lists this file in $page_css; :where() scopes a rule to its page
   without adding specificity. No media attribute: like the <style> blocks, these rules apply in print too. */

/* == == helpful_contacts.php only == == */

@media (min-width: 741px) {
	/* DESKTOP STYLES */
	:where(.pg_helpful_contacts) div.mem_services_flex {
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		justify-content: space-evenly;
		align-items: stretch;
		margin: 0;
	}

	:where(.pg_helpful_contacts) div.mem_services_flex_col1 {
		margin: 0;
		flex-basis: 65%;
		flex-grow: 1;
		text-align: left;
		margin-right: .1em;
	}

	:where(.pg_helpful_contacts) div.mem_services_flex_col2 {
		margin: 0;
		flex-basis: 35%;
		flex-grow: 1;
		text-align: left;
		margin-left: .1em;
		align-self: stretch;
	}

	:where(.pg_helpful_contacts) div.mem_services_www {
		padding: .4em;
		border: 2px solid #b0c4de;
		background-color: #eee;
		border-radius: .3em;
		height: auto;
	}

	:where(.pg_helpful_contacts) table.mem_services_nums {
		width: 100%;
		margin-bottom: 2em;
		border-collapse: collapse;
	}

	:where(.pg_helpful_contacts) table.mem_services_nums caption {
		text-align: left;
		color: #000;
		font-weight: bold;
		font-size: 1.1em;
		padding-bottom: .2em;
	}

	:where(.pg_helpful_contacts) th.hiddenheader {
		height: 1px;
		width: 1px;
		position: absolute;
		overflow: hidden;
		top: -999px;
	}

	:where(.pg_helpful_contacts) table.mem_services_nums tr td {
		text-align: left;
		padding: .2em;
	}

	:where(.pg_helpful_contacts) table.mem_services_nums tr td + td {
		text-align: right;
	}

	:where(.pg_helpful_contacts) table.mem_services_nums tr td.indent {
		padding-left: 2em;
	}

	/*table.mem_services_nums tr:nth-child(odd) {
		background-color: #ddd;
	}*/

	:where(.pg_helpful_contacts) h3.mem_service_col_title {
		margin: .2em;
		margin-top: 1em;
		margin-bottom: .3em;
		font-family: "Lucia Sans Unicode", "Lucida Grande", Helvetica, sans-serif;
		color: #446078;
		text-transform: uppercase;
		font-size: 1.2em;
		white-space: nowrap;
	}

	:where(.pg_helpful_contacts) h4 {
		font-size: .9em;
		margin: 0;
		padding: 0;
	}

	:where(.pg_helpful_contacts) h4 + a {
		font-size: 1em;
	}

	:where(.pg_helpful_contacts) h4 + a + h4 {
		margin-top: 1em;
	}
}

@media (max-width: 740px) {
	/* MOBILE STYLES */
	:where(.pg_helpful_contacts) div.mem_services_flex {
		margin: 0;
	}

	:where(.pg_helpful_contacts) div.mem_services_flex_col1 {
		margin: 0;
		text-align: left;
		margin-right: .1em;
	}

	:where(.pg_helpful_contacts) div.mem_services_flex_col2 {
		margin: 0;
		text-align: left;
		margin-left: .1em;
	}

	:where(.pg_helpful_contacts) div.mem_services_www {
		padding: .4em;
		border: 2px solid #b0c4de;
		background-color: #eee;
		border-radius: .3em;
		height: auto;
	}

	:where(.pg_helpful_contacts) table.mem_services_nums {
		width: 100%;
		margin-bottom: 2em;
		border-collapse: collapse;
	}

	:where(.pg_helpful_contacts) table.mem_services_nums caption {
		text-align: left;
		color: #000;
		font-weight: bold;
		font-size: 1.1em;
		padding-bottom: .2em;
	}

	:where(.pg_helpful_contacts) th.hiddenheader {
		height: 1px;
		width: 1px;
		position: absolute;
		overflow: hidden;
		top: -999px;
	}

	:where(.pg_helpful_contacts) table.mem_services_nums tr td {
		text-align: left;
		padding: .2em;
	}

	:where(.pg_helpful_contacts) table.mem_services_nums tr td + td {
		text-align: right;
	}

	:where(.pg_helpful_contacts) table.mem_services_nums tr td.indent {
		padding-left: 2em;
	}

	/*table.mem_services_nums tr:nth-child(odd) {
		background-color: #ddd;
	}*/

	:where(.pg_helpful_contacts) h3.mem_service_col_title {
		margin: .2em;
		margin-top: 1em;
		margin-bottom: .3em;
		font-family: "Lucia Sans Unicode", "Lucida Grande", Helvetica, sans-serif;
		color: #446078;
		text-transform: uppercase;
		font-size: 1.2em;
		white-space: nowrap;
	}

	:where(.pg_helpful_contacts) h4 {
		font-size: .9em;
		margin: 0;
		padding: 0;
	}

	:where(.pg_helpful_contacts) h4 + a {
		font-size: 1em;
	}

	:where(.pg_helpful_contacts) h4 + a + h4 {
		margin-top: 1em;
	}
}

/* == == services.php only == == */

@media (min-width: 741px) {
	/* DESKTOP STYLES */
	:where(.pg_services) div.mem_services_flex {
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		justify-content: space-evenly;
		align-items: stretch;
		margin: 0;
	}

	:where(.pg_services) div.mem_service_flex_col {
		margin: 0;
		flex-basis: 16%;
		flex-grow: 1;
		text-align: center;
		margin-left: .1em;
		margin-right: .1em;
		max-width: 16%;
	}

	:where(.pg_services) h2.mem_service_col_title {
		font-family: "Lucia Sans Unicode", "Lucida Grande", Helvetica, sans-serif;
		color: #446078;
		text-transform: uppercase;
		font-size: 1em;
		white-space: nowrap;
	}

	:where(.pg_services) div.mem_service_flex_col div {
		margin: 0;
		margin-top: .3em;
		padding: .4em;
		border: 2px solid #b0c4de;
		height: 29em;
		background-color: #eee;
		border-radius: .3em;
	}

	:where(.pg_services) div.mem_service_flex_col div+div {
		height: auto;
		text-align: center;
		padding: .6em;
	}
}

@media (max-width: 740px) {
	/* MOBILE STYLES */
	:where(.pg_services) div.mem_services_flex {
		text-align: center;
		margin: 0;
	}

	:where(.pg_services) div.mem_service_flex_col {
		margin: 0;
		text-align: center;
	}

	:where(.pg_services) h2.mem_service_col_title {
		font-family: "Lucia Sans Unicode", "Lucida Grande", Helvetica, sans-serif;
		color: #446078;
		text-transform: uppercase;
		font-size: 1em;
		white-space: nowrap;
		margin-top: 2em;
	}

	:where(.pg_services) div.mem_service_flex_col div {
		margin: 0;
		margin-top: .3em;
		padding: .8em;
		border: 2px solid #b0c4de;
		background-color: #eee;
		border-radius: .3em;
	}

	:where(.pg_services) div.mem_service_flex_col div p {
		text-align: justify;
	}

	:where(.pg_services) div.mem_service_flex_col div+div {
		height: auto;
		text-align: center;
	}

	:where(.pg_services) div.mem_service_flex_col img {
		display: none;
	}
}

/* == == staff.php only == == */

      :where(.pg_staff) div#sos_votereq {
      	margin-top: 15px;
      }
      :where(.pg_staff) table.votereq tr td {
      	font-weight: bold;
      	font-style: normal;
      	border: 0;
      }
      :where(.pg_staff) table.votereq tr td+td {
      	font-weight: normal;
      	font-style: italic;
      }
      :where(.pg_staff) table.votereq tr:nth-child(odd) {
      	background-color: #bcd0d1;
}

/* == == _extras.inc only (member page, member.php?d=2) == == */

@media (min-width: 741px) {
	/* DESKTOP STYLES */
	:where(.pg_member) #HALLgalleria {
		width: 100%;
		height: 575px;
	}

	:where(.pg_member) div.hall_extra {
		padding: 20px;
		padding-top: 10px;
		padding-bottom: 10px;
	}

	:where(.pg_member) div.hall_extra p.pr {
		font-size: 1.1em;
	}
}

@media (max-width: 740px) {
	/* MOBILE STYLES */
	:where(.pg_member) #HALLgalleria {
		width: 100%;
		height: 300px;
	}

	:where(.pg_member) div.hall_extra {
		padding-top: 5px;
		padding-bottom: 5px;
	}

	:where(.pg_member) div.hall_extra p.pr {
		font-size: 1.1em;
	}
}
