/*HEADER*/

header	{
	border-bottom: none;
	padding-bottom: 25%;
	background-size: 25%;
	background-position: 1rem 0;
}	

#title	{
	width: 60%;
	top: 30%;
	left: 20%;
}	

/*NAVIGATION*/

/*HAMBURGER*/

.hamburger {
	height: 18px;
	width: 1.5rem;
	top: 1.5rem;
	right: 1.5rem;
}

.stripe	{
	width: 1.5rem;
	height: 3px;
}

.stripe-2 {
	top: 8px;
}

.stripe-3 {
	top: 16px;
}	
	
/*TOP NAVIGATION*/
	
#menu nav 	{
	width: 92%;
	margin-top: 1rem;
	margin-bottom: -1.5rem;
}


/*FOOTER NAVIGATION*/

#content ~ nav 	{
	width: 70%;
	margin-left: 15%;
	
	-webkit-column-count: 2; /* Chrome, Safari, Opera */
	-moz-column-count: 2; /* Firefox */
	column-count: 2;
	
	-webkit-column-gap: 2rem; /* Chrome, Safari, Opera */
	-moz-column-gap: 2rem; /* Firefox */
	column-gap: 2rem;
}


/*CONTENT*/

#panel	{
	margin: 2rem auto 0;
	width: calc(92% - 3rem);
	padding: 1.5rem;
	
}

figure.portrait, figure.landscape	{
	float: right;
	width: 50%;
	margin: 0 0 1rem 1rem;
}

/*ARTIFACTS*/

.six	 {
	-webkit-column-count: 3; /* Chrome, Safari, Opera */
	-moz-column-count: 3; /* Firefox */
	column-count: 3;
	
	margin-bottom: -1rem;
}

.four li	{
	margin-bottom: 3rem;
}

/*ZOOM*/

.object	{	
	width: 80%;
	margin: 0 auto 4rem;
}	

/*COLOR QUIZ*/

	
.flip-container {
	float: left;
	width: 45%;
	padding-bottom: 45%;
	
}

.flip-container:nth-child(odd)	{
	margin-right: 10%;
}	

/*GALLERY VIEWS*/

#views figure	{
	float: left;
	margin-top: 2rem;
	margin-bottom: 2rem;
}

#views .tall	{
	width: 28%; 
	margin-right: calc(8% - 3px);
}

#views .tall:nth-child(3n)	{
	margin-right: 0;
}

#views .wide	{
	width: 45%; 
	margin-right: calc(10% - 4px);
}

#views .wide:nth-child(odd)	{
	margin-right: 0;
}

/*COLOR MAP*/

#circles	{
	max-width: 40rem;
}

.map section	{
	clear: both;
}
	
.map ul	{
	margin-left: 2rem;
	clear: none;
}	

.raw {
	width: 30%;
	margin-left: 2rem;
	margin-bottom: 2rem;
	margin-right: 0;
	float: right;
}

.raw figure	{
	float: none;
	width: 100%;
	
}	

.raw figure:first-child	{
	margin-right: 0;
	margin-bottom: 2rem;
}	

.narrow, .very_narrow	{
	padding-left: 15%;
	padding-right: 15%;
}

.narrow .close, .very_narrow .close	{
	right: 5%;
}


/*FOOTER*/

footer	{
	border-top: none;
}