@charset "utf-8";

html, body {
	margin: 0;
	padding: 0;
	text-align: center;
}

body{
	background-color: white;
}
header {
	height: 245px;
	background-color: rgba(20,22,158,1.00);
	color: white;
}
header img {
	position: absolute;
	left: 0;
	top: 0;
}
.cormorant{
	font-family: 'Cormorant', sans-serif !important;  
	/* why is my type family coming out with curved edges instead of sharp? */
}
header h1 {
	font-size: 900%;
	text-align: left;
	margin: 0px 0px -15px 300px;
}
header nav {
	height: 200px;
	background-color: rgba(19,83,172,1.00);
	
}
header nav ul{
	float: center;
	margin-right: 10px;
	margin-bottom: 10px;
	
}
header nav ul li{
	display: inline-block;
	line-height: 70px;
	margin: 0 30px;
	position: relative;
}
header nav ul li ul{
	flex-direction:column;
	border-left:none;
	border-righ: none;
	background-color: white;
	position: absolute;
	width: 50%
}
.Noto-Sans{
	font-family: 'Noto Sans', sans-serif;
}
header nav ul li ul li{
	border-top: 4px rgba(255,215,0,1.00);
	border-right: 5px rgba(255,215,0,1.00);
}

header nav ul li:hover ul {
	display:block;
}

header nav ul li a{
	color: gold;
	font-size: 2rem;
	padding: 7px 13px;
	border-radius: 3px;
	text-transorm: uppercase;             
	text-decoration: none;
}
header nav ul li ul li:last-child{
	border-bottom: 2px rgba(255,215,0,1.00);
}

nav ul li:hover ul {
	display:block;
}

a.active,a:hover{
	background: rgba(15,12,120,1.00);
	transition: .5s;
}

section {
	display: flex;
}

.Raleway {
	font-family: 'Raleway', sans-serif;
}
aside {
	width: 300px;
	height: 237vh;
	background-color: rgba(20,22,158,1.00);
}

.image-stack {
	width: 650px;
	height: 117vh;
	background-color: white;
}
.image-stack img {
	width: 100%;                 /* how do i move everything down for the nav bar to have more room?  */
	height: auto;    /*rescales images */
}
.text {
	height: 100vh;
	width: 40%;
	padding: 20px;
	background-color: white;
	text-align: left;
}
aside nav ul {
	margin: 150px auto;
	display: block;
	padding: 0px;
	width: 235px;
	
}
aside nav ul li {
	display: block;
	margin-top: 20px;
}
aside nav ul li a {
	display: block;
	width: 225px;
	color: white;
	font-size: 2rem;
	text-decoration: none;
	font-weight: bold;
	border-radius: 20px;
	padding: 50px 5px;
}
.publications {
	background-color: red;
}
.exhibitions {
	background-color: gold;
}
.quicklinks {
	background-color: deepskyblue;
}
