@import url("https://use.typekit.net/wsy0jfd.css");

/*
font-family: arno-pro-display, serif;
font-family: arno-pro-subhead, serif;
font-family: arno-pro, serif;
font-family: arno-pro-small-text, serif;
font-family: arno-pro-caption, serif;
*/

/* VARIABLES */

:root {
	--white:      #ffffff;
	--black:      #303030;
	--blue:       #0074bb;
	--red:        #f14d1c;
	--light-gray: #bbbbbb;
	--selection:  #e4e4e4;
	--gray-1:     #f7f7f7;
	--gray-2:     #e0e0e0;
	--gray-3:     #bebebe;
  }


/* GLOBAL */

* {
	box-sizing: border-box;
}


body {
	font-family: arno-pro, serif;
	font-weight: 400;
	line-height: 1.2em;
	color: var(--black);
	background-color: var(--white);
	padding: 6vw;
	max-width: 90rem;
	margin: 0 auto;

	-webkit-font-feature-settings:
	"kern" 1, "clig" 1, "liga" 1, "pnum" 1, "onum" 1;
	
	-moz-font-feature-settings:
	"kern" 1, "clig" 1, "liga" 1, "pnum" 1, "onum" 1;
	
	-ms-font-feature-settings:
	"kern" 1, "clig" 1, "liga" 1, "pnum" 1, "onum" 1;
	
	font-feature-settings:
	"kern" 1, "clig" 1, "liga" 1, "pnum" 1, "onum" 1;

}

	@media only screen and (min-width: 0px) and (max-width: 768px) {
		body {font-size: 1.4rem;}
	}

	@media only screen and (min-width: 769px) and (max-width: 1024px) {
		body {font-size: 1.5rem;}
	}

	@media only screen and (min-width: 1025px) and (max-width: 1440px) {
		body {font-size: 1.4rem;}
	}

	@media only screen and (min-width: 1441px) and (max-width: 1920px) {
		body {font-size: 1.5rem;}
	}

	@media only screen and (min-width: 1921px) and (max-width: 2560px) {
		body {font-size: 1.6rem;}
	}




nav {
	padding: 6vw 0 0 0;
	flex-grow: 1;
	border-top: 1px solid var(--gray-2);
}

nav ul {
	column-count: 2;
	line-height: 2.1rem;
}

.sidebar {
	padding: 0 0 4rem 0;
}

	#portrait-1 {
		margin-top: 10vw;
		align-self: flex-end;
	}

	#portrait-2 {
		display: none;
	}

section {
	padding-top: 4rem;
	padding-bottom: 4rem;
	column-count: 0;
}

	section.curriculum-vitae div {
		display: flex;
		flex-wrap: nowrap;
	}

	section.curriculum-vitae div p:first-of-type {
		min-width: 2.5rem;
		letter-spacing: .03rem;
	}

	section.curriculum-vitae p:last-of-type {}

		section.curriculum-vitae div.gallery {
			display: block;
			margin: 0 0 2.5rem 2.5rem;
		}

		section.curriculum-vitae div.gallery img {
			margin: 0 0 .9rem 0;
		}

		section {
			padding-top: 6vw;
		}

		section:last-of-type {
			padding-bottom: 0rem;
		}

	.bonus { display: none; }

	.site-credit {
		margin: 0 0 0 0;
		position: absolute;
		padding-bottom: 2rem !important;
	}

	img#printers-mark-a {
		display: block;
		margin: 3rem auto 4rem auto;
		width: 45% !important;
		max-width: 15rem !important;
		position: relative;
		left: -1.5%;
		z-index: -1;
	}

	img#printers-mark-b {
		display: none;
	}


::selection {
	background-color: var(--gray-2);
	color: var(--black);
	}
	
::-moz-selection {
	background-color: var(--gray-2);
	color: var(--black);
	}








/*  T Y P O G R A P H Y  */


h1, h2 {
	text-transform: uppercase;
	letter-spacing: .2em;
	padding-bottom: 1.8rem;
	line-height: inherit;

	-webkit-font-feature-settings:
	"kern" 1, "clig" 1, "liga" 0, "pnum" 1, "onum" 1;
	
	-moz-font-feature-settings:
	"kern" 1, "clig" 1, "liga" 0, "pnum" 1, "onum" 1;
	
	-ms-font-feature-settings:
	"kern" 1, "clig" 1, "liga" 0, "pnum" 1, "onum" 1;
	
	font-feature-settings:
	"kern" 1, "clig" 1, "liga" 0, "pnum" 1, "onum" 1;
}

	h1 { padding-bottom: 1.2rem; }	
	section.curriculum-vitae h2 { padding-left: 2.5rem; }

h3 {
	font-variant: small-caps;
	text-transform: lowercase;
	letter-spacing: .2em;
	margin: 0 0 1em 0;
}

p      { padding-bottom: 1.8rem;}
strong { font-weight: 700;}
em     { font-style: italic;}
i      { 
		-webkit-font-feature-settings: "c2sc" 1, "case" 1, "smcp" 1, "onum" 1;
		-moz-font-feature-settings:    "c2sc" 1, "case" 1, "smcp" 1, "onum" 1;
		-ms-font-feature-settings:     "c2sc" 1, "case" 1, "smcp" 1, "onum" 1;
		font-feature-settings:         "c2sc" 1, "case" 1, "smcp" 1, "onum" 1;
}

.sc {
	-webkit-font-feature-settings: "smcp" 1;
	-moz-font-feature-settings:    "smcp" 1;
	-ms-font-feature-settings:     "smcp" 1;
	font-feature-settings:         "smcp" 1;	
}

ul.specializations li {
	padding-left: .75em;
	text-indent: -.925em;
}

	ul.specializations li:before {
		content: "\25c6";
		padding-right: .75rem;
	}


.callout {
	font-family: arno-pro-subhead, serif;
	font-weight: 400;
	font-size: 2rem !important;
	line-height: 1.1em;
}

.caption {
	font-size: 1.0rem;
	line-height: 1.2em;
	text-align: left !important;
}








/* LINKS */

a {
	color: var(--black);
	text-decoration: underline;
	text-underline-offset: .05em;
	text-decoration-thickness: 0.05em;
}

a:link {color: var(--black); }
a:visited {color: var(--black); }
a:hover {color: var(--red); }
a:active {color: var(--black); }

	.sidebar h1 a {
		text-decoration: none !important;
	}

	.sidebar nav a {
		text-decoration: none !important;
		-webkit-transition: padding-left 0.09s ease-out;
		-moz-transition: padding-left 0.09s ease-out;
		-o-transition: padding-left 0.09s ease-out;
	}

	.links {
		color: var(--light-gray);
		font-variant-numeric: lining-nums;
		margin-left: .1rem;
	}

	.links a {}
	.links a:link    { color: var(--light-gray); }
	.links a:visited { color: var(--light-gray); }
	.links a:hover   { color: var(--red); }
	.links a:active  { color: var(--red); }

	.top {
		margin-left: 0rem !important;
		
	}

	section.curriculum-vitae .top {
		margin-left: 2.5rem !important;
	}















/*   D E S K T O P   L A Y O U T   */


@media only screen and (min-width: 1023px) {

	body {
		font-family: arno-pro-subhead, serif;
		padding: 0;
	}

	h1, h2 {
		padding-bottom: 1.8rem;
	}

	h3 {
		padding: 0 0 .5rem 0;
	}

	.sidebar {
		position: fixed;
		padding-top: 4rem;
		padding-right: 8rem;
		padding-bottom: 6rem;
		padding-left: 4rem;
		height: 100vh !important;
	}

		.sidebar nav {
			padding: 0;
			border-top: none;
		}

		.sidebar nav ul {
			border: none;
			column-count: 1;
			line-height: 1.2em;
		}
	
		.sidebar nav a:hover {
			cursor: pointer;
			padding-left: .5em !important;
			}

		#portrait-1 {
			display: none;
		}

		#portrait-2 {
			display: block;
			min-width: 15% !important;
			max-width: 24% !important;
			margin-top: 5%;
			position: relative;
			left: -.5rem;
		}

	.page {
		display: grid;
		grid-template-columns: 25rem auto;
	}

	.main {
		grid-column-start: 2;
		padding-right: 4rem;
	}


	section { position: relative; min-height: 100vh; padding-top: 4rem; }

		section.curriculum-vitae div p:first-of-type {
			min-width: 3rem;
			letter-spacing: .03rem;
		}

		section.curriculum-vitae h2 {
			padding-left: 3rem;
		}

		section.curriculum-vitae div.gallery {
			display: flex;
			align-items: stretch;
			width: 100%;
			gap: 1vw;
			flex-direction: row;
			flex-wrap: wrap;
			padding-left: 3rem !important;
			margin: 0 0 4rem 0 !important;
		}

			section.curriculum-vitae div.gallery img {
				margin: 0 0 0 0;
			}

				.gallery.small img {
					width: 48.5%;
				}

				.gallery.medium img {
					width: 67%;
				}

				.gallery.large img {
					width: 100%;
					padding-left: 3rem;
				}

		.bonus { display: block !important; }




	.callout {
		/* font-family: arno-pro-display, serif; */
		font-weight: 400;
		font-size: 2.5rem !important;
		line-height: 1.1em;
		max-width: 40ch;
		position: relative;
		top: -.2rem;
	}


	ul.specializations li {
		padding-left: 0;
		text-indent: 0;
	}
	
		ul.specializations li:before {
			display: none;
		}

	.quote-block {
		min-height: 0vh;
		margin: 15vh 0 15vh 0;
		padding: 0;
	}
	
	.quote-block .quote {
		/* font-family: arno-pro-display, serif; */
		font-size: 2.2rem;
		line-height: 1.2em;
		letter-spacing: .2rem;
		text-transform: uppercase;
		max-width: 55ch;
		margin-bottom: 1.5rem;
		-webkit-font-feature-settings: "kern" 1, "clig" 1, "liga" 0, "pnum" 1, "onum" 1;
		-moz-font-feature-settings: "kern" 1, "clig" 1, "liga" 0, "pnum" 1, "onum" 1;
		-ms-font-feature-settings: "kern" 1, "clig" 1, "liga" 0, "pnum" 1, "onum" 1;
		font-feature-settings: "kern" 1, "clig" 1, "liga" 0, "pnum" 1, "onum" 1;
	}

	.caption.small  { max-width: 47%; }
	.caption.medium { max-width: 65%; }
	.caption.large  { max-width: 100%; padding-left: 3rem; }

	.top { display: none; }

	.site-credit {
		position: absolute;
		bottom: 4rem;
	}

	img#printers-mark-a {
		display: none;
	}

	img#printers-mark-b {
		display: block;
		height: 22vh;
		width: auto;
		max-height: 25rem;
		margin-bottom: 3vh;
		position: relative;
		left: -1%;
		z-index: -1;
	}

}