/* Dangrek and Inter */
/* @import url('https://fonts.googleapis.com/css2?family=Dangrek&family=Inter:opsz,wght@14..32,100..900&display=swap'); */


/* Bungee, Bungee Hairline, Inter
@import url('https://fonts.googleapis.com/css2?family=Bungee&family=Bungee+Hairline&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
 */
 

/* Inter (Variable):
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
*/

/* Figtree */
@import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&display=swap');


/*
Bungee:
@import url('https://fonts.googleapis.com/css2?family=Bungee&display=swap');
*/


/*
// <uniquifier>: Use a unique and descriptive class name
// <weight>: Use a value from 100 to 900

.inter-<uniquifier> {
  font-family: "Inter", serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
*/

.shimapublications {
	display: none;
}
html {
	font-size: 18px;
	line-height: 1.4em;
	--bold: 500;
}

strong {
	font-weight: 600;
}

body {
	margin: 0px;
	min-height: 100vh;
	font-family: Figtree, Inter, system-ui, Helvetica, sans-serif;
	background-image: url("images/Pannak-Lindley-Point-Edge.jpg"), url("images/Kelp Island.jpg");
	background-position: center center;
	background-size: cover;
	background-attachment: fixed;
}

body.publications {
	background-image: url("images/Kelp Island.jpg"), url("images/Pannak-Lindley-Point-Edge.jpg"); /* linear-gradient(red, transparent),  */
	color: white;
}

body.publications h2,
body.publications a {
	color: currentColor;
}

body.publications section > ul {
/* 	margin: 0px; */
/* 	padding: 0px; */
	list-style-type: square;
}

header.shimapublications {
	text-shadow: 1px 2px 4px rgba(0, 0, 0, 0.25);
}


#shimaqua {
/* 	background-color: rgba(255, 255, 255, 0.75); */
/*	padding: 20px;*/
	color: black;
/* 	font-size: 15px; */
}

#shimaqua > p:first-child {
	margin-top: 0px;
}

#publications {
	background-color: rgba(255, 255, 255, 0.9);
	padding: 20px;
	color: black;
	font-size: 15px;
}

#publications h2:first-child {
	margin-top: 0px;
}


body .artwork {
	transition: 0.5s all;
}

body.publications .artwork {
	opacity: 0;
}


hr {
	margin: 2rem 0;
	border: none;
	border-top: 1px solid #212121;

}

.font-400 {
	font-weight: 400;
}
.font-500 {
	font-weight: 500;
}
.font-600 {
	font-weight: 600;
}
.font-700 {
	font-weight: 700;
}


main {
	display: grid;
/* 	grid-template-columns: 75% 25%; */
	grid-template-columns: 65% 35%;
/* 	gap: 25%; */
	min-height: 100vh;

}

main a {
	color: #071926;
	font-weight: 600;
	border-bottom: 2px dotted #373830;
	text-decoration: none;
}

main #sidebar a {
	border-bottom: none;
}


nav {
	display: flex;
	flex-flow: row wrap;
	display: none;
}

main nav a {
	flex: 1 0 auto;
	background-color: rgba(0, 0, 0, 0.7);
	color: white;
	padding: 1em;
	text-decoration: none;
}

main nav a.active,
main nav a.active:hover {
	background-color: rgba(0, 0, 0, 0.9);
}

main nav a:hover {
	background-color: rgba(0, 0, 0, 0.8);
}

main > section {
	box-sizing: border-box;
	padding: 50px;
/* 	display: grid; */
/* 	align-content: center; */
/* 	background-color: #ffffff22; */
}


main > section#content  {
	padding-right: 25%;
/* 	background-color: rgba(255, 255, 255, 0.125); */
}

header h1 {
/*	display: grid;*/
	line-height: 100%;
	margin: 0px;
	margin-bottom: 60px;
}

header h2 {
	color: dimgray;
}


main > section#sidebar {
	color: white;
/* 	position: sticky; */
/* 	top: 2rem; */
	font-size: 0.85rem;
/* 	align-self: start; */
/* 	-webkit-backdrop-filter: blur(8px); */
}







#sidebar {
	text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.8);
	text-align: right;
	min-height: 100vh;
}

#sidebar .sidebar {
	position: sticky;
	top: 10vh;
	min-height: 80vh;
/* 	background-color: pink; */
	display: flex;
	flex-direction: column;
}

#sidebar .sidebar footer,
footer {
/* 	margin-top: 4rem; */
	margin-bottom: auto;
	display: grid;
/* 	border-top: 1px solid black; */
/* 	padding: 1rem 0; */
}


#sidebar dl {
	margin: 0px;
}

#sidebar dl.artwork {
	margin-top: 2em;
}


#sidebar dd {
	margin-inline-start: 0px;
	font-weight: 400;
/* 	font-size: 75%; */
	font-size: 0.8rem;
	line-height: 1.15em;
	margin-bottom: 0.67rem;
	display: grid;
	justify-items: end;
}

#sidebar dd.editorial-collective {
	font-size: 1rem;
}

#sidebar dd .affiliation {
/* 	font-weight: 200; */
	font-size: 0.67rem;

}


#sidebar dd strong {}

#sidebar dd a  {
	text-decoration: none;
	font-weight: inherit;
}


#sidebar dt {
	margin-top: 3.5rem;
	margin-bottom: 0.5rem;
	font-weight: 500;
	font-size: 1.25rem;
}

#sidebar dt:first-child {
	margin-top: 0;
}

#sidebar a {
	color: white;
}


blockquote {
	background-color: #ffffffaa;
	margin: 0px;
	padding: 1rem 2rem;
	border-radius: 4px;
	font-size: 0.85rem;
	line-height: normal;
	border: 1px solid rgba(0, 0, 0, 0.75);
}

h1 {
	font-size: 3em;
/* 	font-weight: 800; */
/* 	font-family: Inter, sans-serif; */
	text-transform: uppercase;
	font-weight: 600;
	color: #373830;
	letter-spacing: -2px;
}

dt {
/* 	font-family: "Bungee", "Bungee Hairline", Inter, sans-serif; */
}

h1 .kanji {
	font-weight: 700;
}

h2, h3, h4, h5, h6 {
	font-weight: 500;
}

h1, h2, h3, h4, h5, h6 {
}


h1:has(+ p) { /*M , h2:has(+ p) */
	margin-top: 2em;
	margin-bottom: 1em;
}

h1 + p,
h2 + p {
	margin-top: 0px;
}

h1:has(+ h2) {
/* 	margin-bottom: 0px; */
	line-height: 1.4em;
}

h1 + h2 {
	margin-top: 0px;
	line-height: 1.4em;
}


@media screen and (max-width: 1440px) {

/*	main {
		grid-template-columns: 50% 25%;
		gap: 25%;
	}
*/
}

@media screen and (max-width: 1280px) {

	main {
		grid-template-columns: 65% 35%; /* 50 35 */
/* 		gap: 15%; */
	}



	#sidebar {
		background-color: rgba(0, 0, 0, 0.5);
	}

}