/*!
Launched:2018-05-22
Authors: Shawn Maust, Taylor Packet, Olivia Rotolo, Erik Runyon
Marketing Communications:Web

CONTENTS
-----------------------------------------
1. Common Styles
2. Screen Styles
3. Media Queries
4. Themes
5. Print Styles

BRANDING
-----------------------------------------
1. COLORS
	 - Blue (Headings):#002b5b
	 - Blue (Links):#004da3
	 - Gold:#dcb439

2. FONT STACKS
	 - Headings:"Helvetica Neue", Helvetica, Arial, Verdana, sans-serif
	 - Body:font-family:Sumana, "Times New Roman", Times, serif
*/

/*************************************************************************************
 * 1. Common Styles
 ************************************************************************************/
*, *:before, *:after {-moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box;}
@-ms-viewport {width:device-width; zoom:1;}
@-o-viewport {width:device-width; zoom:1;}
@viewport {width:device-width; zoom:1;}

html {width:100%; margin:0; padding:0; font-size:100%; overflow-y:scroll; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; text-size-adjust:100%; -webkit-font-smoothing:antialiased; -moz-font-smoothing:antialiased; font-smoothing:antialiased; }
body {width:100%; margin:0; padding:0; color:#383838; font:1em/1.5em Sumana, "Times New Roman", Times, serif;}
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary {display:block;}
audio, canvas, video {max-width:100%; width:100%; display:inline-block; *display:inline; *zoom:1;}
audio:not([controls]) {display:none;}
[hidden] {display:none;}
p {margin:0 0 1em; font-size:1.15em; line-height:1.7em;}
a {color:#37486a; outline:none; -webkit-tap-highlight-color:rgba(0,0,0,0); transition:all 125ms ease; }
a:visited {color:#4a3651; text-decoration:none; }
a:hover {color:#5873a9;}
a:active {color:#37486a;}
a:focus {outline:thin dotted;}
a.tapped {background-color:rgba(220,179,57,0.5);}
::-moz-selection,
::selection {background:#0058cf; color:#fff; text-shadow:none;}
strong, b {font-weight:bold;}
em, i {font-style:italic;}
h1,h2,h3,h4,h5,h6 {margin:1.4em 0 0.25em; line-height:1.2em; color:#6f42ac; font-weight:700; text-rendering:optimizeLegibility; font-family:"GPC", "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; text-transform:uppercase;}
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a {text-decoration:none;}
h1 a:visited,h2 a:visited,h3 a:visited,h4 a:visited,h5 a:visited,h6 a:visited {color:#004da3;}
h1 a:hover,h2 a:hover,h3 a:hover,h4 a:hover,h5 a:hover,h6 a:hover {text-decoration:underline;}
h1 {margin-top:0; font-size:2em;}
h2 {margin:0 0 0.5em; font-size:2.4em; }
h2:after {content:""; margin-top:0.35em; display:block; height:5px; width:35px; background:#bbb;}
h3 {font-size:1.563em;}
h4 {font-size:1.375em;}
h5 {font-size:1.188em;}
h6 {font-size:1em;}
h1 + h2,
h2 + h3,
h3 + h4,
h4 + h5 {margin-top:0;}
ol, ul {margin:1em 0; padding:0 0 0 2em;}
li {margin:0 0 0.25em;}
nav ul {margin:0; padding:0; list-style:none;}
nav li {margin:0; padding:0;}
nav a {text-decoration:none;}
iframe, embed {width:100%;}
sup {vertical-align:super; font-size:smaller;}
sub {vertical-align:sub; font-size:smaller;}
pre, code, kbd, samp {font-family:monospace, sans-serif;}
hr {clear:both; width:100%; margin:1em 0; border:1px solid #dadada; border-width:1px 0 0;}

/* Quotes
----------------------------------------------------*/
	blockquote {margin:1rem 0; padding:0; font-size:1.1em; line-height:1em; text-align:left; padding:0.25em 0; color:#fff; overflow:hidden; }
	blockquote p {margin:0; color:#585858; line-height:1.5em; font-family:"Libre Franklin", "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; font-weight:400;}
	blockquote.pull {font-style:normal;}
	blockquote.pull p {padding-left:0; color:#37486a; font-weight:bold; text-align:left; border:none;}
	blockquote p cite {display:block; font-size:1rem; font-weight:normal; font-style:normal; font-family:"Libre Franklin", "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;}

	.slide.quote {display:block}

	.quote-img {margin:1em 0 0; text-align:center;}
	.quote-img img {margin:0 2em 0.25em 0;	border-radius:100%; width:115px; height:115px;}

/* Images
----------------------------------------------------*/
	figure {margin:0;}
	img {max-width:100%; width:auto; height:auto; border:none; vertical-align:bottom; -ms-interpolation-mode:bicubic; box-sizing:content-box; transition:all 125ms ease; }
	figcaption {color:#888; font-size:0.9rem; font-family: "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;}
	.image-right {margin: 20px 0;}

/* General Classes
----------------------------------------------------*/
	.noborder {border:none !important;}
	.ndmark {display:block; width:200px; max-width:100%; text-decoration:none;}

	.cf:before, .cf:after {content:"\0020"; display:block; height:0; overflow:hidden;}
	.cf:after {clear:both;}
	.cf {zoom:1;}

	.skip-links {border:0; clip:rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px;}
	.skip-links:active, .skip-links:focus {clip:auto; height:auto; margin:0; overflow:visible; position:static; width:auto;}

	.visibility-hidden {display:none !important;}
	.visually-hidden {position:absolute; border:0; clip:rect(0 0 0 0); height:1px; width:1px; overflow:hidden; margin:-1px; padding:0; white-space:nowrap;}
	.section-intro {font-size:1.35rem;}
	.no-margin {margin:0;}

/*************************************************************************************
 * 2. Screen Styles
 ************************************************************************************/
@media screen,projection {
	body {background:#f3f3f3;}
	figure img {margin:0 auto;}
	.wrapper {height:100%; overflow-x:hidden;}
	.row {width:90vw; margin:0 auto; *zoom:1;}
	.row:before, .row:after {content:" "; display:table;}
	.row:after {clear:both;}

	.video {position:relative; display:block; text-align:center; margin:2em 0;}
		.video .play {position:absolute; top:-15px; left:15px; width:100%; height:100%; margin:0 auto; background:url('images/play-icon.svg') left bottom no-repeat; background-size:180px auto;}

	.embed-inner {position:relative; padding:0;}
	.embed-inner iframe,
	.embed-inner object,
	.embed-inner embed {position:absolute; top:0; left:0; width:100%; height:100%;}

	progress {position:fixed; left:0; top:0; z-index:10; width:100%; height:5px; border:none; color:#0077DA; background-color:transparent; -webkit-appearance:none; -moz-appearance:none; appearance:none; }
	progress::-webkit-progress-bar {background-color:transparent;}
	progress::-webkit-progress-value {background-color:#0077DA;}
	progress::-moz-progress-bar {background-color:#0077DA;}

	.share,
	.replay {position:relative; float:right; display: block; margin:0.5rem 0 0; padding-right:1.25rem; font-size:14px; cursor:pointer; color:#fff; text-align:right; text-transform:uppercase; font-family:"Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; letter-spacing:1px; font-weight:400; background:url('images/share-arrow.svg') right center no-repeat; background-size:14px auto;}
	.share:hover {color:#fff; font-weight:bold;}
		.addthis_inline_share_toolbox {opacity:0; position:absolute; top:-4rem; left:4.75rem; transition:opacity 0.7s;}
		.share.active .addthis_inline_share_toolbox {opacity:1;}

	/* Header
	----------------------------------------------------*/
	.site-header {position:relative; z-index:1; margin:0; }
	.brandbar { position:absolute; top:0; left:0; z-index:1; bottom:0; right:0; height:100%; }
		.brandbar li {margin:0 -0.9375em; padding:0;}
		.brandbar a {display:block; margin:0.5rem auto; text-decoration:none; height:65px; text-indent:-9999px; overflow:hidden; background-repeat:no-repeat;}
		.dept-nd img {display:none;}
			.dept-nd a {background-position:center 0;}
			.dept a {background-position:right 0;}

	.titlebar {position:relative; z-index:1000; font-family:Sumana, "Times New Roman", Times, serif; min-height:60vh; text-align:center; display:flex; flex-flow:column; justify-content:center; }
		.site-title {margin-bottom:0; font-size:3em; color:#fff; text-transform:none;}
		.site-subtitle {margin-top:0.5em; color:#fff; font-size:1.25rem; font-family:"Libre Franklin", "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; font-weight:400;}
		.site-subtitle span {padding:0.1em 0; background:#0077DA; box-shadow: 0.35em 0 0 #0077DA, -0.35em 0 0 #0077DA;}
		.intro {position:relative; width:90%; height:100%; margin:0 auto; bottom:1.5rem; font-size:1.6rem; line-height:1.8rem; font-weight:300; text-align:center; font-family:"GP", "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;}
		.titlebar .section-media { position:absolute; top:0; right:0; left:0; bottom:0; margin-bottom:1em; }
		.titlebar-share {position:relative; bottom:2.25rem; margin:0 auto;}
		.share-item {display:inline-block; float:none; margin:0; color:#fff;}
		.header-share {margin-right:1rem; background-image:url('images/header-share.svg');}

	.header-video { position:absolute; top:0; left:0; right:0; bottom:0; z-index:-1; }
		.header-video video { min-height:100%; min-width:100%; max-width:none; }

	/* Content
	----------------------------------------------------*/
	.site-content {position:relative; padding:0; z-index:0; }
	.section { display:flex; flex-flow:column; position:relative; z-index:0;}
	.slide { padding:0.5rem 2rem;	display:flex; flex-flow:column; justify-content: center; }
	.origin-slide {display: block;}

	.header-overlay {width:250px; height:50px; margin:0 auto; background: url(images/play-icon.svg) 50% 50% / contain no-repeat; text-indent:-9999px; cursor:pointer; max-width:200px; z-index:999;}

	.s-slider .image-slider-caption {padding:0 0.35rem; text-transform:none; font-size:0.9rem; font-family:"Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; font-weight:400; background:#fff; background:rgba(255,255,255,0.8);}

	p.diagram-caption {font-size:0.95rem; font-family:"Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; margin-left:1rem; text-indent:-1rem; }
	.diagram-caption span { }

	/* Media layouts */
	.section-media { position:relative; font-family:GPC, "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; font-weight:700;}
		.no-copy .section-media { min-height:100vh;	}
		.section-media figcaption { margin:0.5em; z-index:100; position:absolute; bottom:0.5em; left:0.5em; }
		.section-media .highlight { line-height:2em; padding:0.25em 0; color:#fff; background:#0077DA; box-decoration-break: clone; box-shadow: 0.5em 0 0 #0077DA, -0.5em 0 0 #0077DA; }
		figcaption .highlight {font-family:"Libre Franklin", "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; font-weight:normal;}
		.media-caption { text-align:center; position:absolute; bottom:0; padding:1rem; width:100%; text-transform:none; font-size:0.9rem; font-family:"Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; font-weight:400; }

		.s-timelapse { display:none;}

	 /* Origin Story */
	.origin-story p {font-family:"Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; font-size:1rem; line-height:1.5em;}
	.origin-story p:last-child {padding-bottom:2.5em; border-bottom:1px solid #ccc;}
	.origin-story h2 {padding:2rem 0 1rem; font-size:1.25rem; text-align:center; color:#777; border-top:1px solid #ccc;}
	.origin-story h2:after {display:none;}

	/* Intro */
	.section-borders { display:none; }

	/* Image Slider */
	.image-slider img { width:50%; float:left; }

	/* Diagram */
	.s-diagram .slide { padding-bottom:0; }

	/* Video */
	.timelapse-video { position:absolute; top:0; left:0; right:0; bottom:0; z-index:-1; background:#000; }
		.timelapse-video + .media-caption { color:#fff; }

		/* Related Content */
	.related {margin:3rem 0;}
	.related a article {margin-bottom:0.75em; padding:0.7em; display:block; min-height:114px; vertical-align:top; border:1px solid #d9d9d9; box-shadow:0 0 8px rgba(204,204,204,0.25); background:#fff; transition:all 125ms ease;}
	.related article:hover {border:1px solid #d5d5d5; box-shadow:0 0 8px rgba(0,0,0,0.1); -webkit-transform:scale(1.015); transform:scale(1.0125);}
	 .related h2 {margin:0 0 1em; padding:0 0 0.15em; border-bottom:1px solid #ccc; font-size:0.9em; text-transform:uppercase; letter-spacing:1px; color:#555; font-weight:400;}
		 .related h2:after {display:none;}
	.related .image {margin-right:0.75em; float:left; width:130px;}
	.related .headline {padding-top:0.15em;}
	.related .headline h3 {margin-top:0; font-size:1.15em; font-weight:400;}
	.related .date {font-size:0.9rem; color:#656565; font-family:GP, "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; }
	.related a {text-decoration:none; color:#1a324e;}

	/* Footer
	----------------------------------------------------*/
	/* Byline */
	.byline:before {content:''; margin-bottom:1.5em; display:block; height:4px; width:80px; background:#ae9142;}
	.byline {margin:3.5em 0 0; color:#0c2340; }
	.byline p {margin:0; font-size:1.25em; font-weight:700; font-family:GPC, "Libre Franklin", Helvetica, Arial, Verdana, sans-serif;}
	.byline ul {padding:0; list-style:none; font-size:0.9em; font-weight:400; font-family:"Libre Franklin", Helvetica, Arial, Verdana, sans-serif; font-style:normal; color:#555;}
	.byline ul strong {color:#333;}
	.byline a {color:#1a324e;}

	.site-footer {position:relative; text-align:center; margin-top:2rem; font-family:"Libre Franklin", Helvetica, Arial, Verdana, sans-serif; background:#fff;}
		.site-footer p {clear:both; margin:0; font-size:1rem;}
		.site-footer a {color:#555;}
		.site-footer svg {fill:#555;}

	.footer-global {padding:2rem 0;}
		.footer-global li { padding: 0.5rem 0; }
		.social {margin:2rem 0;}
		.copyright {font-weight:bold;}
		.address {display:block; margin:0;}
		.ndmark {width:200px; margin:2em auto;}

	.footer-global-links {padding:1rem 0; background:#d2d2d2; font-size:1rem;}
		.footer-global-links a {padding:0.45rem 1rem; border-radius:0.5rem; transition:all 125ms ease-in-out; text-decoration:none; transition:all 125ms ease-in-out;}
		.footer-global-links a:hover {text-decoration:underline;}
		.footer-global-links nav a:hover {text-decoration:none; background-color:#f0f0f0;}

	.footer-global-links li {margin:0 1rem; padding:0.5rem 0;}
	.footer-links-content {text-align:center;}
	.footer-links-policy {justify-content:flex-end; text-align:center;}
}

/*************************************************************************************
 * 3. Media Queries
 ************************************************************************************/

/* 580px
----------------------------------------------------*/
@media only screen and (min-width:36.25em) {
	blockquote.pull {font-size:1.35em;}
	.image-right,
	.image-left {max-width:50%; font-size:0.9rem; text-align:left; color:#888; line-height:1.4em; font-family:"Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;}
	.image-right { float:right; margin:0 0 1.2em 1.2em; }
	.image-left { float:left; margin:0 1.2em 1.2em 0; }
	.intro {bottom:2.5em; width:70%;}

	.dc-1 { top:calc(50% - 32vw); right:1vw; }
	.dc-2 { top:calc(50% - 17vw); right:3vw; }
	.dc-3 { top:calc(50% - 20vw); left:1vw; }
	.dc-4 { bottom:calc(50% - 32vw); left:2vw; }

	.s-timelapse {display: flex;}
}

/* 700px
----------------------------------------------------*/
@media only screen and (min-width:43.75em) {
	html {background-attachment:fixed;}

	h2 {font-size:2.3em;}
	h3 {font-size:1.75em;}
	h4 {font-size:1.5em;}
	h5 {font-size:1.25em;}
	h6 {font-size:1.125em;}

	.site-title {font-size:5rem;}
	.site-subtitle {font-size:1.5rem;}
	.titlebar {min-height:100vh;}
	.titlebar-share {position:absolute; bottom:0.5rem; right:3rem;}
	.row {max-width:90vw;}
	.brandbar li {margin:0 auto;}

	.video .play {top:-20px; left:20px; background-size:300px auto;}

	.quote-img {margin:3em 0 1em;}
	.quote-img img {display:block; float:left; width:100px; height:100px;}

	.header-overlay {width:270px; height:60px; margin:0 auto; max-width:300px;}

	/* Header
	----------------------------------------------------*/
	.site-header {text-align:left;}
	.brandbar {padding:0;}
	.brandbar li {margin:0 auto;}
	.header-image {height:600px; background:url('images/header-1000.jpg') center center no-repeat; background-size:cover;}
	.intro {font-size:2rem; line-height:2.4rem; bottom:3rem; width:76%; margin:0 auto;}

	/* Content
	----------------------------------------------------*/
	/* Intro */
	.section-borders { display:block; position:absolute; top:0; bottom:0; left:-2vw; right:-2vw; }
	.section-borders span { position:absolute; top:50%; background:transparent 50% 50% / contain no-repeat; }
	.section-borders .left { left:0; }
	.section-borders .right { right:0; }
	.s-intro .section-copy { padding:0 10vw; }
	.s-intro .l1 { width:14vw; height:14vw; top:12%; background-image:url(images/pieces-left-1.png); }
	.s-intro .l2 { width:28vw; height:21vw; left:-4em; top:23%;background-image:url(images/pieces-left-2.png); }
	.s-intro .l3 { width:19vw; height:20.5vw; top:45%; background-image:url(images/pieces-left-3.png); }
	.s-intro .l4 { width:21vw; height:31vw; top:55%; z-index:-1; background-image:url(images/pieces-left-4.png); }
	.s-intro .l5 { width:20vw; height:18vw; top:90%; background-image:url(images/pieces-left-5.png); }
	.s-intro .r1 { width:23vw; height:17vw; top:6%; background-image:url(images/pieces-right-1.png); }
	.s-intro .r2 { width:26vw; height:28vw; top:19%; right:-3em; z-index:-1; background-image:url(images/pieces-right-2.png); }
	.s-intro .r3 { width:22vw; height:16vw; top:45%; background-image:url(images/pieces-right-3.png); }
	.s-intro .r4 { width:15vw; height:16vw; top:64%; background-image:url(images/pieces-right-4.png); }
	.s-intro .r5 { width:20vw; height:23vw; top:80%; background-image:url(images/pieces-right-5.png); }


	/* Related */
	.related.float-right article {width:48%; margin-right:1%; display:inline-block;}
	.related.main article {width:49%; margin:0 0.115em; display:inline-block;}

	/* Footer
	----------------------------------------------------*/
	.social li {display:inline-block; margin:0 0.25rem;}
	.footer-links-content li {margin-right:0.5rem; display:inline-block;}
	.footer-links-policy li {margin-left:0.5rem; display:inline-block;}
}

/* 1000px
----------------------------------------------------*/
@media only screen and (min-width:62.5em) {
	blockquote.pull {font-size:1.45em;}
	.brandbar {padding:0;}
	.tagline { font-size:1.6em; }
	.image-right {margin-right:-6vw;}
	.image-right.video-right {margin-right:-10vw;}

	.header-overlay {margin-left:-2.25em;}
	.site-subtitle {max-width:30rem;}

	figure.full { width:70.65vw; margin:3em 0; margin-left:-3vw; }

	/* Navigation
	----------------------------------------------------*/
	.nav-page .title { width:33%; float:left; }
	.nav-page ul { width:66%; float:left; }

	/* Content
	----------------------------------------------------*/

	blockquote .share {position:relative;}
	blockquote.pull p {padding-left:0;	font-weight:bold; text-align:right; border:none;}

	.site-title {margin-left:-0.1em;}
	.titlebar .section-copy {position: absolute; bottom: -12em; left: -5.5em; text-align: left;}

	.related {margin:1rem 0 3rem;}
	.related.float-right {float:right; padding-left:2em; width:40vw; margin-right:-18vw;}
	.related.float-right article {width:100%;}

	.section { flex-flow:row; position:relative; transition:opacity 0.5s; }
		.js .section {	opacity:0; }
		.section.active { z-index:99; opacity:1; }
		.section.media-full { flex-flow:column; }
		.section.no-copy { padding-top:100vh; }
		.section.media-left { justify-content:flex-end; }

	/* Media Layouts */
	.section-media { width:50%; height:100vh;	}
		.js .section-media { z-index:-1; position:absolute; }
		.active .section-media { z-index:99; position:fixed; top:0; bottom:0; }
		.media-full .section-media { width:100%; }
		.media-right .section-media { right:0; left:50%; }
		.media-left .section-media { right:50%; left:0; }
		.media-full .section-media { left:0; right:0; }
		.section-media figure { height:100%; width:100%; }
		.section-media figcaption { bottom:20vh; max-width:40vw; font-size:1.75em; }
		.section-media.quote-up figcaption {bottom:32vh;}
			.media-right figcaption { left:-4vw; }
		.section-media img { height:100%; width:100%; object-fit: cover; object-position: 50% 50%; }

	.section-copy { z-index:100; padding:0 15vw; width:100vw; max-width:68rem; margin:0 auto; }
		.slide { padding:2em; min-height:100vh; }
		.media-right .section-copy,
		.media-left .section-copy { width:50%; padding:0 5vw; margin:0; }
		.media-right .section-copy { order:-1; }
		.s-intro .section-copy { padding:0 18vw; }

	/* Media Overlay */
	.overlay .section-copy { color:#fff; margin-top:67vh; }
	.overlay .section-media::before { z-index:-1; content:''; display:block; position:absolute; top:0; bottom:0; right:0; left:0; background:rgba(0,0,0,0); transition:1s; }
	.overlay .section-media.darken::before { z-index:10; background:rgba(0,0,0,0.7);	}

	/* Image Slider */
	.section-media .image-slider { position:absolute; left:0; top:0; bottom:0; width:200%; z-index:-1; display:flex; transition:all 0.6s;transform:translateX(0); }
		.image-slider.alt { transform:translateX(-50%); }
		.image-slider-viewport { position:absolute; top:50%; left:50%; width:34vh; height:68vh; transform:translate(-50%, -50%); overflow:hidden; border-radius:3vw; }
		.image-slider-overlay { position:absolute; top:50%; left:50%; width:39vh; height:72vh; transform:translate(-50%, -50%); background:url(images/iphone-mockup-700.png) 50% 50% / 100% no-repeat; }
			.image-slider img { height:100%; width:50%; }
			.s-slider .image-slider-caption { left:50%; padding:0; position:absolute; width:80%; transform:translateX(-50%); bottom:6vh; padding:1rem; text-align:center; background:none;}

	/* Diagram */
	.s-diagram { padding-top:75vh; padding-bottom:25vh; }
		.s-diagram img { object-fit:initial; position:absolute; width:100%; height:auto; top:50%; left:50%; transform:translate(-50%,-50%); }
	.js .diagram-caption { opacity:0; z-index:999; font-size:0.9em; line-height:1.2; padding:0.5rem; width:20vw; position:fixed; transition-property:opacity,transform; transition-duration: 1s; transition-timing-function: cubic-bezier(.175,.885,.32,1.275); text-indent:0; margin:0; }
		.diagram-caption.show { opacity:1; transform:translateX(0); }
	.dc-left { transform:translateX(-2rem); text-align:right; }
	.dc-right { transform:translateX(2rem);}

	.dc-1 { top:calc(50% - 27vw); }
	.dc-2 { top:calc(50% - 16vw); }
	.dc-3 { top:calc(50% - 14vw); }
	.dc-4 { bottom:calc(50% - 25vw); }

	.diagram-caption span { display:none;	}
	.diagram-caption::before,
	.diagram-caption::after { content:''; display:block; position:absolute; top:50%; transform:translateY(-50%); }

	.diagram-caption::before { height:0.75rem; width:0.75rem; border-radius:1rem; background:#000; }
	.diagram-caption::after { height:2px; width:8vw; border-bottom:dashed #000 2px;	}

	.dc-left::before { right:-8vw; }
	.dc-left::after { left:100%; }
	.dc-right::before { left:-8vw;	}
	.dc-right::after { right:100%; }

	/* Footer
	----------------------------------------------------*/
	.footer-global {padding:3rem 0 2rem;}
	.footer-global li {padding:0;}
	.footer-global .col {display:flex; justify-content:space-between;}
	.footer-global .social {justify-self:center; max-width:500px;}
	.footer-global .social svg { margin-right:0.25rem; vertical-align:text-bottom; margin-bottom:2px; }
	.footer-global .social ul {display:grid; grid-template-columns:repeat(3, 1fr); grid-gap:0.5rem; justify-items:start;}
	.footer-global .ndmark {margin:0;}
	.footer-global .social {margin:0;}
	.footer-global .vcard {text-align:left;}

	.social li {display:inline-block; margin:0 0.25rem; font-size:1rem;}
	.social a {color:#555; padding:0.5rem 1rem; margin-top:-0.5rem; display:block; border-radius:0.6rem; border:3px solid transparent; transition:all 125ms ease-in-out;}
		.social a:hover { background-color:#e1e8f2; color:#0c2340;}
		.social a:focus { border-color:#15a6b5; outline:none;}
		.social a:active {color:#0c2340;	background-color:#c1cddd;}
		.social a:hover svg {fill:#0c2340;}

	.footer-global-links {font-size:.875rem;}
	.footer-global-links nav {display:flex;}
	.footer-global-links ul {width:50%; margin:0;}

	.footer-links-content {text-align:left;}
		.footer-links-content li {margin:0; display:inline-block;}

	.footer-links-policy {justify-content:flex-end; text-align:right;}
		.footer-links-policy li {margin-left:0.5rem; display:inline-block;}
}

/* 1200px
----------------------------------------------------*/
@media only screen and (min-width:75em) {
	blockquote {font-size:1.2em;}
	.row {max-width:80vw;}
	.pull {width:20vw; margin-left:-20vw;}
	.titlebar-share {bottom:2rem;}
	.header-image { height:650px; background:url('images/header-1600.jpg') top center no-repeat; background-size:cover;}
	figure.full { width:73.5vw; margin-left:-6.5vw; }
 .related.float-right {width:32vw; margin-right:-10vw;}

	.dc-1 { top:calc(50% - 25vw); }
	.dc-2 { top:calc(50% - 15vw); }
	.dc-3 { top:calc(50% - 11vw); }
	.dc-4 { bottom:calc(50% - 20vw); }
}

/* 1400px
----------------------------------------------------*/
@media only screen and (min-width:87.5em) {
	blockquote.pull {font-size:1.65em;}
	.section-copy {max-width:75rem;}
}

/* 1600px
----------------------------------------------------*/
@media only screen and (min-width:100em) {
	.image-right, .image-left {max-width:50%;}
	.image-right {margin-right:-5vw;}
	.related.float-right {width:26vw; margin-right:-5vw;}
	.section-media figcaption {max-width:30vw;}
	.section-copy {max-width:82rem;}
}

/* 2000px
----------------------------------------------------*/
@media only screen and (min-width:125em) {
.section-copy {max-width:100rem;}
}

	/* Icons
	<span class="icon" data-icon="nd-monogram"></span>
	https://dev.conductor.nd.edu/icons/
----------------------------------------------------*/
	.icon {display:inline-block; width:1em; height:1em; fill:currentColor;}
		[data-icon="nd-monogram"] {fill:#0c2340;}


/* Fonts
	 https://dev.conductor.nd.edu/fonts/
----------------------------------------------------*/
@font-face {font-family:GPC; font-weight:700; font-style:normal; font-display:swap;
	src:url('https://static.nd.edu/fonts/gp-min/gpc-bold.woff2') format('woff2'),
			url('https://static.nd.edu/fonts/gp-min/gpc-bold.woff') format('woff'),
			url('https://static.nd.edu/fonts/gp-min/gpc-bold.ttf') format('truetype');
}

/* Hi-res
----------------------------------------------------*/
@media
	(-webkit-min-device-pixel-ratio:1.5),
	only screen and (min--moz-device-pixel-ratio:1.5),
	(min-resolution:144dppx){
		.s-intro .l1 { background-image:url(images/pieces-left-1@2x.png); }
		.s-intro .l2 { background-image:url(images/pieces-left-2@2x.png); }
		.s-intro .l3 { background-image:url(images/pieces-left-3@2x.png); }
		.s-intro .l4 { background-image:url(images/pieces-left-4@2x.png); }
		.s-intro .l5 { background-image:url(images/pieces-left-5@2x.png); }
		.s-intro .r1 { background-image:url(images/pieces-right-1@2x.png); }
		.s-intro .r2 { background-image:url(images/pieces-right-2@2x.png); }
		.s-intro .r3 { background-image:url(images/pieces-right-3@2x.png); }
		.s-intro .r4 { background-image:url(images/pieces-right-4@2x.png); }
		.s-intro .r5 { background-image:url(images/pieces-right-5@2x.png); }
}

/*************************************************************************************
 * 4. Themes
 ************************************************************************************/
@media screen, projection {
	/* Brand Bar
	----------------------------------------------------*/
	.dept-nd a {width:260px; background-image:url('/assets/css/images/marks/white/mark-stories.svg');}
}

/* Hi-res
----------------------------------------------------*/
@media
	(-webkit-min-device-pixel-ratio:1.5),
	only screen and (min--moz-device-pixel-ratio:1.5),
	(min-resolution:144dppx){
}

/* Plugins
--------------------------------------------------------------- */

	/*! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license */
	.fancybox-wrap,.fancybox-skin,.fancybox-outer,.fancybox-inner,.fancybox-image,.fancybox-wrap iframe,.fancybox-wrap object,.fancybox-nav,.fancybox-nav span,.fancybox-tmp { padding:0; margin:0; border:0; outline:none; vertical-align:top }
	.fancybox-wrap { position:absolute; top:0; left:0; z-index:8020 }
	.fancybox-skin { position:relative; background:black; color:#444; text-shadow:none; border-radius:4px }
	.fancybox-opened { z-index:8030 }
	.fancybox-opened .fancybox-skin { -webkit-box-shadow:0 10px 25px rgba(0, 0, 0, 0.5); box-shadow:0 10px 25px rgba(0, 0, 0, 0.5) }
	.fancybox-outer,.fancybox-inner { position:relative }
	.fancybox-inner { overflow:hidden }
	.fancybox-type-iframe .fancybox-inner { -webkit-overflow-scrolling:touch }
	.fancybox-error { color:#444; font:14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; margin:0; padding:15px; white-space:nowrap }
	.fancybox-image,.fancybox-iframe { display:block; width:100%; height:100% }
	.fancybox-image { max-width:100%; max-height:100% }
	#fancybox-loading,.fancybox-close,.fancybox-prev span,.fancybox-next span { background-image:url('images/fancybox_sprite.png') }
	#fancybox-loading { position:fixed; top:50%; left:50%; margin-top:-22px; margin-left:-22px; background-position:0 -108px; opacity:0.8; cursor:pointer; z-index:8060 }
	#fancybox-loading div { width:44px; height:44px; background:url('images/fancybox_loading.gif') center center no-repeat }
	.fancybox-close { position:absolute; top:-18px; right:-18px; width:36px; height:36px; cursor:pointer; z-index:8040 }
	.fancybox-nav { position:absolute; top:0; width:40%; height:100%; cursor:pointer; text-decoration:none; background:transparent url('blank.gif'); -webkit-tap-highlight-color:rgba(0,0,0,0); z-index:8040 }
	.fancybox-prev { left:0 }
	.fancybox-next { right:0 }
	.fancybox-nav span { position:absolute; top:50%; width:36px; height:34px; margin-top:-18px; cursor:pointer; z-index:8040; visibility:hidden }
	.fancybox-prev span { left:10px; background-position:0 -36px }
	.fancybox-next span { right:10px; background-position:0 -72px }
	.fancybox-nav:hover span { visibility:visible }
	.fancybox-tmp { position:absolute; top:-99999px; left:-99999px; visibility:hidden; max-width:99999px; max-height:99999px; overflow:visible !important }
	.fancybox-lock { overflow:hidden !important; width:auto }
	.fancybox-lock body { overflow:hidden !important }
	.fancybox-lock-test { overflow-y:hidden !important }
	.fancybox-overlay { position:absolute; top:0; left:0; overflow:hidden; display:none; z-index:8010; background:url('images/fancybox_overlay.png') }
	.fancybox-overlay-fixed { position:fixed; bottom:0; right:0 }
	.fancybox-lock .fancybox-overlay { overflow:auto; overflow-y:scroll }
	.fancybox-title { visibility:hidden; font:normal 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; position:relative; text-shadow:none; z-index:8050 }
	.fancybox-opened .fancybox-title { visibility:visible }
	.fancybox-title-float-wrap { position:absolute; bottom:0; right:50%; margin-bottom:-35px; z-index:8050; text-align:center }
	.fancybox-title-float-wrap .child { display:inline-block; margin-right:-100%; padding:2px 20px; background:transparent; background:rgba(0, 0, 0, 0.8); border-radius:15px; text-shadow:0 1px 2px #222; color:#FFF; font-weight:bold; line-height:24px; white-space:nowrap }
	.fancybox-title-outside-wrap { position:relative; margin-top:10px; color:#fff }
	.fancybox-title-inside-wrap { padding-top:10px }
	.fancybox-title-over-wrap { position:absolute; bottom:0; left:0; color:#fff; padding:10px; background:#000; background:rgba(0, 0, 0, .8) }

/*************************************************************************************
 * 5. Print Styles
 ************************************************************************************/
@media print {

	@page {margin:0.5cm;}
	body {font-family:Georgia, "Times New Roman", Times, serif; color:#000;}
	img, tr {page-break-inside:avoid;}
	p, h2, h3 {orphans:3; widows:3;}
	h2, h3 {margin:2rem 0 0; page-break-after:avoid;}

	/* Styles
	----------------------------------------------------*/
	a[href^="javascript:"]:after,
	a[href^="#"]:after {content:"";}
	.ndmark {width:150px;}
	.image-right img {float:right; margin:0 0 1em 2em;}
	.image-left img {float:left; margin:0 2em 1em 0;}

	/* HIDDEN
	----------------------------------------------------*/
	progress,
	.breadcrumbs,
	.header-util,
	.skip-links,
	.nav-mobile,
	.nav-site,
	.nav-page,
	.content-video,
	.timelapse-video,
	.nav-skip,
	.header-video,
	.related,
	.footer-global-links,
	.social,
	.section-media .highlight {display:none;}

	/* STRUCTURE
	----------------------------------------------------*/
	.site-header {overflow:hidden; position:relative; margin:0 0 20px; padding:0 0 20px; border-bottom:1px solid gray;}
		.brandbar {font-size:12px; text-transform:uppercase; font-family:"Adobe Garamond", Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;}
			.brandbar i {text-transform:none;}
		.site-title {margin:0; display:block; font-family:"Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;}
		.site-header a,
		.site-title a,
		.subline a {color:#000;}
		.site-title {margin:4px 0 2px; font-size:2em;}
		.subline {font-size:1em;}

	.media-right img,
	.media-left img,
	.image-left,
	.image-right {float:right; width:33%; margin:0 0 0 2rem;}


	.media-full img { width:55%; margin:0 auto 2rem; }

	figcaption { clear:both; text-align:right;}
	.media-left figcaption,
	.media-right figcaption { float:right; max-width:33%; padding:0.5rem; }

	.site-content a:link:after {content:" [link:" attr(href) "] "; font-size:11px; font-family:inherit;}
	.site-content abbr:after {content:" (" attr(title) ")";}

	.site-footer {position:relative; clear:both; margin:20px 0 0; padding:20px 0 0; border-top:1px solid gray;}
		.site-footer p {margin:0;}
		.geo,
		.country-name {display:none;}
		.tel {display:block;}
		.site-footer .ndmark {position:absolute; top:20px; right:0;}
}