/** HOMEPAGE styles */
	@media (min-width: 1160px) {
		.homepage {
			display: grid;
		}
	}
	/* hero */
		@media (min-width: 1160px) {
			#hero {
				grid-column: span 2
			}
		}
		.homepage #hero {
			align-items: center;
			background-color: #2c394b; /*fallback*/
			background-image: url('../images/homepage/cogs-blue-2.jpg');
			background-position: center;
			background-repeat: no-repeat;
			background-size: cover; -webkit-background-size: cover;
			box-shadow: inset 0 3px 5px gray;
			color: white;
			display: flex;
			flex-flow: row wrap;
			justify-content: center;
			padding: 2rem 0;
			text-align: center;
		}
		.homepage #hero * {
			font-family: "montserrat";
		}
		.homepage #hero h1 {
			display: none;
		}
		.homepage #hero > * {
			margin: 1rem;
		}
		.homepage #hero > a {
			background-color: #8bb0dd;
			border: 1rem solid #5a7dab;
			width: 10rem;
			height: 10rem;
			text-align: center;
			text-transform: uppercase;
			vertical-align: bottom;
			border-radius: 100px;
		}
		.homepage #hero > a span {
			color: white;
			display: block;
			letter-spacing: 0;
			line-height: 2rem;
			margin-top: 2rem;
		}
		/* .homepage #hero > :nth-child(3) span {
			padding-top: 1rem;
		} */
		@media (min-width: 550px) {
			.homepage #hero > :nth-child(2),
			.homepage #hero > :nth-child(8) {
				flex-basis: 100%;
			}
		}
		@media (min-width: 1050px) {
			.homepage #hero > :nth-child(2),
			.homepage #hero > :nth-child(8) {
				flex-basis: auto;
				letter-spacing: .05rem;
			}
			.homepage #hero > a {
				width: 12rem;
				height: 12rem;
				font-size: 1.6rem;
			}
			.homepage #hero > a span {
				margin-top: 3rem;
			}
			.homepage #hero > span {
				font-size: 5rem;
				margin: 0;
			}
		}
	/* paragraph */
	#summary {
		padding: 2rem;
		  grid-column: span 2;
	}
	#summary p {
		margin: 0;
	}
	@media (min-width: 800px) {
		#summary p {
			margin: 0 4rem;
		}
	}
	/* Access Resources by Measure (charts) */
		.homepage #charts {
			background: #327795; /*#eef6e2*/
			padding: 0 0 2rem;
			width: fit-content;
		}
		@media (min-width: 780px) {
			.homepage #charts {
				width: inherit;
			}
		}
		@media (min-width: 1160px) {
			#charts {
				grid-column: 1;
			}
		}
		h2 {
			font-size: 2.3rem;
			margin: 1.5rem 0;
			text-align: center;
			font-weight: bold;
			letter-spacing: .1rem;
		}
		#charts h2 {
			color: white;
			display: inline-block;
			width: 100%;
		}
		/* NPM chart*/
			.homepage #chart-npm {
				overflow: hidden;
				width: 810px;
				margin: 0 auto;
				height: 85rem;
			}
			@media (min-width: 1160px) {
				.homepage #chart-npm {
					width: 1000px;
					margin: 0 auto;
				}
			}
			/* styles shared between cells */
				.homepage #chart-npm h4 {
					display: flex;
					flex-flow: column;
					align-items: center;
					width: 155px;
					color: white;
					height: 120px;
					margin: 1rem 0;
				}
				.homepage #chart-npm h4 span {
					align-items: center;
					background-color: gray;
					border-radius: .4rem;
					color: white;
					display: block;
					display: flex;
					flex-flow: column wrap;
					font-size: 1.3rem;
					justify-content: center;
					line-height: 1.6rem;
					margin-bottom: -1.3rem;
					min-height: 32px;
					padding: .35rem;
					text-align: center;
					text-transform: uppercase;
					width: 130px;
					z-index: 10;
				}
				.homepage #chart-npm h4 img {
					width: 130px;
					border: 3px solid gray;
					border-radius: 1rem;
				}
				.homepage .npm-header,
				.homepage .sm-header {
					background-color: #327795;
					color: #327795;
					font-size: 1.6rem;
					overflow: hidden;
					padding: 3px 1.35rem 0;
					width: 100%;
				}
				.homepage #chart-npm > div,
				.homepage #chart-sm > div {
					border-radius: 1rem;
					width: 160px;
					display: flex;
					flex-flow: column;
					float: left;
				}
				.homepage #chart-npm > div > a,
				.homepage #chart-sm > div > a {
					border-radius: 1rem;
					color: black;
					margin: .5rem;
					padding: .5rem;
					display: flex;
					align-items: center;
				}
				.homepage #hero a,
				.homepage #chart-npm > div > a,
				.homepage #chart-sm > div > a,
				.homepage span.medical_home {
					/* animation by ianlunn.github.io/Hover */
					-webkit-transform: perspective(1px) translateZ(0);
					transform: perspective(1px) translateZ(0);
					-webkit-transition-duration: 0.1s;
					transition-duration: 0.1s;
					-webkit-transition-property: transform;
					transition-property: transform;
				}
				.homepage #chart-npm > div > a:hover,
				.homepage span.medical_home:hover,
				.homepage #chart-sm > div > a:hover,
				.homepage #chart-npm > div > a:focus,
				.homepage span.medical_home:focus,
				.homepage #chart-sm > div > a:focus,
				.homepage #chart-npm > div > a:active,
				.homepage span.medical_home:active,
				.homepage #chart-sm > div > a:active{
					transform: scale(1.14); -webkit-transform: scale(1.14);
					box-shadow: 0 4px 10px -1px gray;
					z-index: 20;
				}
				.homepage #hero a:hover,
				.homepage #hero a:focus,
				.homepage #hero a:active {
					transform: scale(1.1); -webkit-transform: scale(1.1);
					background: #d3eaff;
					border-color: #8bb0dd;
				}
				.homepage #hero a:hover span,
				.homepage #hero a:focus span,
				.homepage #hero a:active span {
					color: #254460;

				}
				.homepage span.medical_home > img,
				.homepage a > img {
					float: left;
					margin-right: .5rem;
					width: 4rem;
				}
				.homepage #chart-sm > div > a span,
				.homepage #chart-npm > div > a > span {
					font-size: 1.4rem;
					line-height: 2rem;
					margin-left: .5rem;
				}
				/* medical home only */
					span.medical_home {
						border-radius: 1rem;
						color: black;
						display: grid;
						margin: .5rem;
						padding: .5rem;
					}
					.med-home-univ {
						line-height: 2rem;
						display: block;
					}

					.homepage span.medical_home * {
						color: black;
						line-height: 1.4rem;
					}
					.homepage span.medical_home > a {
						font-size: 1.4rem;
						grid-column: 2;
					}
					.homepage span.medical_home a:hover {
						text-decoration: underline;
					}
					.homepage span.medical_home ul {
						grid-column: span 2;
						line-height: 2rem;
						list-style: unset !important;
						list-style-type: disc !important; /*TODO: skeleton.css is overriding*/
						margin: 0 1.5rem;
					}
					.homepage span.medical_home ul li a {
						font-size: 1.2rem;
					}
					.homepage span.medical_home ul li:before{
							content: "";
					}
					.homepage .clinical-health-systems {
						background-color: #fdd49c; /* #fff2e0; */
						border: 3px solid #fba938; /* #fbaf33; */
					}
					.homepage .health-behaviors {
						background-color: #c7e2a1; /* #f5ffe6; */
						border: 3px solid #8fc642; /* #8dc533; */
					}
					.homepage .community-health-factors {
						background-color: #9dd7f1; /* #e1f7ff; */
						border: 3px solid #2376bc; /* #5ba9d9; */
					}
				@media (min-width: 1160px) {
					.homepage #chart-npm > div {
						width: 200px;
					}
					.homepage #chart-npm h4 {
						width: 200px;
					}
					.homepage #chart-npm h4 span {
						width: 165px;
					}
					.homepage #chart-npm h4 img {
						width: 185px;
					}
					.homepage .npm-header,
					.homepage .sm-header {
						margin: 1.5rem 0 .5rem;
						padding-bottom: 5px;
					}
					.homepage span.medical_home > img,
					.homepage a > img {
						width: 5rem;
					}
					.homepage span.medical_home > span,
					.homepage #chart-npm > div > a > span {
						font-size: 16px;
					}
				}
			/* women/maternal health only */
				.homepage h4#wmh span,
				.homepage h4#wmh img {
					background-color: #bb6eb3;
					border-color: #bb6eb3;
				}
			/* iph only */
				.homepage h4#iph span,
				.homepage h4#iph img {
					background-color: #7c96d4;
					border-color: #7c96d4;
				}
			/* ch only */
				.homepage h4#ch span,
				.homepage h4#ch img {
					background-color: #98cb00;
					border-color: #98cb00;
				}
			/* ah only */
				.homepage h4#ah span,
				.homepage h4#ah img {
					background-color: #dd5611;
					border-color: #dd5611;
				}
			/* cwshcn only */
				.homepage h4#cwshcn span {
					background-color: #d24e6a;
					margin-bottom: -2.9rem;
				}
				@media (min-width: 1160px) {
					.homepage h4#cwshcn span {
						margin-bottom: -1.4rem;
					}
				}
				.homepage h4#cwshcn img {
					border-color: #d24e6a;
				}
				#cwshcn_bullying {
					margin-bottom: 3rem;
				}
			/* mpd only */
				.homepage h4#mpd {
					background-color: #8b62dd;
					border-color: #8b62dd;
				}
				.homepage #multiple-population-domains {
					background-color: #f4f4f4
				}
			/* key */
				.homepage #chart-npm #key {
					box-shadow: inset 4px 5px 18px -6px gray;
					float: left;
					margin: 1rem;
					width: 31rem;
					font-size: 1.4rem;
					line-height: 1.4rem;
					letter-spacing: .04rem;
					color: black;
					position: relative;
				    bottom: 23rem;
				}
				#key > span {
					color: white;
				}
				.homepage #key > div {
					padding: 0 1rem 1rem;
					display: flex;
					flex-flow: row;
					text-align: center;
					text-transform: uppercase;
				}
				.homepage #key span {
					margin: .5rem;
					display: flex;
					align-items: center;
				}
				#key div div span {
					color: black;
				}
				.homepage #key span img {
					width: 2rem;
					display: block;
					height: 2rem;
					margin: 0 1rem;
				}
				.homepage #key span strong {
					margin-right: .5rem;
				}
				.homepage #key > div > div {
					align-items: center;
					font-size: 1.1rem;
					border-radius: 1rem;
					display: flex;
					margin: .1rem;
					padding: .5rem;
					flex-direction: column;
				}
				.homepage #key > div img {
					width: 7rem;
				}
		/* SM chart */
			.homepage #chart-sm {
				overflow: hidden;
				margin: 0 auto;
				min-width: 810px;
			}
			@media (min-width: 862px) {
				.homepage #chart-sm {
					width: fit-content;
				}
			}
			.homepage .npm-header,
			.homepage .sm-header {
				color: white;
				width: 800px;
				margin: 0 auto;
			}
			@media (min-width: 1160px) {
				.homepage .npm-header,
				.homepage .sm-header {
					width: 1000px;
				}
				.homepage #chart-sm > div {
					width: 200px;
				}
			}
			.homepage #chart-sm > div {
				display: flex;
				flex-flow: column nowrap;
			}
			.homepage #chart-sm > div > a {
				background-color: white;
			}
			.homepage #chart-sm > div > div {
				display: flex;
			}
			#chart-sm #wmh_risk_appropriate_perinatal_care,
			#chart-sm #wmh_well_woman_visit {
				border: 3px solid white; /* previously #c177b9*/
			}
			#chart-sm #iph_cesarean_delivery,
			#chart-sm #iph_drinking_pregnancy,
			#chart-sm #iph_smoking {
				border: 3px solid white; /*previously #7190d3*/
			}
			#chart-sm #ch_vaccination,
			#chart-sm #ch_smoking {
				border: 3px solid white; /*previously #acd472*/
			}
			#chart-sm #ah_physical_activity,
			#chart-sm #ah_smoking {
				border: 3px solid white; /*previously #e78a5d*/
			}
			#chart-sm #mpd_cwshcn_uninsured,
			#chart-sm #mpd_cwshcn_adequate_insurance,
			#chart-sm #mpd_cwshcn_forgone_health_care {
				background-color: white;
				border: 3px solid #8b62dd;
				display: flex;
				align-items: center;:
			}
			/* Multiple Population Domains only */
				.homepage div div#multiple-population-domains {
					overflow: hidden;
					margin: .5rem;
				}
				.homepage h4#mpd {
					color: white;
					padding: .5rem;
					text-transform: uppercase;
					font-size: 1.4rem;
					width: 100%;
					line-height: 1.5rem;
				}
				@media (min-width: 1160px) {
					.homepage div div#multiple-population-domains {
						width: 20rem;
					}
				}
	/* Access Resources by Type (sidebar) */
		#resc-by-type h2 {
			color: white;
		}
		#resc-by-type {
			background-color: #326088;
			padding: .5rem;
		}
		#resc-by-type-inner-wrapper {
			display: flex;
			flex-flow: row wrap;
			justify-content: space-around;
		}
		#resc-by-type h2 {
			flex-basis: 100%;
		}
		#resc-by-type h4,
		#resc-by-type a {
			display: block;
			color: white;
			font-size: 1.4rem;
			line-height: 2rem;
		}
		#resc-by-type h4 {
			font-size: 1.6rem;
			font-weight: bold;
			margin: 1.6rem 0 0;
		}
		.indent-once {
			margin-left: 2rem;
		}
		.indent-twice {
			margin-left: 4rem;
		}
		@media (min-width: 1160px) {
			#resc-by-type {
				display: block;
				grid-column: 2;
				z-index: 10;
			}
			#resc-by-type-inner-wrapper {
				display: block;
				width: fit-content;
				margin: 0 auto;
			}
			#resc-by-type h4,
			#resc-by-type a {
				line-height: 2.3rem;
			}
		}
	.partners {
		margin-top: 0 !important;
	}
/*
**