@media screen
{
	.page-header
	{
		background-color:rgb(127,182,190) !important;
		background-image:url(/assets/covers/Hutchins_School_Magazine_covers.jpg) !important;
		background-position:50% 50% !important;
		background-size:cover;
	}
}

@supports (display:grid)
{
	@media screen and (min-width:960px)
	{
		.page-header .panel::before
		{
			align-self:end;
			background:url(179_years_combo_russet.svg) no-repeat scroll 0 100%;
			background-size:auto 100%;
			content:'';
			display:block;
			grid-column:7/-1;
			grid-row:-2/-1;
			height:15.25rem;
			margin:0 0 0 -2.5rem;
		}
	}
}

@supports (display:grid)
{
	@media screen and (min-width:1820px)
	{
		h1.extend-left
		{
			margin-left:calc(50% - 910px);
		}
	}
}

@media screen
{
	.page-main
	{
		padding-bottom:5rem;
	}
}

@media screen and (min-width:960px)
{
	.page-main
	{
		background:white url(william_hutchins.svg) no-repeat scroll left 50% bottom -2rem;
		background-size:138.5rem auto;
		padding:0 0 15.25rem;
	}

	
}

.panel-1
{
	padding-top:0.65rem;
}

@media print
{
	.panel-1
	{
		display:block;
		margin:0;
	}
}

.panel-1 h2
{
	grid-column:2/-2;
}

.panel-1 p
{
	grid-column:2/-2;
}

.panel-1 p.feature
{
	padding-bottom:0.65em;
}

.panel-2 h2{padding-bottom:0;font-size:3rem;}
.magazines-index-container
{
	
	grid-column:2/-2;
}


ul.magazines-index
{
	margin:0;
	padding:4.2rem 0;
}

@media print
{
	ul.magazines-index
	{
		padding:1.5rem 0;
	}
}

ul.magazines-index li
{
	border-top:2px solid rgb(217,217,217);
	margin:0;
	padding:0;
	position:static;
}

ul.magazines-index li::before
{
	content:'';
	display:none;
}

.magazines-index li>a
{
	display:block;
	margin:-2px -1rem;
	padding:2px 1rem;
	position:relative;
}

@media print
{
	.magazines-index li>a
	{
		margin:0;
		padding:0;
	}
}

.magazines-index li>a,.magazines-index li>a:link,.magazines-index li>a:visited
{
	color:currentColor;
	text-decoration:none;
}

.magazines-index li>a:focus,.magazines-index li>a:hover,.magazines-index li>a:active
{
	color:currentColor;
	text-decoration:underline;
	background-color:rgb(242,242,242);
}

.magazine-filesize
{
	text-transform:lowercase;
	color:rgb(165,165,165);
}


.magazines-section
{
	break-inside:avoid;
}






article.magazine
{
	display:grid;
	grid-row-gap:0;
	row-gap:0;
	grid-column-gap:1rem;
	column-gap:1rem;
	grid-template-columns:min-content 1fr;
	grid-template-areas:"numb name";
	align-items:baseline;
	padding:0.5rem 0 1.15rem;
}

.special-edition article.magazine
{
	grid-template-areas:"name name";
}

@media screen and (min-width:960px)
{
	article.magazine
	{
		grid-template-columns:repeat(12,1fr);
		grid-template-areas:"numb numb name name name name name name name name name name";
	}
	
	.special-edition article.magazine
	{
		grid-template-areas:"name name name name name name name name name name name name";
	}
}

article.magazine>.magazine-number
{
	font-family:sofia-pro, sans-serif; 
	font-weight:700;
	/*font-size:1.5rem;*/
	font-size:1.2rem;
	line-height:1.2;
	grid-area:numb;
	margin:0;
	padding:0;
}

@supports (display:grid)
{
	article.magazine>.magazine-number
	{
		font-weight:400;
	}
}

@media screen and (min-width:960px)
{
	article.magazine>.magazine-number
	{font-size:1.5rem;
		/*font-size:2rem;*/
	}
}

article.magazine h3
{
	/*font-size:1.5rem;*/
	font-size:1.2rem;
	font-weight:400;
	line-height:1.2;
	grid-area:name;
	margin:0;
	padding:0;
}

@media screen and (min-width:960px)
{
	article.magazine h3
		font-size:1.5rem;
		line-height:1.2;
	}
}