:root {
	--colorFuchsiaLight: 233, 144, 176;
	--colorFuchsiaDark: 214, 24, 92;
	--colorRedLight: 222, 105, 98;
	--colorRedDark: 205, 31, 21;
	--colorOrangeLight: 255, 168, 119;
	--colorOrangeDark: 223, 107, 41;
	--colorYellowLight: 255, 211, 104;
	--colorYellowDark: 88, 83, 65;
	--colorGreenLight: 135 213 157;
	--colorGreenDark: 9, 148, 90;
	--colorBlueLight: 130, 210, 255;
	--colorBlueDark: 15, 99, 238;
	--colorBlueExtraDark: 23, 43, 165;
	--colorPurpleLight: 185, 148, 220;
	--colorPurpleDark: 99, 41, 193;
	--colorPinkLight: 226 155 224;
	--colorPinkDark: 136 0 82;
	--colorTealDark: 0 86 94;
	--colorDark: 38, 38, 44;
	--colorLight: 244, 237, 229;
	--colorCaseStudyAccent: 0,0,0;

	--color1Back: rgb(var(--colorYellowLight)); /*yellow*/
	--color2Back: rgb(var(--colorDark)); /*black*/
	--color3Back: rgb(var(--colorLight)); /*cream*/
	--dark-link: #002487;
	--light-link: #6596ff;

	--color1Fore: white;
	--color2Fore: white;
	--color3Fore: black;

	--color1Link: var(--dark-link);
	--color2Link: var(--light-link);
	--color3Link: var(--dark-link);
}
* {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;

}
html {
	font-size: 14px;
	overflow: hidden;
}
body {
    width: 100vw;
    height: 100vh;
    margin: 0;
    overflow: hidden;

}
body, input, button {
	font-family: -apple-system, BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
	font-size: 1rem;
}
body {
	
	margin: 0;
	padding: 0;
	-webkit-overflow-scrolling: touch;
	position: relative;
	font-weight: 400;
}
dd,dt {
	margin: 0;
}
dd ul {
	margin-top: 0;
}
li {
	margin: .5rem 0;
}
h3 {
	
}
h1, h2, h3, h4, h5 {
	margin-top: 1em;
	margin-bottom: .4em;
	text-decoration: none;
	line-height: 1;
}
h1 {
	font-size: 3.5rem;
	margin: 0;
	margin-top: .25em;
	margin-bottom: 0.1em;
}
h2 {
	font-size: 2rem;
	margin-bottom: .5rem;
	margin-top:.5em;
}
h2:first-child {
	margin-top: 0;
}
h3 {
	font-size: 1.5rem;
	line-height: 1.2;
}
h5 {
	font-size: 1.2rem;
	text-transform: uppercase;
	margin-bottom: .25rem;
	font-weight: 900;
	margin-top: 2rem;
}
h2 .detail {
	font-size: 1rem;
	font-weight: 400;
	opacity: .7;
	font-family: 'Source Sans Pro', -apple-system, BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;;
}

a {
	font-weight: 600;
}
a, a:visited {
	/*color: white;*/
	text-decoration: none;
}
a:hover, a:focus {
	text-decoration: underline;
}

p, li, dd{
	line-height: 1.5;
}
figure {
	padding: 0;
	margin: 0;
	margin-top: 1rem;
	text-align: center;
}
figure img, figure video {
	box-shadow:  0px 1px 5px rgba(0,0,0,.1);
	width: 100%;
	height: auto;
}
figcaption {
	margin-top: .5rem;
}
img {
	border-radius: 15px;
	cursor: pointer;
	max-width: 100%;
}
figcaption {
	font-size: .9rem;
	font-style: italic;
}
p {
	margin: 0;
	
}
strong {
	font-weight: 600;
}
p + p,
figure + p {
	margin-top:  1rem;
}




.two-col {
	display: flex;
	flex-wrap: wrap;
}




.social-icon:hover {
	opacity: .9;
}
.social-icon {
	opacity: .6;
	margin-right: .5rem;
}
.social-icon img {
	width: 36px;
	height: 36px;
	border-radius: 0;
	
}

.jobs dd + dt {
	margin-top: 1.5rem;
}
.jobs dl {
	margin: 0;
}
.jobs dd {
	font-size: 1rem;
}
.job {
	margin-top: 1rem;
}
.job__title,
.job__company {
	font-weight: 700;
}
.job__details {
	margin-bottom: 1rem;
}
.job__title {
	font-size: 1.25rem;
}
.job__company {
	font-size: 1rem;
	display: inline;
}
.job__company__location {
	display: inline;
}
.job__timespan {
	font-size: .8rem;
	opacity: .8;
	margin-bottom: 0;
}
.job__timespan + * {
	margin-top: 0;
}

.back-to-top {
	margin-top: 1rem;
}

nav ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

/* Password protection */
.password-protected {
	position: relative;
	max-height: 300px;
	overflow: hidden;
	padding: .5rem;
}
@media all and (min-width: 42rem) {
	.password-protected {
		max-height: 400px;
	}
}
.password-protected.unlocked {
	max-height: none;
	overflow: visible;
	padding: 0;
}
.shield {
	width: calc(100% + 2rem);
    height: calc(100% + 2rem);
    left: -1rem;
    top: -1rem;
    background-color: rgba(var(--colorDark), 50%);
    position: absolute;
    z-index: 1;
    backdrop-filter: blur(5px);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    padding-top: 6.5rem;
    box-shadow: 0px -100px 71px -14px rgb(var(--colorDark)) inset;
}
.shield label {
	font-size: 1.2rem;
	margin-bottom: .5rem;
}
input {
	padding: .5rem;
	border-radius: 4px;
	border: 3px solid #9fa9b8;
}
button {
	border-radius: 2rem;
	padding: .75rem 1.25rem;
	border: none;
	box-shadow: 0;
	background-color: var(--color1Back);
	font-weight: 600;
	cursor: pointer;
	color: black;
}
button:hover {
	box-shadow: 0px 0px 10px rgba(255,255,255,.5);
}
input + button {
	margin-top: 1rem;
}

input.invalid {
	animation: shake .1s;
	animation-iteration-count: 5;
}

dt {
	font-weight: 600;
	margin-bottom: .25rem;
}
dd {
	margin-bottom: 1rem;
}
dd:last-child {
	margin-bottom: 0;
}
.figure dd {
	font-size: .8rem;
}
.figure dt {
	margin-bottom: 0;
}
blockquote {
	text-align: left;
	font-size: 2rem;
	font-weight: 800;
	margin: 0;
	min-width: 20rem;
	border-left: 4px solid black;
	padding-left: 1.5rem;
	margin-top: 1rem;
	position: relative;
}

/*blockquote:before {
	content: "“";
	position: absolute;
	font-size: 8rem;
	opacity: .1;
	top: -2rem;
	left: -2rem;
}*/

@keyframes shake {
  0% { 
  	transform: translate(6px, 0px);
  }
  50% { transform: translate(-6px, 0px); 

  }
}

#overlay {
	background-color: rgba(0,0,0,.8);
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	display: none;
	justify-content: center;
	align-items: center;
	z-index: 3;
}
#overlay-image {
	max-width: 95%;
	max-height: 95%;
	height: auto;
}
#close-button {
	position: absolute;
	top: 2rem;
	right: 2rem;
}

.hide-element {
    border: 0;
    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
    clip; rect(1px, 1px, 1px, 1px);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px; 
}