/*------------ PublicCONNECT Page CSS ------------*/

/*------ Hero Header ------*/
#pc-hero {
	background: rgb(18,0,12);
	background: linear-gradient(70deg, rgba(18,0,12,1) 0%, rgba(18,0,12,1) 30%, rgba(89,0,64,0.05) 100%), url("../images/banners/bv-inner-hero-bg-PublicConnect.jpg") no-repeat center center /cover;
}
.pc-mid h3 {
	margin-top: 1.625rem;
}

/*------ Grey Section ------*/

#pc-grey-list {
	display: grid;
	grid-template-columns: repeat(2, 45%);
	max-width: 100%;
	text-align: left;
	justify-content: space-between;
}
.grey-section span {
	margin-bottom: 5rem;
}
.grey-section h4 {
	margin-bottom: 0.8rem;
}
.grey-section p {
	padding-left: 3.5rem;
	margin: 0;
}
.pc-grey-section-btn {
	grid-column: span 2;
	margin-top: -1.375rem;
}
.pc-grey-section-btn .purple-btn {
	  margin-bottom: 2.625rem;
}

/*------------ Responsive ------------*/

/* RETINA */
@media (-webkit-min-device-pixel-ratio: 2),(-moz-device-pixel-ratio: 2), (min-resolution: 192dppx) { 
	#pc-hero {
		background-image:  linear-gradient(70deg, rgba(18,0,12,1) 0%, rgba(18,0,12,1) 30%, rgba(89,0,64,0.05) 100%), url("../images/banners/bv-inner-hero-bg-PublicConnect@2x.jpg");
	}
}

/* max-width: 992px */
@media (max-width: 992px) {
	#pc-grey-list {
		grid-template-columns: repeat(1, 100%);
		row-gap: 1rem;
	}	
	.grey-section span {
		margin-bottom: 2rem;
	}
	.pc-grey-section-btn .purple-btn {
		margin-top: 3rem;
	}
}

/* max-width: 600px */
@media (max-width: 600px) {	
	.inner-hero {
		background-position: 70% center !important;
	}
}
/* max-width: 560px */
@media (max-width: 560px) {	
	.product-logo {
		width: 80%;
	}
}
/* max-width: 480px */
@media (max-width: 480px) {	
	.inner-hero {
		background-position: 80% center !important;
	}
}