@charset "utf-8";
@import url("reset.css");
/* main CSS Document */
/*
	fonts:
	Roboto (normal 400, bold 700)
	Roboto Condensed (normal, italic 700)

	font-family: 'Roboto', sans-serif;
	font-family: 'Roboto Condensed', sans-serif;
*/

*, *:before, *:after {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}
.group:after {
	content: "";
	display: table;
	clear: both;
}

body {
	min-width: 320px;
	margin: 0;
	color: rgb(35,31,32);
	font-family: 'Roboto', sans-serif;
	font-weight: 400;
}
html, body {
	font-size:0.65em;
}

a			{ color: rgb(54,129,129)	}
a:visited	{ color: rgb(66,192,189)	}
a:hover		{ color: rgb(109,77,155)	}

a img:hover { opacity: 0.85 }

.production-note {
	display: none;
}
.temp-note {
	border: 2px solid darkred;
	background-color: pink;
	padding: 2rem;
	font-style: italic;
}
.red {
	color: darkred;
}
.blue {
	color: darkblue;
}
/*----------------base styles--------------------------*/
img {
	width: auto;
	height: auto;
	max-width: 100%;
}
strong {
	font-weight: 700;
}
em {
	font-style: italic;
}
p, li, td, th, td, dd, dt {
	font-size: 1.8rem;
	line-height: 1.5;
}
.c {
	text-align: center;
}
.center {
	margin-left: auto !important;
	margin-right: auto !important;
}
.capitalize {
	text-transform: capitalize;
}
p {
	margin: 0 0 1.5rem 0;
}
.highlight {
	background-color: lightgoldenrodyellow;
}
div.highlight {
	padding: 10px;
	margin-bottom: 2rem;
}
.fineprint {
	font-size: 1.6rem;
	color: gray;
}
.wrapper {
	width: 100%;
	max-width: 1600px;
	margin: 0 auto;
}
.wrapper-wider {
	width: 100%;
	max-width: 2400px;
	margin: 0 auto;
}
.container { /*top-level grid*/
	display: grid;
	height: 100vh;
	grid-template-columns: 1fr;
	grid-template-rows: auto 1fr auto;
}
.container.home {
	height: auto;
	display: block;
}
header {
	grid-row: 1;
	padding-top: 1rem;
}
.logo-and-socials {
	 display: flex;
	 justify-content: space-evenly;
}
.logo {
	flex-grow: 1;
}
.social-media-container {
	flex-grow:9;
	display: flex;
	justify-content: flex-end;
}
.social-media-container a {
	display: block;
	align-self: center;
	margin: 0 1rem;
}
.main {
	grid-row: 2;
	padding-bottom: 4rem;
	font-size: 1.8rem;
	position: relative;
}
footer {
	grid-row: 3;
	padding: 4rem 0;
}
footer .fineprint {
	font-size: 1.2rem;
	color: rgba(255,255,255,0.75);
}
footer img {
	max-width: 300px;
}
footer a, footer a:visited {
	text-decoration: none;
	display: inline-block;
	padding: 0.5rem;
	color: rgba(255,255,255,0.75);
}
footer a:hover, footer a:focus {
	opacity: 1;
	background-color: rgb(66,192,189);
	color: white;
}
footer h4 {
	margin: 1.5rem 0 1rem 0;
	border-bottom: 1px solid rgb(66,192,189);
	color: rgba(255,255,255,0.75);
	font-weight: 700;
	font-size: 1.8rem;
	line-height: 1.5;
}

/*layout variations*/
.regular-with-sidebar {
	display: grid;
	grid-template-columns: 6fr 3fr;
	grid-template-rows: 1fr;
}
.regular-with-sidebar .main-content {
	padding: 2rem 2rem 4rem 1rem;
}
.regular-with-sidebar .side-blocks {
	padding: 2rem 1rem 4rem 1rem;
}
.side-blocks > div {
	margin-bottom: 1rem;

}

.hidden {
	display: none;
}
.logo img {
	width: 100%;
	max-width: 320px;
}

#emailsignupblock {
	width: auto;
	padding: 5px;
	background: none;
}

/*-------------------------------image containers*/
.image-container {
	margin-bottom: 2rem;
}
.image-container img,
.home-slides img {
	width: 100%;
	max-width: 100%;
	height: auto !important;
}

.right-align {
	display: block;
	float: right;
	width: 40%;
	margin: 0 0 1rem 1rem;
}

/*backgrounds*/
.gray {
	background: rgb(120,209,207); /* For browsers that do not support gradients */
	background: -webkit-linear-gradient(rgb(172,227,226), rgb(120,209,207)); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(rgb(172,227,226), rgb(120,209,207)); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(rgb(172,227,226), rgb(120,209,207)); /* For Firefox 3.6 to 15 */
	background: linear-gradient(rgb(172,227,226), rgb(120,209,207)); /* Standard syntax */
}
.dark-blue {
	background: rgb(54,129,129);
}

.dark {
	background-color: rgb(100,107,125);
	color: white !important;
}
/*boxes*/
.home-banner-container {
	background: rgb(100,107,125);
	background-size: contain;
	text-align: center;
}

.head-container {
	background: rgb(100,107,125)
}
.home-banner-container img,
.head-container img {
	margin-bottom: -3px;
}
.padded {
	padding: 2rem;
}
.rounded {
	border-radius: 15px;
}
.padded-block {
	padding: 1rem;
	margin: 0 0 0.5rem 0;
}
.shadowed {
	box-shadow: 0 0.1rem 0.2rem rgba(0,0,0,0.25);
}
.shadowed-more {
	box-shadow: 0 0.5rem 0.8rem rgba(0,0,0,0.25);
}
.golden-ratio-box {
	display: grid;
	grid-template-columns: 33% auto;
	gap: 3rem;
	padding: 1rem;
}

.box-container { /*used in footer*/
	margin:3rem 2rem;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-start;
	align-content: flex-start;
	flex-wrap: wrap;
}
.box-container > div {
	width: 32%;
}
/*titles*/

h1, h2, h3 {
	padding: 2rem 0;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 700;
	line-height: 1.2;
}
h1 {
	padding: 0 0 2rem 0;
	color: rgb(88,62,123);
	font-size: 3rem;
}
h2 {
	color: rgb(66,192,189);
	font-size: 2.4rem;
}
h3 {
	font-size: 2rem;
	color: rgb(132,133,136);
}
h4 {
	margin: 2rem 0 1rem 0;
	border-bottom: 1px solid rgb(176,211,247);
	font-weight: 700;
	font-size: 1.8rem;
	line-height: 1.5;
}
h5 {
	margin: 1rem 0;
	line-height: 1.5;
	font-style: italic;
}
/*lists*/
ul, ol {
	padding: 0 0 2rem 4rem;
}
footer ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.no-bullets {
	list-style: none;
}
.no-bullets li {
	padding-bottom: 1rem;
}
dt {
	font-weight: 700;
	margin: 0;
	padding: 2rem 0 0 0;
}
dd {
	margin: 0;
	padding: 0 0 2rem 4rem;
}
/*fancy ordered list*/
ol.fancy {
	list-style: none;
	counter-reset: fancy;
	margin: 0 0 0 3rem;
}
ol.fancy > li {
	counter-increment: fancy;
	margin-bottom: 1rem;
}
ol.fancy > li::before {
	display: inline-block;
	width: 3rem;
	margin: 0 1rem 0 -4rem;
	padding: 0.2rem 0 0 0;
	content: counter(fancy);
	background: rgb(66,192,189);
	border-radius: 100%;
	color: white;
	text-align: center;

}
ol.fancy ul {
	list-style: disc;
	margin: -3rem 0 0 0;
	padding: 0 0 0 2rem;
}
ol.fancy ol {
	list-style: lower-alpha;
}
ol.fancy ul.with-intro {
	margin: 0;
}
/*tables*/
table.data-table {
	width: 100%;
	margin-bottom: 3rem;
	border: 1px solid #dbdbea;
}
table.data-table tr {
	 border-bottom: 1px solid #dbdbea;
}
table.data-table th, table.data-table td {
	line-height: 1.5;
	padding: 1rem;
}
table.data-table th {
	vertical-align: top;
	background: rgb(54,129,129);
	color: #ffffff;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 700;
	text-align: left;
}

table.zebra tr:nth-of-type(odd) {
	background: #edeef1;
}


/*circular percentage charts on home page*/
.pie-container {
	display: grid;
	grid-template-columns: auto auto;
	align-items: center;
	justify-items: stretch;
}

@property --p {
	syntax: '<number>';
	inherits: true;
	initial-value: 1;
}

.pie {
	--p:20;
	--b:11px;
	--c:gray;
	--w:100px;

	width: var(--w);
	aspect-ratio: 1;
	position: relative;
	display: inline-grid;
	margin: 5px 25px 25px 5px;
	place-content: center;
	font-size: 2.5rem;
	font-weight: 700;
	font-family: sans-serif;
}
.pie:before,
.pie:after {
	content: "";
	position: absolute;
	border-radius: 50%;
}
.pie:before {
	inset: 0;
	background:
			radial-gradient(farthest-side,var(--c) 98%,#0000) top/var(--b) var(--b) no-repeat,
			conic-gradient(var(--c) calc(var(--p)*1%),#0000 0);
	-webkit-mask: radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
	mask: radial-gradient(farthest-side,#0000 calc(99% - var(--b)),#000 calc(100% - var(--b)));
}
.pie:after {
	inset: calc(50% - var(--b)/2);
	background: var(--c);
	transform: rotate(calc(var(--p)*3.6deg)) translateY(calc(50% - var(--w)/2));
}
.animate {
	animation: p 1s .5s both;
}
.pie-zero:before, .pie-zero:after {
	background:none;
}
@keyframes p{
	from{--p:0}
}
/*------------------news styles------------------------*/
.news-grid {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-evenly;
	align-items: stretch;
	align-content: space-evenly;
}
.news-grid h3 {
	padding-bottom: 0;
}
.news-grid > a, .news-grid > a:visited {
	display: block;
	width: 32%;
	margin-bottom: 2rem;
	color: #333333;
	background-color:#fafafa;
	text-decoration: none;
}
.news-grid > a:hover {
	background-color: rgb(213,240,239);
}
.news-tile-content {
	padding: 0 1rem;
}
.news-tile-content p {
	margin-top: 2rem;
}
.news h1, .news h2 {
	padding: 0 0 1rem 0;
}
.news-tile-image {
	max-height: 325px;
	overflow: hidden;
}
/*-------------------------------------news article display*/
.summary {
	padding: 2rem;
	background-color: rgb(213,240,239);
}
/**/
/*--------------------------side blocks styles-------------------------------*/
.text-block h3,
.section-navigation h3,
.members-list h3,
.resource-list h3 {
	margin: -1rem -1rem 1rem -1rem;
	padding: 1rem 0 1rem 1rem;
	background-color: rgb(54,129,129);
	color: #ffffff;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 2.5rem;
	font-weight: 400;
	opacity: 0.95;
}
.text-block h3:before,
.section-navigation h3:before,
.members-list h3:before,
.resource-list h3:before {
	display: inline-block;
	margin: 0 0 0 -3rem;
	padding: 0 0.5rem 0 3rem;
	color: #ffffff;
	font-family:'Font Awesome 6 Pro';
	font-weight: 900;
}
.text-block h3:before 			{content:"";}
.section-navigation h3:before 	{content:"\f0c9";}
.members-list h3:before 		{content:"\f0c0";}
.resource-list h3:before 		{content:"\f12e";}

.section-navigation ul {
	list-style: none;
	margin: 1rem 0 0 0;
	padding: 0;
}
.section-navigation ul li {
	margin: 0 0 0.1rem 0;
	padding: 1rem 0 1rem 2.4rem;
	width:auto;
	line-height: 1.3;
}
.section-navigation ul li:hover,
.section-navigation ul li.current,
.section-navigation ul li.current:visited,
.section-navigation ul li.current:hover {
	-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;
	background-color: rgb(54,129,129);
}
.section-navigation a,
.section-navigation a:visited {
	display: block;
	padding-left: 1rem;
	width: 100%;
	height: 100%;
	text-decoration: none;
	color: rgb(63,67,78);
}
.section-navigation a:hover,
.section-navigation a:visited:hover {
	opacity: 75%;
}
.section-navigation ul li a, .section-navigation ul li a:visited {
	color: rgb(63,67,78);
}
.section-navigation ul li:hover a, .section-navigation ul li:hover a:visited {
	color: #ffffff;
}

.section-navigation ul li a:before {
	display: inline-block;
	margin-left: -2rem;
	padding-right: 1.1rem;
	font-family:'Font Awesome 6 Pro';
	font-style: normal;
	font-variant: normal;
	font-weight: 900;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	text-decoration: none;
	content:"\f0da";
}
.supporther {
	width: 12rem !important;
}
/*------------------------------ribbons on news*/
.tagbox {
	position:relative;
	display: block;
	border: 1px solid rgb(222,224,228);
}
.ribbon {
	width: 150px;
	height: 150px;
	overflow: hidden;
	position: absolute;
}
.ribbon::before,
.ribbon::after {
	position: absolute;
	z-index: -1;
	content: '';
	display: block;
	border: 5px solid rgb(63,67,78);
}
	/*shadow colors for events and press releases*/
.type-event:before, .type-event:after {border-color:rgb(88,62,123)}
.type-release:before, .type-release:after {border-color:rgb(54,129,129)}

.ribbon span {
	position: absolute;
	display: block;
	width: 225px;
	padding: 15px 0;
	background-color: rgb(100,107,125);
	box-shadow: 0 5px 10px rgba(0,0,0,.1);
	color: #fff;
	font: 400 1.4rem 'Roboto Condensed', sans-serif;
	text-shadow: 0 1px 1px rgba(0,0,0,.2);
	text-transform: uppercase;
	text-align: center;
}
	/*ribbon colors for events and press releases*/
.type-event span {background-color:rgb(123,87,172)}
.type-release span {background-color:rgb(66,192,189)}

.ribbon-top-right {
	top: -10px;
	right: -10px;
}
.ribbon-top-right::before,
.ribbon-top-right::after {
	border-top-color: transparent;
	border-right-color: transparent;
}
.ribbon-top-right::before {
	top: 0;
	left: 0;
}
.ribbon-top-right::after {
	bottom: 0;
	right: 0;
}
.ribbon-top-right span {
	left: -25px;
	top: 30px;
	transform: rotate(45deg);
}
	/*tags - content*/

.type-event span:after 		{ content:'event' }
.type-release span:after 	{ content:'press release' }
.type-news span:after 		{ content:'announcement' }

/*ribbons END*/

/*links and filetypes*/

a.filetype {
	display: inline-block;
	padding: 0 0 0 2rem;
}

a.link:after,
a.filetype:before {
	display: inline-block;
	font-family:'Font Awesome 5 Pro';
	font-style: normal;
	font-variant: normal;
	font-weight: 700;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	text-decoration: none;
}

a.link:after		{ padding-left: 0.5rem	}
a.filetype:before 	{ padding-right: 0.5rem; margin-left: -2rem	}

a.external:after { content:"\f08e" }
a.internal:after { content:"\f0c1" }
a.map:after { content:"\f3c5" }
a.mail:after { content:"\f0e0" }
a.phone:after { content:"\f3cd"}
a.pdf:after, a.pdf:before { content:"\f1c1" }
a.more-info:after { content: "\f0a4"}
a.nav-item:before { content: "\f330" }
a.video:after { content:"\f03d"}

a.link:before { content: none}
a.filetype:after { content: none}

a.phone { white-space: nowrap }

.toggler {
	cursor: pointer;
}
.toggler:after {
	display: inline-block;
	padding-left: 0.8rem;
	font-family:'Font Awesome 5 Pro';
	content:"\f13a";
	font-style: normal;
	font-variant: normal;
	font-weight: 700;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	text-decoration: none;
}

.toggler.active:after {
	content:"\f139";
}
.toggled {
	display: none;
}
/*button animation*/
.animated-1 {
	animation: slide-in 3s ease alternate;

}
@keyframes slide-in {
	25% {margin-left: -2rem}
	50% {margin-left: 2rem}
	100% {margin-left: 0}
}
/*--------------------------vcard----------------*/
.vcard {
	width: auto;
	margin: 2rem;
	padding: 0;
	background-color: #ffffff;
	box-shadow: 0 1px 0.5rem rgba(0,0,0,0.15);
}

.vcard img {
	width: 100%;
	margin: 0 0 1rem 0;
	max-width: 320px;
	min-width: 320px;
	float: left;
}

.vcard p {
	margin: 1rem;
	padding: 0;
}
.card-with-bio {
	background: rgb(244,241,248);
	padding: 2rem;
	margin-bottom: 1rem;
}
.card-with-bio .vcard {
	float: left;
	margin: 0 2rem 1rem 0;
}
.card-with-bio:after {
	content: "";
	display: table;
	clear: both;
}
.bod .card-with-bio .vcard2 {
	display: none;
}
.card-with-bio .pronouns, .pronouns {
	display: inline-block;
	padding: 0 0 0 1rem;
	color: rgb(123,87,172);
}
.card-with-bio p {
	text-align: justify;
}
/*end vcard*/
/*---------------media queries*/

@media screen and (max-width:980px) {
	.hidden-980 {
		display: none !important;
	}
	.visible-980 {
		display: block !important;
	}
	/*menu styles in menu.css*/
	.logo-and-socials {
		justify-content: flex-start;
	}
	.logo {
		flex-grow: unset;
	}
	.mobile-social-media-container {
		display: flex;
		justify-content: space-evenly;

	}
	.golden-ratio-box {
		grid-template-columns: auto;
		gap:0;
		padding: 1rem;
	}
	.regular-with-sidebar {
		display: block;
	}
	.logo img {
		max-height: 100px;
	}
	#mobile-menu-toggle {
		margin-top: 2rem;
	}
	.regular-with-sidebar .side-blocks {
		padding: 0;
		margin: 0 1rem;
	}
	.regular-with-sidebar .main-content {
		padding: 1rem 1rem 0 1rem;
	}
	.news-grid > a {
		width: 100%;
	}

}
@media screen and (max-width:768px) {
	.hidden-768 {
		display: none !important;
	}
	.visible-768 {
		display: block !important;
	}

	.box-container {
		margin: 0 0 4rem 0;
	}
	.box-container {
		margin: 1rem;
		display: block;
	}
	.box-container > div {
		width: 100%;
	}
	.vcard {
		width:300px;
		margin: 1rem;
	}
	.vcard img {
		max-width: 300px;
		min-width: 300px;
	}
	.card-with-bio .vcard {
		float: none;
		margin: 0;
	}
	.right-align {
		float: none;
		width: 98%;
		margin: 0 auto;
	}
	/* Tables no longer tables */

	table, thead, tbody, th, td, tr {
		display: block;
	}
	tfoot {
		display: none;
	}
	/* Hide table headers (but not display: none;, for accessibility) */
	thead tr {
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	td {
		/* Behave  like a "row" */
		position: relative;
		padding: 1rem 0 0 38% !important;
		font-size: 1.5rem;
	}

	tr {padding: 2rem 0;}

	td:before {
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 1.2rem;
		left: 0.5rem;
		width: 36%;
		padding-right: 10px;
		text-align: right;
		font-family: 'Roboto Condensed', sans-serif;
		font-size: 1.5rem;
		font-weight: 700;
		line-height: 1;
		color: rgb(54,129,129);
	}

	/*
	Label the data
	*/
	.home-table td:nth-of-type(1):before { content: "Rank"; }
	.home-table td:nth-of-type(2):before { content: "Jurisdiction"; }
	.home-table td:nth-of-type(3):before { content: "Election Year"; }
	.home-table td:nth-of-type(4):before { content: "% of Women"; }
	.home-table td:nth-of-type(5):before { content: "# of Women";}
	.home-table td:nth-of-type(6):before { content: "Next General Election";}

	
}


@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	/* IE10+ CSS styles go here */

	/*
	* Prefixed by https://autoprefixer.github.io
	* PostCSS: v7.0.29,
	* Autoprefixer: v9.7.6
	* Browsers: last 4 version
	*/

	.container { /*top-level grid*/
		display: -ms-grid;
		-ms-grid-columns: 1fr;
		-ms-grid-rows: auto 1fr auto;
	}.container > *:nth-child(1) {
		 -ms-grid-row: 1;
		 -ms-grid-column: 1;
	 }.container > *:nth-child(2) {
		  -ms-grid-row: 2;
		  -ms-grid-column: 1;
	  }.container > *:nth-child(3) {
		   -ms-grid-row: 3;
		   -ms-grid-column: 1;
	   }

	.regular-with-sidebar {
		display: -ms-grid;
		-ms-grid-columns: 6fr 3fr;
		-ms-grid-rows: 1fr;
	}.regular-with-sidebar > *:nth-child(1) {
		 -ms-grid-row: 1;
		 -ms-grid-column: 1;
	 }.regular-with-sidebar > *:nth-child(2) {
		  -ms-grid-row: 1;
		  -ms-grid-column: 2;
	  }
	/*end*/
}