﻿:root {
	/*============================================*/
	/* Colors */
	--accent-blue: #185f9a;
	--accent-blue-rgb: 24, 95, 154;
	--cyan: #009FDF;
	--cyan-rgb: 0, 159, 223;
	--dark-gray: #414042;
	--dark-gray-rgb: 65, 64, 66;
	--emergency-red: #DF1E43;
	--emergency-red-rgba: 223, 30, 67;
	--green: #62BB46;
	--green-rgb: 98, 187, 70;
	--light-blue: #eaf1f5;
	--light-blue-rgb: 234, 241, 45;
	--light-gray: #F1F1EF;
	--light-gray-rgb: 241, 241, 239;
	--magenta: #EF3F6B;
	--magenta-rgb: 239, 63, 107;
	--medium-blue: #175A94;
	--medium-blue-rgb: 23, 90, 148;
	--medium-gray: #DADADA;
	--medium-gray-rgb: 218, 218, 218;
	--secondary-web-blue: #141E3C;
	--secondary-web-blue-rgb: 20, 30, 60;
	--secondary-web-orange: #EB5F0C;
	--secondary-web-orange-rgb: 235, 95, 12;
	--teal: #25CAD3;
	--teal-rgb: 37, 202, 211;
	--text-gray: #666666;
	--text-gray-rgb: 102, 102, 102;
	--uva-blue: #232D4B;
	--uva-blue-rgb: 35, 45, 75;
	--uva-orange: #E57200;
	--uva-orange-rgb: 229, 114, 0;
	--yellow: #FDDA24;
	--yellow-rgb: 253, 218, 36;
	--accessible-orange: var(--secondary-web-orange);
	/*============================================*/
	/* Fonts */
	--archer: 'Archer A', 'Archer B', 'Archer', Georgia, 'Times New Roman', Times, serif;
	--chronicle-display: 'Chronicle Display A', 'Chronicle Display B', 'Chronicle Display', Georgia, 'Times New Roman', Times, serif;
	--chronicle-text: 'Chronicle Text G1 A', 'Chronicle Text G1 B', 'Chronicle Text G1', Georgia, 'Times New Roman', Times, serif;
	--ringside-compressed: 'Ringside Compressed A', 'Ringside Compressed B', 'Ringside Compressed', Arial, Helvetica, sans-serif;
	--ringside-narrow: 'Ringside Narrow A', 'Ringside Narrow B', 'Ringside Narrow', Arial, Helvetica, sans-serif;
	--ringside-regular: 'Ringside Regular A', 'Ringside Regular B', 'Ringside Regular', Arial, Helvetica, sans-serif;
	--sans-serif: var(--ringside-regular);
	--sans-serif-display: var(--ringside-regular);
	--sans-serif-text: var(--ringside-regular);
	--serif: var(--archer);
	--serif-display: var(--archer);
	--serif-text: var(--chronicle-text);
	/*============================================*/
	/* Font usage */
	--font-body-headings: var(--ringside-compressed);
	--font-body-text: var(--chronicle-text);
	--font-buttons: var(--ringside-regular);
	--font-caption: var(--ringside-regular);
	--font-card-headings: var(--archer);
	--font-card-text: var(--ringside-narrow);
	--font-credit: var(--ringside-regular);
	--font-headings: var(--archer);
	/*================*/
	/* Bootstrap Overrides */
	--bs-link-color: var(--uva-blue);
	--bs-link-color-rgb: var(--uva-blue-rgb);
	--bs-link-hover-color: var(--secondary-web-blue);
	--bs-link-hover-color-rgb: var(--secondary-blue-rgb);
	/*================*/
	/* Common Design Elements */
	--orange-dots: dotted 0.5rem var(--accessible-orange);
}

::selection { /* WebKit/Blink Browsers */
	background: var(--uva-blue);
	color: white;
	text-shadow: none;
}

::-moz-selection { /* Gecko Browsers */
	background: var(--uva-blue);
	color: white;
	text-shadow: none;
}

a {
	text-decoration: underline;
	text-underline-offset: 0.15rem;
}

	a:hover, a:focus {
		text-decoration: none;
	}

body {
	background-color: var(--uva-blue);
	font-family: var(--font-body-text);
}

	body.has-body-content main .container {
		max-width: 1100px;
	}

figcaption {
	font-family: var(--font-caption);
}

figure {
}

footer {
	color: var(--light-gray);
	font-family: var(--ringside-regular);
	--bs-nav-link-color: var(--light-gray);
	--bs-nav-link-hover-color: var(--light-gray);
}

	footer a {
		color: inherit;
	}

		footer a:focus, footer a:hover {
			color: white;
			text-decoration: none;
		}

	footer .nav-link {
		color: inherit;
		text-decoration: none;
	}

		footer .nav-link:focus, footer .nav-link:hover {
			color: white;
			text-decoration: underline;
		}

			footer .nav-link:focus .bi,
			footer .nav-link:hover .bi {
				color: var(--secondary-web-orange);
			}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-headings);
}

header.page-header {
	background-color: var(--light-gray);
	border-bottom: solid 1px var(--medium-gray);
}

main {
	background-color: white;
}

p:last-child,
li:last-child,
ul:last-child {
	margin-bottom: 0;
}

.archive-issue {
	font-family: var(--font-headings);
	font-weight: bold;
	position: relative;
	text-align: center;
}

	.archive-issue:hover img {
		opacity: 0.7;
		-moz-transform: scale(1.1);
		-webkit-transform: scale(1.1);
		transform: scale(1.1);
	}

	.archive-issue a {
		color: var(--secondary-web-orange);
		text-decoration: none;
	}

		.archive-issue a:hover {
			text-decoration: underline;
		}

	.archive-issue .img-container {
		position: relative;
		overflow: hidden;
	}

		.archive-issue .img-container img {
			border-radius: 0;
			-webkit-backface-visibility: hidden; /*Gets rid of wiggle in webkit browsers upon animation*/
			-webkit-transition: opacity 300ms ease-in-out, transform 300ms ease-in-out;
			-moz-transition: opacity 300ms ease-in-out, transform 300ms ease-in-out;
			-ms-transition: opacity 300ms ease-in-out, transform 300ms ease-in-out;
			-o-transition: opacity 300ms ease-in-out, transform 300ms ease-in-out;
			transition: opacity 300ms ease-in-out, transform 300ms ease-in-out;
		}

.article-card {
	background-color: transparent;
	border: none;
	border-radius: 0;
	margin-bottom: 1rem;
	height: 100%;
}

	.article-card:hover img {
		opacity: 0.7;
		-moz-transform: scale(1.1);
		-webkit-transform: scale(1.1);
		transform: scale(1.1);
	}

	.article-card .card-body {
		padding-left: 0;
		padding-right: 0;
	}

	.article-card .card-img-container {
		position: relative;
		overflow: hidden;
	}

		.article-card .card-img-container img {
			border-radius: 0;
			-webkit-backface-visibility: hidden; /*Gets rid of wiggle in webkit browsers upon animation*/
			-webkit-transition: opacity 300ms ease-in-out, transform 300ms ease-in-out;
			-moz-transition: opacity 300ms ease-in-out, transform 300ms ease-in-out;
			-ms-transition: opacity 300ms ease-in-out, transform 300ms ease-in-out;
			-o-transition: opacity 300ms ease-in-out, transform 300ms ease-in-out;
			transition: opacity 300ms ease-in-out, transform 300ms ease-in-out;
		}

	.article-card .card-title {
		font-size: 1.3rem;
		font-weight: bold;
	}

		.article-card .card-title a {
			color: var(--uva-blue);
			text-decoration: none;
		}

			.article-card .card-title a:hover {
				text-decoration: underline;
			}

.article-card--horizontal {
	border-bottom: solid 1px var(--medium-gray);
	height: auto;
	padding-bottom: 1rem;
}

	.article-card--horizontal:last-child {
		border-bottom: none;
		margin-bottom: 0;
		padding-bottom: 0;
	}

	.article-card--horizontal .card-body {
		padding-top: 0;
	}

.article-header {
	font-family: var(--font-body-headings);
	margin-bottom: 2rem;
	text-align: center;
}

	.article-header h1 {
		font-family: var(--font-headings);
		font-size: 3.5rem;
		font-weight: bold;
		line-height: 3.5rem;
		margin-bottom: 0.5em;
	}

	.article-header .subtitle {
		color: var(--bs-secondary-color);
		font-size: 2rem;
		line-height: 2rem;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 0.5em;
	}

	.article-header:not(.media-page-header) .subtitle {
		max-width: 800px;
	}

	.article-header .byline,
	.author /* Legacy */ {
		font-size: 1.4rem;
		font-weight: bold;
	}

	.article-header .byline-contributors {
		text-transform: uppercase;
	}

.article-sidebar { /* Generic styling for all article sidebars */
	font-family: var(--font-caption);
}

.article-sidebar--end { /* A sidebar that appears at the end of the article */
	border-top: var(--orange-dots);
	margin-top: 2rem;
	padding-top: 2rem;
}
	.article-sidebar--end + p + .ForMoreInfo,
	.article-sidebar--end + .ForMoreInfo {
		border-top: var(--orange-dots);
		margin-top: 2rem;
		padding-top: 2rem;
	}

.article-sidebar--gray-centered, .CenteredSidebar { /* The gray, centered sidebar, formerly known as CenteredSidebar. */
	background-color: var(--light-gray);
	border-top: solid 5px var(--text-gray);
	border-bottom: solid 5px var(--text-gray);
	clear: both;
	margin: 2rem auto;
	padding: 1rem;
}

.author-bio {
	font-size: 1.2rem;
}

.authors_index .author-bio {
}

.article .author-bio {
	border-left: solid 5px var(--uva-blue);
	font-style: italic;
	margin-top: 2rem;
	padding-left: 0.5rem;
}

	.article .author-bio cite, .article .author-bio em, .article .author-bio i {
		font-style: normal;
	}

.body-content {
	font-size: 1.2rem;
	line-height: 1.5;
}

	.body-content .lead, .body-content .intro {
		font-size: 1.5rem;
		line-height: 1.5;
	}

	.body-content > *:first-child {
		margin-top: 0 !important;
	}

	.body-content h2, .body-content h3, .body-content h4, .body-content h5, .body-content h6,
	.body-content .h2, .body-content .h3, .body-content .h4, .body-content .h5, .body-content .h6 {
		font-family: var(--font-body-headings);
		font-weight: bold;
	}

.btn {
	font-family: var(--font-buttons);
}

.btn-primary {
	--bs-btn-bg: var(--secondary-web-orange);
	--bs-btn-border-color: var(--bs-btn-bg);
	--bs-btn-disabled-bg: var(--bs-btn-bg);
	--bs-btn-disabled-border-color: var(--bs-btn-bg);
	--bs-btn-hover-bg: white;
	--bs-btn-hover-color: var(--secondary-web-orange);
	--bs-btn-hover-border-color: var(--secondary-web-orange);
	--bs-btn-active-bg: white;
	--bs-btn-active-color: var(--secondary-web-orange);
	--bs-btn-active-border-color: var(--secondary-web-orange);
	font-size: max(18px, 1rem); /* Ensures that we are always meeting the 18px/bold minimum for color contrast */
	font-weight: bold;
}

.btn-yellow {
	--bs-btn-bg: var(--yellow);
	--bs-btn-border-color: var(--bs-btn-bg);
	--bs-btn-disabled-bg: var(--bs-btn-bg);
	--bs-btn-disabled-border-color: var(--bs-btn-bg);
	--bs-btn-hover-bg: var(--dark-gray);
	--bs-btn-hover-color: var(--yellow);
	--bs-btn-hover-border-color: var(--yellow);
	--bs-btn-active-bg: var(--dark-gray);
	--bs-btn-active-color: var(--yellow);
	--bs-btn-active-border-color: var(--yellow);
}

.card-body {
	color: var(--text-gray);
	font-family: var(--font-card-text);
}

.card-title {
	color: var(--uva-blue);
	font-family: var(--font-card-headings);
}

.carousel.captions-below .carousel-caption {
	background-color: transparent;
	position: relative;
	left: 0;
	right: 0;
	bottom: 0;
	margin-bottom: 1rem;
}

.carousel.captions-below .carousel-indicators {
	bottom: 0.5rem;
	margin-bottom: 0;
}

.carousel-caption {
	background-color: rgba(255, 255, 255, 0.9);
	color: var(--text-gray);
	font-family: var(--font-card-text);
	font-size: 1.2rem;
	padding: 1rem;
}

	.carousel-caption a {
		color: var(--uva-blue);
	}

		.carousel-caption a:hover {
			text-decoration: none;
		}

.carousel-caption-title {
	font-family: var(--font-card-headings);
	font-size: 2.5rem;
	font-weight: bold;
}

.carousel-indicators [data-bs-target] {
	background-color: var(--uva-blue);
	opacity: 1;
}

.carousel-indicators .active {
	background-color: var(--secondary-web-orange);
}

@media only screen and (max-width: 767px) {
	.carousel-caption {
		left: auto;
		position: relative;
		right: auto;
	}

	.carousel-caption-title {
		font-size: 1.8rem;
	}
}

.credit {
	color: var(--text-gray);
	display: block;
	font-family: var(--font-credit);
	font-size: 0.9rem !important; /* The important is needed in case the credit is in a <p> tag, which would otherwise make it larger (1.2rem) */
	font-weight: 200;
	margin-top: 10px;
	text-transform: uppercase;
}

.dropcap {
	margin-top: 2.5rem;
}

	.dropcap:first-letter,
	.dropcap-container > p:not(.nodrop,.no-drop):first-of-type:first-letter,
	.article .body-content > p:not(.nodrop,.no-drop):first-of-type:first-letter {
		float: left;
		font-family: var(--font-headings);
		font-size: 90px;
		font-weight: bold;
		line-height: 60px;
		padding-right: 4px;
		padding-top: 4px;
		text-size-adjust: none;
	}

@supports (initial-letter: 3) or (-webkit-initial-letter: 3) {
	.dropcap:first-letter,
	.dropcap-container > p:not(.nodrop,.no-drop):first-of-type:first-letter,
	.article .body-content > p:not(.nodrop,.no-drop):first-of-type:first-letter {
		font-size: inherit;
		float: none;
		line-height: inherit;
		padding-top: 0;
		initial-letter: 3;
		-webkit-initial-letter: 3;
	}
}

.dropdown-menu {
	--bs-dropdown-link-active-bg: var(--medium-blue);
	--bs-dropdown-link-hover-bg: var(--medium-gray);
	--bs-dropdown-link-hover-color: black;
	font-family: var(--font-buttons);
}

.form-control {
	font-family: var(--font-buttons);
}

.full-bleed {
	position: relative;
}

	.full-bleed img {
		width: 100vw !important;
		position: relative;
		left: 50%;
		right: 50%;
		margin-left: -50vw;
		margin-right: -50vw;
		max-width: 100vw;
	}

.has-full-bleed {
	overflow-x: hidden;
}

.heading-bar {
	background-color: var(--uva-blue);
	color: var(--light-gray);
	margin-bottom: 1.5rem;
	padding: 0.25rem 1rem;
	text-transform: uppercase;
}

	.heading-bar h1, .heading-bar h2, .heading-bar h3, .heading-bar h4, .heading-bar h5, .heading-bar h6,
	.heading-bar h1, .heading-bar .h2, .heading-bar .h3, .heading-bar .h4, .heading-bar .h5, .heading-bar .h6 {
		font-weight: bold;
	}

.highlights {
	background-color: var(--light-gray);
	box-shadow: inset 0 8px 6px -6px rgba(0,0,0,0.3);
	padding: 1rem 0;
}

	.highlights h2 {
		border-bottom: solid 2px var(--text-gray);
		font-size: 1.7rem;
		font-weight: bold;
		margin-bottom: 1rem;
		padding-bottom: 0.2rem;
		text-transform: uppercase;
	}

.in-memoriam .pagination-container {
	padding-top: 1rem;
	margin-top: 1rem;
	border-top: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
}

.interstitial-link {
	--bs-link-color: var(--text-gray);
	--bs-link-color-rgb: var(--text-gray-rgb);
	--bs-link-hover-color: black;
	--bs-link-hover-color-rgb: 0, 0, 0;
	border-left: solid 5px var(--medium-gray);
	color: var(--text-gray);
	font-family: var(--sans-serif-text);
	margin: 1.5rem auto;
	padding-left: 1rem;
}

.intro-media {
	margin-bottom: 2rem;
}

.list-group {
	--bs-list-group-action-hover-bg: var(--medium-gray);
}

.list-with-icons {
	margin-left: 24px;
	text-indent: -12px;
}

.media-page figure {
	margin-bottom: 4rem;
}

	.media-page figure img {
		display: block;
		margin-left: auto;
		margin-right: auto;
		max-height: 80vh;
	}

.media-page figcaption {
	font-size: 1.2rem;
	margin: 0 auto;
	max-width: 800px;
	padding: 1rem;
}

.media-page-intro p {
	font-size: 1.3rem;
}

.media-page-header {
	margin-bottom: 1rem;
	text-align: left;
}

	.media-page-header h1 {
		margin-bottom: 0em;
	}

	.media-page-header .meta-information {
		margin-bottom: 1rem;
	}

	.media-page-header .subtitle {
		color: var(--light-gray);
		max-width: auto;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 0.5em;
	}

.meta-information {
	font-family: var(--font-caption);
}

.more_from_virginia_magazine {
}

	.more_from_virginia_magazine ul {
		padding-left: 0;
		list-style: none;
	}

	.more_from_virginia_magazine li {
		margin-bottom: 0.5rem;
	}

		.more_from_virginia_magazine li:last-of-type {
			margin-bottom: 0;
		}

		.more_from_virginia_magazine li a {
			font-weight: bold;
		}

.nav {
	--bs-nav-link-color: var(--secondary-web-orange);
	--bs-nav-link-hover-color: var(--uva-blue);
}

.navbar {
	color: var(--text-gray);
	font-family: var(--chronicle-text);
	text-transform: uppercase;
}

	.navbar .dropdown-menu {
		font-family: var(--ringside-narrow);
		text-transform: initial;
	}

	.navbar .nav-link {
		--bs-nav-link-hover-color: var(--uva-blue);
	}

		.navbar .nav-link:hover {
			text-decoration: underline var(--uva-orange);
			text-underline-offset: 0.25rem;
		}

.navbar-brand {
	--bs-navbar-brand-hover-color: var(--uva-blue);
	color: var(--uva-orange);
	font-family: var(--chronicle-display);
	font-size: 2.3rem;
	font-weight: bold;
	letter-spacing: -3px;
	line-height: 1;
	padding: 0;
}

.orange-text, .orange-txt {
	color: var(--secondary-web-orange);
	font-size: max(24px, 1rem); /* Ensures that it's always large enough */
}

.page-title {
	font-size: 3.5rem;
	font-weight: bold;
	line-height: 3.3rem;
}

.pagination-container {
	font-family: var(--font-buttons);
}

.pagination {
	--bs-pagination-bg: var(--uva-blue);
	--bs-pagination-border-color: var(--light-blue);
	--bs-pagination-color: white;
	--bs-pagination-hover-bg: white;
	--bs-pagination-hover-color: var(--uva-blue);
	--bs-pagination-focus-color: var(--uva-blue);
	--bs-pagination-active-bg: var(--light-blue);
	--bs-pagination-active-border-color: var(--light-blue);
	--bs-pagination-active-color: var(--uva-blue);
}

.photo-gallery-listings {
}

	.photo-gallery-listings .card {
		border-bottom: solid 1px var(--light-gray);
		margin-bottom: 2rem;
		padding-bottom: 1rem;
	}

	.photo-gallery-listings .card-title {
		font-size: 2rem;
	}

.quote {
	position: relative;
}

	.quote:not(.pull-box) a {
		text-decoration: none;
	}

		.quote:not(.pull-box) a:hover {
			text-decoration: underline;
			text-decoration-thickness: 2px;
		}


.related-content {
	font-family: var(--font-card-text);
	padding: 1rem 0;
}

	.related-content h2, .related-content h3, .related-content h4, .related-content h5, .related-content h6,
	.related-content .h2, .related-content .h3, .related-content .h4, .related-content .h5, .related-content .h6 {
		font-family: var(--font-body-headings);
		font-weight: bold;
	}

	.related-content a:hover {
		color: inherit;
		text-decoration: none;
	}

.sidebar-meta {
}

	.sidebar-meta p {
		font-size: 1.1rem;
		line-height: 1.3rem;
		margin-left: 24px;
		text-indent: -10px;
	}

	.sidebar-meta .bi {
		font-size: 1rem;
		margin-right: 4px;
	}

.sidebar-share a.channel {
	background-color: var(--uva-orange);
	border: solid 2px var(--uva-orange);
	border-radius: 50%;
	color: white;
	display: inline-flex;
	font-size: 1rem;
	line-height: 1rem;
	margin: 0.2rem;
	padding: 0.5rem;
	vertical-align: middle;
}

	.sidebar-share a.channel:first-of-type {
		margin-left: 0;
	}

	.sidebar-share a.channel:last-of-type {
		margin-right: 0;
	}

	.sidebar-share a.channel:hover,
	.sidebar-share a.channel:focus,
	.sidebar-share a.channel:active {
		background-color: white;
		color: var(--uva-orange);
		text-decoration: none;
	}

.sidebar-widget {
	font-family: var(--font-card-text);
}

.skippy {
	background-color: var(--uva-blue);
	color: var(--light-gray);
	font-family: var(--sans-serif-display);
}

	.skippy a {
		background-color: var(--uva-blue);
		color: var(--light-gray);
	}

.speech-bubble, .next-issue-question {
	background-color: var(--secondary-web-orange);
	border-radius: 2rem;
	clear: both;
	color: white !important;
	font-family: var(--sans-serif);
	font-size: 1.5rem;
	line-height: 1.5;
	margin: 2rem auto;
	padding: 1rem 3rem;
	position: relative;
}

	.speech-bubble:before, .next-issue-question:before {
		content: "";
		width: 0px;
		height: 0px;
		position: absolute;
		border-left: 24px solid var(--secondary-web-orange);
		border-right: 12px solid transparent;
		border-top: 12px solid var(--secondary-web-orange);
		border-bottom: 20px solid transparent;
		left: 2em;
		bottom: -24px;
	}

	.speech-bubble h2, .next-issue-question h2 {
		text-transform: uppercase;
	}

	.speech-bubble a:not(.btn), .next-issue-question a:not(.btn) {
		color: inherit;
	}

		.speech-bubble a:not(.btn):hover, .next-issue-question a:not(.btn):hover {
			color: inherit;
		}

	.speech-bubble.blue {
		background-color: var(--uva-blue);
	}

		.speech-bubble.blue:before {
			border-left-color: var(--uva-blue);
			border-top-color: var(--uva-blue);
		}

.stats {
	border: var(--orange-dots);
	border-left: none;
	border-right: none;
	font-family: var(--ringside-compressed);
	margin: 2rem 0;
	padding: 2rem 0;
}

	.stats a {
		color: inherit;
	}

	.stats dd {
		color: var(--medium-blue);
		font-size: 1.5rem;
		line-height: 1.2;
		text-align: center;
	}

	.stats dt {
		color: var(--accessible-orange);
		font-size: 4rem;
		font-weight: bold;
		line-height: 1;
		text-align: center;
	}

	.stats .inline-stat {
		text-align: center;
	}

		.stats .inline-stat > * {
			display: inline;
		}

	.stats .stat {
		margin-bottom: 2rem;
	}

		.stats .stat:last-child {
			margin-bottom: 0;
		}

.text-snippet {
}

/* UTILITIES */
.caption {
	font-family: var(--font-caption);
}

.serif {
	font-family: var(--serif);
}

.serif-display {
	font-family: var(--serif-display);
}

.serif-text {
	font-family: var(--serif-text);
}

.sans-serif {
	font-family: var(--sans-serif);
}

.sans-serif-display {
	font-family: var(--sans-serif-display);
}

.sans-serif-text {
	font-family: var(--sans-serif-text);
}
