@font-face {
	font-family: 'open_sansregular';
	src: url('../fonts/OpenSans-Regular-webfont.woff') format('woff'),url('../fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype');
}
@font-face {
	font-family: 'open_sansitalic';
	src: url('../fonts/OpenSans-Italic-webfont.woff') format('woff'),url('../fonts/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype');
	font-style: normal;
}
@font-face {
	font-family: 'open_sanslight';
	src: url('../fonts/OpenSans-Light-webfont.woff') format('woff'),url('../fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype');
	font-style: normal;
}
@font-face {
	font-family: 'open_sanslight_italic';
	src: url('../fonts/OpenSans-LightItalic-webfont.woff') format('woff'),url('../fonts/OpenSans-LightItalic-webfont.eot?#iefix') format('embedded-opentype');
	font-style: normal;
}
@font-face {
	font-family: 'open_sanssemibold';
	src: url('../fonts/OpenSans-Semibold-webfont.woff') format('woff'),url('../fonts/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype');
	font-weight: normal;
}
@font-face {font-family: 'quicksand-regular';src: url('../fonts/Quicksand-Regular.otf');}
@font-face {font-family: 'quicksand-bold';src: url('../fonts/Quicksand-Bold.otf');}

* {transition:background-color 0.3s;}
html,body, #bgImg {
	margin:0;
	padding:0;
	width:100%;
}
html {height:100%;}
body {
	font-family:'open_sansregular';
	height:100%;
}
#bgImg {
	background:#FFFFDD url(../images/piazzetta-med.jpg) no-repeat;
	background-position-x:50%;
	background-size:cover;
	min-height:100%;
	min-width:100%;
	z-index:-2;
	position:fixed;
}
#bodyContainer {
	background:linear-gradient(to right, #FEB,#FFC);
	background:linear-gradient(to right, #FEB,#FD83);
	background-size:cover;
	min-height:100vh;
	position:relative;
	display:flex;
	flex-flow:column;
	align-items:stretch;
	justify-content:space-between;
}

/*---------------------------Header & Navigation---------------------------*/
header h1 {
	font-family:'quicksand-regular';
	margin:0;
	overflow:hidden;
	padding:1px;
}
nav {
	float:right;
	margin-bottom:0.5em;
	width:100%;
}
nav ul, #hamburger {
	background:linear-gradient(#DDD,#CCC);
	background:linear-gradient(#DDD,#CCCA);
	margin:0;	
	overflow:hidden;
	padding:0;
	text-align:center;
}
nav li {
	float:left;
	list-style-type:none;
	margin:0;
	padding:0;
	width:16.6667%;
	/*5-page layout: change above line to 20%*/
}
nav ul a, #hamburger {
	border:1px #BA7;
	border-style:none solid;
	box-sizing:border-box;
	float:left;
	margin:0;
	padding:3em 0;
	text-decoration:none;
	width:100%;
}
nav ul a:hover {
	background-color:#777;
	background-color:#4447;
	color:#DC9;
}
#sealD {margin:.5em;}
#sealM {display:none;}
#otherHeader {
	display:flex;
	overflow:auto;
	width:100%;
	flex-flow:row;
	justify-content:space-between;
}
#hamburger {display:none;}
#headerText {
	display:inline-block;
	margin:0 0 0 1em;
}
#searchImg {
	float:right;
	height:3.5em;
	margin:1em 2em 0 2em;
}
#searchDiv {
	background:white;
	display:none;
	left:0;
	right:0;
	margin:auto;
	/*min-height:40vh;*/
	opacity:0;
	position:fixed;
	transition:all .4s;
	width:80%;
}
#searchX {
	height:1.5em;
	float:right;
	margin:1em 1.5em;
}

/*----------------------Main structural elements----------------------*/
.pldiv {
	box-sizing:border-box;
	padding:0;
	min-height:1em;
}
main, aside {
	background:#FFF;
	background:#FFFC;
	box-sizing:border-box;
	margin:1em 0 2em 0;
	padding:2em;
}
footer {
	background:linear-gradient(to top right,#FFF,#DDD);
	background:linear-gradient(to top right,#FFF,#DDDDDD66);
	width:100%;
}
footer p {
	margin:0;
	padding:0.5em;
}

/*-------------------------Non-structural elements-------------------------*/
figure {
	display:flex;
	flex-flow:column;
	justify-content:center;
	margin:1em;
}
figcaption {
	background:#555;
	color:white;
	font-size:10pt;
	padding:0.3em;
	text-align:center;
}
figure img {
	height:100%;
	width:100%;
}
figure img[alt="Pope Saint Pius the Fifth."] {
	filter:contrast(110%) brightness(120%);
	margin:0em;
}
img[alt="A portrait of St. Pius V, a bearded man holding a holy book and a letter."] {
	margin:0 1em 1em 0;
	max-width:12em;
}
h2 {margin:0;}
a, .link {
	color:#874;
	text-decoration:underline;
}
a:hover, .link:hover, .expandable:hover {text-decoration:none;}
.expandable {text-decoration:underline;}
.button {
	border:1px solid gray;
	color:black;
	cursor:pointer;
	display:inline-block;
	margin:0 .5em .5em 1em;
	padding:.5em .75em;
	text-decoration:none;
}
.button:hover span {border-bottom:1px solid black;}
.c {
	margin-left:auto;
	margin-right:auto;
	text-align:center;
}
#toTop {
	/*display:none;*/
	opacity:.5;
	position:fixed;
	right: 2em;
	bottom:2em;
	height:4.5em;
	width: 4.5em;
}
#toTop:hover {opacity:.8;}
#toTop img {height:100%;}

/*--------------------------Page-Specific Ruleset--------------------------*/
.essay {
	background:#EEE;
	display:none;
	margin-top:-1em;
	margin-bottom:1em;
	padding:.5em 1em;
}
.expander {
	background:#CCC;
	color:#9C8A75;
	margin:1em 0;
	padding:2em 0;
	text-align:center;
	text-decoration:underline;
	transition:background .5s;
}
.expander:hover {background:radial-gradient(#EEE,#DDD 80%) #DDD;}
#itemLecture {
	width:56vw;
	margin:auto;
}
#itemLecture iframe {
	border:none;
	margin:auto;
	height:31vw; 
	width:100%;
	display:block;
}
#lectureSelect {
	border:none;
	background:#555;
	color:#CCC;
	display:block;
	padding:.75em;
}
#newsBox {white-space:pre-wrap;}

/*-------------------------Responsive Design Setup-------------------------*/
.col-s {width:4.17%;}
.col-1 {width:8.33%;}
.col-1s {width:12.5%;}
.col-2 {width:16.66%;}
.col-2s {width:20.83%;}
.col-3 {width:25%;}
.col-4 {width:33.33%;}
.col-5 {width:41.66%;}
.col-6 {width:50%;}
.col-7 {width:58.33%;}
.col-8 {width:66.66%;}
.col-9 {width:75%;}
.col-10 {width:83.33%;}
.col-11 {width:91.66%;}
.col-12 {width:100%;}
[class*="col-"] {float:left;}
.row {
	background:#FFF;
	background:#FFFA;
	margin:2em auto;
}
.row::after, header::after {
	clear:both;
	content:"";
	display:table;
}
/*------------------------------Media Queries------------------------------*/
@media only screen and (max-width:1024px) {
	#sealD {display:none;}
	#sealM {
		display:inline;
		margin:0 1em 0 0;
	}
	main.col-7 {width:91.66%;}
	figure.col-2s {
		clear:both;
		float:none;
		margin:0 auto 1em auto;
		width:33.33%;
	}
	#headerText {padding:1em;}
	/*img[alt="A portrait of St. Pius V, a bearded man holding a holy book and a letter."] {margin:1em;}*/
	img.col-1s {width:25%;}
}
@media only screen and (max-width:680px) {
	#toTop, #hamburger {display:block;}
	nav ul {display:none;}
	nav li {width:100%;}
	nav ul a, #hamburger {
		padding:1em 0;
		border:1px #BA7;
		border-style:none none solid none;
	}
	figure.col-2s {width:50%;}
	#headerText {margin:1em;}
	#itemLecture {width:84vw;}
	#itemLecture iframe {height:46.5vw;}
	#lectureSelect {
		font-size:9pt;
		max-width:90vw;
		padding:1em;
	}
	#otherHeader {display:block;}
	#searchImg {
		display:block;
		height:3em;
		margin:0 2em;
	}
}
@media only screen and (max-width:450px) {
	#headerText {
		background:#FFF;
		background:#FFFA;
	}
	header h1 {font-size:18pt;}
	#sealM {
		display:block;
		float:none;
		margin:auto;
		width:33.33%;
	}
	img.col-1s {
		display:block;
		text-align:center;
		width:41.66%;
	}
	#searchImg {
		float:none;
		margin:0 auto;
	}
}