/*Global*/
body, html {
    height:100%;
	width:100%;
	margin:0px;
	padding:0px;
	font-size:100%;
	background-color:white;
	color:black;
	text-align:left;}
h1 {
	font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;
	font-style:normal;
	font-variant:normal;
	font-weight:500;
	font-size:6vw;
	line-height:1.1;
	margin:auto 0;
	text-align:left;}
h2 {
	font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;
	font-style:normal;
	font-variant:normal;
	font-weight:500;
	font-size:5vw;
	line-height:1.1;
	margin:auto 0;
	text-align:left;}
h3 {
	font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;
	font-style:normal;
	font-variant:normal;
	font-weight:500;
	font-size:4vw;
	line-height:1.1;
	margin:auto 0;
	text-align:left;}
h4 {
	font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;
	font-style:normal;
	font-variant:normal;
	font-weight:500;
	font-size:3vw;
	line-height:1.1;
	margin:auto 0;
	text-align:left;}
h5 {
	font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;
	font-style:normal;
	font-variant:normal;
	font-weight:500;
	font-size:2vw;
	line-height:1.1;
	margin:auto 0;
	text-align:left;}
p {
	font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;
	font-style:normal;
	font-variant:normal;
	font-weight:500;
	font-size:1.5vw;
	line-height:1.1;
	text-align:left;}

ul,li {
	font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;
	font-style:normal;
	font-variant:normal;
	font-weight:500;
	font-size:1.5vw;
	line-height:1.1;
	text-align:left;}

a {
	color:crimson;
	text-decoration:none;
	font-size:1.5vw;}

table {
	width:100%;
	margin:0 auto;
	border-collapse:collapse;
	text-align:center;}

th {
	font-size:1.5vw;
	padding:5px;
	border:1px solid black;
	background-color:black;
	color:white;}

td {
	font-size:1vw;
	border:1px solid black;}

tr:nth-child(odd) {
	background-color:rgb(235, 235, 235);}

table a {
	text-decoration:none;
	color:royalblue;
	font-size:1vw;}
hr {width:80vw;}

/*Navigation*/
.navigation {
	display:flex;
	top:0;
	height:10vh;
	width:100vw;
	align-items: center;
	justify-content: center;
	transition:background-color 1s;
	background-color:white;
	color:black;}
.navigation a{
	color:black;
	padding:1vw;
	transition: border-bottom 500ms;
	border-bottom:  1px solid transparent;}
.navigation a:hover{
	border-color: black;
	background-color:#1D1E23;}
.navigation:hover {
	background-color:#1D1E23;}
.navigation:hover a{
	color:white;}
.nav-inner-left {
	width:60vw;}
.nav-inner-right {
	width:30vw;
	text-align:right;}

/*Content Blocks*/
.content {
	display:block;
	width:80vw;
	margin:0 auto;
	padding:1vh 1vw 1vh 1vw;}
#chart{
	width:50vw;
	margin:0 20% 0 20%;
	
}

/*Homepage*/
.homepage {
	display:block;
	width:100vw;
	height:100vh;
	background-color:white;}
.homepage-inner {
    display:block;
    width:100%;
    text-align: center;}
.homepage-inner figure {
	width:30%;
	margin:0 auto;
	position: absolute;
	top: 60%;
	left: 50%;
	transform: translate(-50%, -60%);
	padding:20px;
	border:solid;}
.homepage-inner figcaption {
	font-size:2vw;
	background-color:black;
	color:white;}
.homepage-inner img {width:100%;}

/*Whole Page*/
.wholepage {
	display:block;
	width:100vw;
	height:100vh;
	background-color:white;}
.wholepage-inner h1{
	display:block;
    width:100%;
	margin:0 auto;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
    text-align: center;}

/*Library*/
.library {
	display:block;
	width:90vw;
	min-width:0;
	margin:0 auto;
	padding:1vh 1vw 1vh 1vw;}
.library hr {width:70vw;}
.library-block {
	display:flex;
	width:70vw;
	margin:50px auto;
	min-width:0;
	height:25vh;}
.library-photo {
	width:40vw;}
.library-photo img {
	width:100%;
	height:100%;
	object-fit:cover;}
.library-text {
	height:100%;
	width:100%;
	min-width:0;
	margin:0;
	padding:0 0 0 5%;
	vertical-align: top;}
.library-text * {
	display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;}
.library-text a {
	font-size:4vh;
	text-decoration:none;
	color:crimson;}
.library-text p {
	font-size:3vh;}

/*About Page*/
.about {
	display:block;
	width:80vw;
	margin:0 auto;
	padding:1vh 1vw 1vh 1vw;}
.about-inner {
    display:block;
    width:100%;
    text-align: center;}
.about-inner figure, .about-inner p{width:60%;margin:0 auto;}
.about-inner img {width:100%;}
.about h3 {text-align: center;}

.two-column {
	display:flex;
	width:80vw;
	margin:0 auto;}
.column {
	width:50%;
	padding:2%;
	font-size:2vw;
	text-align:center;}
.column img {
	width:100%;}

.youtube {
	position:relative;
	padding-bottom:56.25%;
	margin:2% auto 2% auto;}
.youtube iframe {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;}

/*Form*/
.formstyle {
	width:50vw;
	border:1px solid;
	padding:20px;
}
.formstyle input {
	border:1px solid;}

/*Photo*/
.Photo {
	display:flex;
	width:100%;
	flex-wrap: wrap;}
.Photo img {
	flex-grow:1;
	display:block;
	object-fit:cover;
	max-height:30%;
	width:30%;
	padding:5px;}

/*Footer*/
.footer {
	display:flex;
	margin-top:5%;
	position:static;
	bottom:0;
	height:auto;
	width:100vw;
	padding:1vh;
	align-items: center;
	justify-content: center;
	background-color:#1D1E23;
	color:#ffffff;}
.footer a{
	color:white;
	padding:1vw;
	transition: border-bottom 500ms;
	border-bottom:  1px solid transparent;}
.footer a:hover{border-color: white;}
.f-left {
	width:33vw;
	text-align: center;}
.f-center {
	width:33vw;
	text-align: center;}
.f-right {
	width:33vw;
	text-align: center;}
.f-left *{text-align: center;}
.f-center *{text-align: center;}
.f-right *{text-align: center;}

/*Lightbox*/
#Photo {
	display: none;
    z-index:800;
	position:fixed;
	left:0;
	top:0;
    width:100%;
    height:100%;
	background-color:rgba(0,0,0,.9);
    text-align:center;}
#PhotoImage {
	padding:10%;
	z-index:900;
	max-height: 70%;
	max-width: 70%;}