/* CSS for course catalog */
/* Copied from https://uakron.edu/cba/undergraduate/majors/ */

/*TOP BANNER*/
.banner-top {
	display: grid;
	grid-template-columns: auto;
	grid-template-rows: 1fr auto;
	max-width: 500px;
	margin: 1vh auto 1vh auto;
}
.banner-bg-color {
	grid-column: 1;
	grid-row: 2/3;
	background-image: url(https://www.uakron.edu/global/images/brand/dark-blue-texture.jpg?=new);
	border-radius: 4px;
}
/* banner-text may not be necessary */
.banner-text {
	grid-column: 1;
	grid-row: 2/3;
	padding: 36px;
}
.banner-bg-color h2 {
	font-family: 'prohibition';
	color: white;
	text-align: center;
	font-size: 2.2rem;
	line-height: 1.;
}
.banner-bg-color p {
	color: white;
}
.student-photo {
	grid-column: 1;
	grid-row: 1/2;
}

@supports (grid-area: auto) {
@media screen and (min-width: 900px) {
	.banner-top {
		display: grid;
		grid-template-columns: repeat(20, minmax(10px, 1fr));
		grid-template-rows: 0% 1fr 1fr 1fr 1fr 0%;
		height: 350px;
		max-width: none;
	}
	.banner-bg-color {
		grid-column: 1/20;
		grid-row: 4/5;
		background-image: url(https://www.uakron.edu/global/images/brand/dark-blue-texture.jpg?=new);
		display: grid;
		grid-template-columns: repeat(10, 1fr); /* hide this row to make images same width as labels */
		grid-template-rows: auto;
		z-index: 2;
	}
	/* banner-text may not be necessary */
	.banner-text {
		grid-column: 1/20;
		display: flex;
		align-items: center;
		flex-direction: column;
		padding: 18px;
	}
	.banner-text h2 {
		font-size: 1.3rem;
	
	}	
	.banner-image {
		grid-column: 2/19;
		grid-row: 2/5;
		overflow: hidden;
		object-fit: cover;
		object-position: 50% 0%;
	}
	.banner-bg-color p {
		max-width: 46ch;
		margin-bottom: 15px;
	}
}