/* Minification failed. Returning unminified contents.
(11,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(12,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(15,5): run-time error CSS1031: Expected selector, found '('
(15,5): run-time error CSS1025: Expected comma or open brace, found '('
(26,15): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(46,27): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(51,27): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(57,27): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(65,19): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(287,19): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(455,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(474,17): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(478,22): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(480,24): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(544,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(573,5): run-time error CSS1030: Expected identifier, found '.'
(573,20): run-time error CSS1031: Expected selector, found ')'
(573,20): run-time error CSS1025: Expected comma or open brace, found ')'
(582,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '@media'
(600,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '&'
(753,25): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(768,16): run-time error CSS1063: Expected calculation unit, found 'calc('
(768,16): run-time error CSS1064: Expected calculation product, found 'calc('
(768,16): run-time error CSS1019: Unexpected token, found 'calc('
(768,16): run-time error CSS1042: Expected function, found 'calc('
(768,28): run-time error CSS1063: Expected calculation unit, found 'var('
(768,28): run-time error CSS1064: Expected calculation product, found 'var('
(768,28): run-time error CSS1019: Unexpected token, found 'var('
(768,28): run-time error CSS1042: Expected function, found 'var('
(768,33): run-time error CSS1039: Token not allowed after unary operator: '-date-day'
(768,43): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(779,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '@media'
(798,25): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(815,25): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(834,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '@media'
(857,25): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(860,69): run-time error CSS1046: Expect comma, found '0'
(860,75): run-time error CSS1046: Expect comma, found '/'
(860,94): run-time error CSS1046: Expect comma, found '113'
(860,102): run-time error CSS1046: Expect comma, found '/'
(860,121): run-time error CSS1046: Expect comma, found '167'
(860,129): run-time error CSS1046: Expect comma, found '/'
(860,148): run-time error CSS1046: Expect comma, found '209'
(860,156): run-time error CSS1046: Expect comma, found '/'
(860,175): run-time error CSS1046: Expect comma, found '212'
(860,182): run-time error CSS1046: Expect comma, found '/'
(860,202): run-time error CSS1046: Expect comma, found '224'
(860,209): run-time error CSS1046: Expect comma, found '/'
(860,229): run-time error CSS1046: Expect comma, found '206'
(860,235): run-time error CSS1046: Expect comma, found '/'
(860,256): run-time error CSS1046: Expect comma, found '173'
(860,262): run-time error CSS1046: Expect comma, found '/'
(860,283): run-time error CSS1046: Expect comma, found '123'
(860,289): run-time error CSS1046: Expect comma, found '/'
(860,310): run-time error CSS1046: Expect comma, found '78'
(860,315): run-time error CSS1046: Expect comma, found '/'
(860,336): run-time error CSS1046: Expect comma, found '3'
(860,341): run-time error CSS1046: Expect comma, found '/'
(903,25): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(922,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '@media'
(946,25): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(966,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '@media'
(1032,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '@media'
(1117,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '&'
(1144,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '&'
(1361,14): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1376,29): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1382,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1390,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1490,14): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(1580,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(1599,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(2065,35): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(2070,35): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(2118,25): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(2938,37): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(2957,19): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(2959,72): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(2960,46): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(3030,22): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(3360,31): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(3370,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(3377,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(3450,35): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(3451,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(3530,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3531,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3532,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3533,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3534,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3535,25): run-time error CSS1039: Token not allowed after unary operator: '-brand-blue'
(3537,24): run-time error CSS1039: Token not allowed after unary operator: '-color-four'
(3537,45): run-time error CSS1039: Token not allowed after unary operator: '-color-three'
(3537,69): run-time error CSS1039: Token not allowed after unary operator: '-color-four'
(3538,24): run-time error CSS1039: Token not allowed after unary operator: '-color-four'
(3538,45): run-time error CSS1039: Token not allowed after unary operator: '-color-three'
(3538,69): run-time error CSS1039: Token not allowed after unary operator: '-color-four'
(3539,24): run-time error CSS1039: Token not allowed after unary operator: '-color-four'
(3539,45): run-time error CSS1039: Token not allowed after unary operator: '-color-three'
(3539,69): run-time error CSS1039: Token not allowed after unary operator: '-color-four'
(3540,34): run-time error CSS1039: Token not allowed after unary operator: '-color-one'
(3540,54): run-time error CSS1039: Token not allowed after unary operator: '-color-two'
(3541,33): run-time error CSS1039: Token not allowed after unary operator: '-color-one'
(3541,53): run-time error CSS1039: Token not allowed after unary operator: '-color-two'
(3542,37): run-time error CSS1039: Token not allowed after unary operator: '-stop-one'
(3550,15): run-time error CSS1039: Token not allowed after unary operator: '-color-one'
(3550,38): run-time error CSS1039: Token not allowed after unary operator: '-color-two'
(3550,68): run-time error CSS1039: Token not allowed after unary operator: '-color-three'
(3550,99): run-time error CSS1039: Token not allowed after unary operator: '-color-four'
(3551,10): run-time error CSS1039: Token not allowed after unary operator: '-stop-one'
(3554,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3555,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3556,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3557,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3558,2): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3564,31): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(3589,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(3629,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(3642,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(3660,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(3976,1): run-time error CSS1019: Unexpected token, found 'var('
(3976,5): run-time error CSS1019: Unexpected token, found '-'
(3976,22): run-time error CSS1031: Expected selector, found ')'
(3976,22): run-time error CSS1025: Expected comma or open brace, found ')'
(3990,1): run-time error CSS1019: Unexpected token, found 'var('
(3990,5): run-time error CSS1019: Unexpected token, found '-'
(3990,22): run-time error CSS1031: Expected selector, found ')'
(3990,22): run-time error CSS1025: Expected comma or open brace, found ')'
(3993,1): run-time error CSS1019: Unexpected token, found 'var('
(3993,5): run-time error CSS1019: Unexpected token, found '-'
(3993,22): run-time error CSS1031: Expected selector, found ')'
(3993,22): run-time error CSS1025: Expected comma or open brace, found ')'
 */
/* We use the broadest, but also least specific, reset here. */
* {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    vertical-align: baseline;
}

:root {
	--primary-color: #003e7e;
	--secondary-color: #0a79bf;
}

img (
	image-rendering: -webkit-optimize-contrast;
)

/* Link Styling */
a {
	color: var(--secondary-color);
	font-weight: bold; 
}

	a:hover {
		color: var(--primary-color);
	}

	a[href^="mailto:"] {
		font-family: 'Oswald', sans-serif; 
		font-weight:500;
	}

	a.modal.iframe, li>a.modal.iframe {
		font-family: 'Oswald', sans-serif; 
		font-weight:500;
	}


	
a:active, a:focus {
    outline: 0;
}

a:focus {
		outline: 2px solid var(--secondary-color);
		outline-offset: 2px;
	}

	a:focus img {
		outline: 2px solid var(--secondary-color);
		outline-offset: 2px;
	}

	.footer-site-info a:focus {
		filter: saturate(0.75);
		outline: 2px solid var(--secondary-color);
		outline-offset: 2px;
	}


/* Body definitions */
body {
	text-align: left;
	background: var(--primary-color);
    font: 100%/1.45 Verdana, Geneva, Arial, Helvetica, sans-serif; /* Controls font style (size, font face, color) throughout website */
	color: #333;
}

/* Image Styling */


/* List definitions */
ol, ul {
	list-style: none;
}

/* Table definitions */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}

/* Inline quotes and blockquotes */
q:before {
  content: '"';
}
q:after {
  content: '"';
}
blockquote, q {
	quotes: '"' '"';
}
blockquote { 
	text-indent: -1ex; 
	margin: 20px;
	color:#333;
}

/* Large pullquotes */
blockquote.big {
	font-size: 1.5em;
	line-height: 1.4em;
	text-align: right;
	color: #666;
	quotes:'\201C' '\201D';
}
blockquote:before {
	content: open-quote;
}
blockquote:after {
	content: close-quote;
}
blockquote.big:before, blockquote.big:after {
	font-family: Georgia, Serif;
	font-size:1.8em;
}
/*The figure class is used on divs in a handful of CMS articles to do pullquotes and sidebar blockquotes*/
.figure {
	display: block;
	float: right;
	padding: 0 0 0 10px;
	margin: 0 0 10px 10px;
	width: 260px;
	border-left: 3px solid #ccc;
}
.figure p {
	text-align: right;
	padding-right:20px;
	color:#666;
	margin-top: 7px;
	font-size: 0.90em;
}
.figure p:before {
	content: "\2014\00a0";
}

/* Common formatting - for now, ignore this section from the old common, and see if we can do without it */

/* Share Tools - Print, Email, Facebook, Twitter
-----------------------------------------------------------------------------*/
div.article-content-holder div.share-utility-box ul.page-tools-b.list-type-2 {
	float: right;
	width: 75%;
	padding: 0;
	margin: 0;
}
div.article-content-holder div.share-utility-box ul.page-tools-b.list-type-2 li {
	padding-bottom:0;
}
ul.page-tools-b {
	list-style: none;
	padding: 0;
	margin: 0 !important;
}

@media (max-width: 500px) {
	ul.page-tools-b {
		display: inline-grid;
		grid-gap: .5rem;
		grid-template-columns: 1fr 1fr;
	}
}

ul.page-tools-b li {
	padding: 0 !important;
	margin: 0;
	display:inline;
	float:left;
	list-style-type:none;
}
ul.page-tools-b li a, ul.page-tools-b li a:visited {
	color: #999;
	font-size:0.9em;
	display: block;
	padding: 0px;
	border-right: 1px dotted #ccc;
}
ul.page-tools-b li a.addthis_button_compact  {
	border-right: 0;
}
.addthis_default_style .at300b, .addthis_default_style .at300m {
	margin: 0px 10px 0px 0px;
	padding:0px 10px 0px 0px;
	display:block;
	float:none;
	line-height:12px; /*Important for padding*/
}
.addthis_default_style .at15t_twitter, .addthis_default_style .at15t_print, .addthis_default_style .at15t_email, .addthis_default_style .at15t_facebook {
    margin: 0px 5px 0 0;
	padding:0px;
}
.addthis_default_style .at15t_compact {
	padding:0 0.6em 0 0;
	margin:0 0 0 0;
}

/* --------------- Definition Lists ------------------*/

article dl, #content-wrapper-wide dl, body.mceContentBody dl {
	width:550px;
	margin:0 0 1.8em 0;
	margin-top: 10px;
	margin-left: 30px;
}
article dt, #content-wrapper-wide dt, body.mceContentBody dt {
	font-weight:bold;
	color: #333;
    font-size: 1.1em;
    margin: 20px 0 3px;	
}
article dt.indent, #content-wrapper-wide dt.indent, body.mceContentBody dt.indent
article dd.indent, #content-wrapper-wide dd.indent, body.mceContentBody dd.indent {
	margin-left:30px;
}
article dl.indent, #content-wrapper-wide dl.indent, body.mceContentBody dl.indent {
	margin-left:60px;
}
article dl.double-indent, #content-wrapper-wide dl.double-indent, body.mceContentBody dl.double-indent {
	margin-left:90px;
}
article dd ul, #content-wrapper-wide dd ul, body.mceContentBody dd ul {
	font-size:1em;
}
.isolate {
	margin-top:20px;
}
/*
.section-cartridge dt { was, now */
.associated-records dt {
	color: #333;
    font-size: 1.3em;
    margin: 20px 0 0;	
}
.associated-records dl {
	margin:0 20px;
	font-weight:bold;
    width: auto;
}
.detail-record dl {
	font-weight:normal;
}


/*Temporary dumping ground to test things that will get moved elsewhere later*/
a.feedback-button {
    font-family: 'Oswald', sans-serif;
    font-size: 1.4rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    writing-mode: vertical-lr;
    background-color: #003e73;
    position: fixed;
    top: 150px;
    left: -2px;
    z-index: 1000;
    padding: 8px;
    border: 2px solid white;
}
.promo920 {
    padding: 3.75rem 2rem;
	max-width: 80rem;
	margin:auto;
}

.promo920 img {
	width: 100%;
}


/*---------------------------------------------------------------------------


                         Link Bar 
                         ------------------------
   
				- this section styles the home page buttons
				- optional scripts and HTML for this on beta.wisconsinhistory.org


---------------------------------------------------------------------------*/
#link-bar {
	background: var(--primary-color);
}
#link-bar > div {
    display: inline-block;
    *zoom: 1;
    *display: inline;
    vertical-align: top;
    margin: 15px 0 0 20px;
}
#link-bar > div h1 {
	color:#fff;
	text-transform:uppercase;
	padding-bottom: 3px;
}
#link-bar li {
	margin-bottom:5px;
	padding-bottom: 0px ;
}

#link-bar a, #link-bar a:link, #link-bar a:active, #link-bar a:visited, #link-bar a:hover, #link-bar a:focus {
	color:#cacaca;
}
#link-bar a.disable:hover {
	color:#666 !important;
	text-decoration:none !important;
}
#link-bar a:hover {
	text-decoration:underline;
}

.social-media li a {
	background: url('/images/site/social-media-sprite-circle.png');
	display: block;
	width: 15px;
	height: 15px;
	padding: 0 0 0 26px;
}
.social-media li a.facebook {
	background-position: 0px 0px;
}
.social-media li a.facebook:hover  {
	background-position: 0px -15px;
}
/* 23 */
.social-media li a.flickr {
	background-position: -60px 0px;
}
.social-media li a.flickr:hover {
	background-position: -60px -15px;
}
/* 46 */
.social-media li a.rss {
	background-position: -120px 0px;
}
.social-media li a.rss:hover {
	background-position: -120px -15px;
}
/* 69 */
.social-media li a.tumblr {
	background-position: -180px 0px;
}
.social-media li a.tumblr:hover {
	background-position: -180px -15px;
}	
/* 92 */
.social-media li a.twitter {
	background-position: -240px 0px;
}
.social-media li a.twitter:hover {
	background-position: -240px -15px;
}			

/* 116 */
.social-media li a.youtube {
	background-position: -300px 0px;
}
.social-media li a.youtube:hover {
	background-position: -300px -15px;
}

/* 142 */

.social-media li a.e-newsletter {
	background-position: -360px 0px;
}
.social-media li a.e-newsletter:hover {
	background-position: -360px -15px;
}

/* 164 */
.social-media li a.pinterest {
	background-position: -420px 0px;
}
.social-media li a.pinterest:hover {
	background-position: -420px -15px;
}



/*---------------------------------------------------------------------------


                         EXTRA 


---------------------------------------------------------------------------*/

.buy-button {
	/*background: url('/images/site/BUY-button.gif') no-repeat 0 0 transparent;*/
    background: #ca6115 url('/images/site/box-orange-gradient.gif') top repeat-x;
	display: inline-block;
    *zoom: 1;
    *display: inline;
    vertical-align: top;
	width: 60px;
	height: 32px;
	padding: 4px 0 0 12px;
	margin: 10px 0 91px 20px;
	outline: none;
	border: none;
	color: #fff;
	font-family: Helvetica, Arial, Sans-serif, sans-serif;
	letter-spacing: -0.02em;
	font-weight: bold;
	text-transform: uppercase;
	font-size: 1.6em;
	cursor: pointer;
}


div.record-purchase-info {
    line-height: 1.3em;
    margin: 0 0 20px 20px;
    display: inline-block;
    *zoom: 1;
    *display: inline;
}




.full-record-disclaimer {
	border: 1px solid #ccc;
    padding: 1rem 1.5rem;
    font-size: 1rem;
    border-radius: 15px;
    background: #f1f1f1;
}

.full-record-disclaimer h1 {
	font-size: 1.3em;
    font-weight: bold;
}

.full-record-disclaimer p {
	line-height: 1.4em; 
	margin-bottom: 1em;
}

.vr-form {
	width:49%;
	display:inline-block;
}


.major-link {
    display: inline-block;
    padding: .5rem .75rem;
    border: 3px solid var(--primary-color);
    color: #003e73;
    font-family: 'Oswald', sans-serif;
    font-weight: 500;
    font-size: 1.4rem;
    line-height: 1.4rem;
    letter-spacing: 0.05em;
	text-transform: uppercase;
	margin: .25rem;
}

.reverse {
    color: #ffffff;
    border-color: #ffffff;
    text-transform: uppercase;
}

a.reverse:hover {
    text-decoration: underline;
    color: var(--secondary-color);
}

a.major-link:hover, a.reverse.major-link:hover {
    background: var(--secondary-color);
    color: #fff;
    border-color: var(--secondary-color);
	text-decoration: none;
	text-shadow: none;
    box-shadow: none;
}

.minor-link { /* THIS A BAD STYLE */
    display: inline-block;
    padding: .25rem .75rem;
    border: 3px solid #5c93b9; /*Brand Colors: light blue*/
    color: #5c93b9;
    font-family: 'Oswald', sans-serif;
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.4rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    width: auto;
}

.directions-link {
    display: inline-block;
    padding: 5px 15px;
    border-style: solid;
    border-width: 2px;
    border-color: #8b8f4f; /*Brand Colors: Green*/
    color: #8b8f4f;
    font-family: 'Oswald', sans-serif;
    font-weight: 500;
    font-size: 1rem;
    line-height: 1.4rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    width: auto;
}

.dark .major-link {
    border-color: white;
    color: white;
}

[type="submit"] {
    padding: 5px 15px;
    background-color: #ca6115;
    background-image: linear-gradient(rgba(102,102,102,0.35), transparent 50%);
    color: #fff;
    font-family: 'Oswald', sans-serif;
    font-weight: 500;
    letter-spacing: 0.05em;
}
[type="submit"]:hover {
    background-image: linear-gradient(transparent 50%, rgba(102,102,102,0.35));
}



.primary-action-button {
    background-color: #ca6115;
    font-size: 1.4rem;
    line-height: 1.4rem;
    text-transform: uppercase;
}

.secondary-action-button {
    background-color: var(--primary-color);
    font-size: 1rem;
    vertical-align: bottom;
    padding: 0 15px;
}

.card {
	 border: 1px solid #ccc; 
	 border-radius: 3px; 
	 box-shadow: 1px 1px 5px rgba(0, 0, 0, .2); 
	 background: #fff; min-height: 200px; 
	 padding: 1.5rem; 
	 margin-bottom: 1rem;
}


/* Some homepage code that needs a media query Must figure out better solution*/
#primary {
    grid-column: span 2;
}

@media (max-width: 730px) {
	#primary {
		 grid-column: span 1;
	}
}
/* End of that nonsense */

/* More nonsense */
:is(.pumpkin, .vine)::before, :is(.pumpkin, .vine)::after {
	content: '';
}

.showoff-box {
	display: grid;
	grid-template-columns: 1fr;
	background-color: #3d0050;
	
	@media (min-width: 500px) {
		grid-template-columns: 1fr 1fr;
	}
	@media (min-width: 750px) {
		grid-template-columns: 1fr 1fr 1fr;
	}
}

.pumpkin {
	grid-row: 2;
	place-self: center;
	margin-top: 50px;
	margin-bottom: 200px;
	position: relative;
	height: 1px;
	width: 200px;
	z-index: 2;
		
	&:first-child {
		display: none;
		@media (min-width: 500px) {
			display: block;
		}
	}
	&:last-child {
		display: none;
		@media (min-width: 750px) {
			display: block;
		}
	}
	
	&::before {
		position: absolute;
		left: 87px;
		top: -45px;
		
		height: 50px;
		width: 50px;
		border-left: 25px solid saddlebrown;
		border-top: 10px solid transparent;
		border-top-left-radius: 35px 50px;
	}
	
	&::after {
		position: absolute;
		
		height: 175px;
		width: 200px;
		border-radius: 45%;

		background-color: orange;

		background-image: 
			/* eyes */
			radial-gradient(ellipse at center, darkred 0%, darkred 40%, transparent 40%),
			radial-gradient(ellipse at center, darkred 0%, darkred 40%, transparent 40%),
			radial-gradient(ellipse at center, tomato 0%, tomato 40%, transparent 40%),
			radial-gradient(ellipse at center, tomato 0%, tomato 40%, transparent 40%),
			/* nose */
			radial-gradient(ellipse at center, darkred 0%, darkred 40%, transparent 40%),
			/* teeth */
			linear-gradient(50deg, transparent 50%, orange 50%),
			linear-gradient(-50deg, transparent 50%, orange 50%),
			linear-gradient(50deg, transparent 50%, orange 50%),
			linear-gradient(-50deg, transparent 50%, orange 50%),
			linear-gradient(50deg, transparent 50%, tomato 50%),
			linear-gradient(-50deg, transparent 50%, tomato 50%),
			/* mouth */
			radial-gradient(ellipse at center, white 0%, yellow 20%, transparent 40%),
			radial-gradient(ellipse at top, brown 0%, brown 60%, transparent 60%),
			radial-gradient(ellipse at top, tomato 0%, tomato 60%, transparent 60%),
			radial-gradient(ellipse at center, transparent 0%, transparent 49%, tomato 49.5%, tomato 50.5%, transparent 51%)
		;
		background-size:
			/* eyes */
			50px 50px,
			50px 50px,
			50px 50px,
			50px 50px,
			/* nose */
			50px 50px,
			/* teeth */
			20px 20px,
			20px 20px,
			20px 20px,
			20px 20px,
			20px 20px,
			20px 20px,
			/* mouth */
			40px 60px,
			150px 45px,
			156px 46px,
			180px 350px
		;
		background-position:
			/* eyes */
			40px 30px,
			110px 30px,
			37px 30px,
			113px 30px,
			/* nose */
			75px 65px,
			/* teeth */
			50px 120px,
			70px 120px,
			110px 120px,
			130px 120px,
			108px 120px,
			72px 120px,
			/* mouth */
			80px 110px,
			25px 120px,
			22px 120px,
			10px -87.5px
		;
		background-repeat: no-repeat;
		
		box-shadow: inset 5px 0 5px tomato, inset -5px 0 5px tomato;
		
		animation: flicker 1s infinite alternate;
	}
}

@keyframes flicker {
	to {
		background-size:
			/* eyes */
			50px 50px,
			50px 50px,
			50px 50px,
			50px 50px,
			/* nose */
			50px 50px,
			/* teeth */
			20px 20px,
			20px 20px,
			20px 20px,
			20px 20px,
			20px 20px,
			20px 20px,
			/* mouth */
			40px 50px,
			150px 45px,
			156px 46px,
			180px 350px
		;
		background-position:
			/* eyes */
			40px 30px,
			110px 30px,
			37px 30px,
			113px 30px,
			/* nose */
			75px 65px,
			/* teeth */
			50px 120px,
			70px 120px,
			110px 120px,
			130px 120px,
			108px 120px,
			72px 120px,
			/* mouth */
			80px 120px,
			25px 120px,
			22px 120px,
			10px -87.5px
		;
	}
}

.corn-background {
	background-color: var(--secondary-color);
	background-image:
		linear-gradient(transparent 575px, white 575px),
		url("data:image/svg+xml,<?xml version='1.0' encoding='iso-8859-1'?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --><svg xmlns='http://www.w3.org/2000/svg' height='800px' width='400px' viewBox='512 0 2304 4608' ><style>.yellow {fill:%23EEBF00;}.light-green {fill:%2381c75b}.green {fill:%2364C37D;}.dark-green {fill: %234e9984;}.see-through {fill: transparent;}</style><g id='cob'><path class='yellow' d='M295.537,76.766c-6.032-3.052-12.458-5.422-19.184-7.017c-3.716-0.881-7.516-1.547-11.396-1.938c-2.898-0.291-5.84-0.443-8.814-0.443s-5.916,0.152-8.814,0.443c-3.88,0.389-7.68,1.055-11.396,1.938c-6.726,1.595-13.153,3.967-19.184,7.017c-28.553,14.446-48.186,44.055-48.186,78.181v81.183c7.047,6.869,13.79,13.998,20.211,21.377c7.137,8.205,13.879,16.714,20.211,25.496c1.245,1.727,2.474,3.464,3.686,5.213c0.381,0.548,0.751,1.105,1.128,1.655c0.823,1.202,1.651,2.4,2.459,3.611c0.594,0.892,1.175,1.793,1.764,2.691c0.575,0.878,1.159,1.753,1.726,2.637c0.684,1.064,1.35,2.138,2.022,3.209c0.455,0.725,0.92,1.446,1.369,2.173c0.756,1.222,1.492,2.455,2.233,3.686c0.352,0.586,0.71,1.165,1.06,1.753c0.808,1.362,1.598,2.734,2.386,4.107c0.265,0.463,0.54,0.922,0.806,1.386c0.827,1.455,1.637,2.918,2.444,4.384c0.216,0.389,0.437,0.776,0.649,1.165c0.864,1.58,1.708,3.172,2.548,4.766c0.147,0.278,0.299,0.554,0.445,0.831c0.876,1.677,1.737,3.363,2.587,5.054c0.1,0.199,0.205,0.397,0.306,0.597c0.869,1.737,1.721,3.482,2.561,5.232c0.075,0.158,0.155,0.314,0.23,0.473c0.885,1.849,1.753,3.704,2.606,5.567c0.027,0.059,0.055,0.119,0.084,0.178c0.866,1.898,1.717,3.804,2.551,5.718c0.012,0.028,0.026,0.057,0.036,0.084c0.843,1.936,1.668,3.878,2.478,5.829c0.003,0.007,0.005,0.013,0.009,0.02c1.622,3.915,3.176,7.862,4.661,11.838v0.001c0.779,2.088,1.543,4.184,2.282,6.288c0.015,0.038,0.028,0.075,0.04,0.112c0,0.003,0.003,0.004,0.003,0.007c11.322-32.186,27.202-62.583,47.155-90.259c6.331-8.785,13.074-17.293,20.211-25.499c6.42-7.382,13.165-14.512,20.211-21.381v-81.183C343.72,120.821,324.089,91.213,295.537,76.766z'/><path class='light-green' d='M404.352,121.263c-11.162,0-20.211,9.049-20.211,20.211v60.68c-14.403,10.399-27.895,21.769-40.421,33.981c-7.045,6.869-13.79,13.999-20.211,21.381c-7.137,8.205-13.879,16.715-20.211,25.499c-19.953,27.675-35.833,58.073-47.155,90.259c0-0.003-0.003-0.004-0.003-0.007c-0.013-0.038-0.027-0.075-0.04-0.112c-0.036-0.101-0.074-0.201-0.109-0.302c-0.706-2.002-1.432-3.998-2.173-5.985v-0.001c-1.485-3.975-3.038-7.921-4.661-11.838c-0.004-0.007-0.007-0.013-0.009-0.02c-0.808-1.951-1.636-3.894-2.478-5.829c-0.012-0.028-0.026-0.055-0.036-0.084c-0.834-1.913-1.684-3.82-2.551-5.718c-0.028-0.059-0.057-0.119-0.084-0.178c-0.853-1.863-1.721-3.72-2.606-5.567c-0.075-0.159-0.155-0.315-0.23-0.473c-0.841-1.75-1.694-3.496-2.561-5.232c-0.1-0.199-0.205-0.396-0.306-0.597c-0.85-1.691-1.711-3.378-2.587-5.054c-0.146-0.279-0.298-0.554-0.445-0.831c-0.839-1.594-1.684-3.185-2.548-4.766c-0.213-0.391-0.434-0.776-0.649-1.165c-0.807-1.466-1.617-2.931-2.444-4.384c-0.264-0.465-0.539-0.923-0.806-1.386c-0.79-1.372-1.579-2.745-2.386-4.107c-0.35-0.587-0.709-1.168-1.06-1.753c-0.741-1.231-1.478-2.464-2.233-3.686c-0.449-0.729-0.913-1.448-1.369-2.173c-0.672-1.071-1.338-2.145-2.022-3.209c-0.567-0.884-1.151-1.758-1.726-2.637c-0.587-0.897-1.168-1.799-1.764-2.691c-0.81-1.21-1.636-2.409-2.459-3.611c-0.377-0.55-0.746-1.106-1.128-1.655c-1.213-1.748-2.443-3.486-3.686-5.213c-6.331-8.782-13.074-17.291-20.211-25.496c-6.42-7.38-13.164-14.508-20.211-21.377c-12.526-12.209-26.016-23.58-40.421-33.978v-60.684c0-11.162-9.049-20.211-20.211-20.211s-20.211,9.049-20.211,20.211v67.611c-0.381,2.253-0.376,4.537,0,6.761v127.733c0,92.818,75.474,168.338,168.272,168.42c0.05,0,0.1,0.001,0.15,0.001c92.867,0,168.421-75.554,168.421-168.421V212.655v-0.034v-3.778v-67.37C424.562,130.312,415.515,121.263,404.352,121.263z'/><path class='green' d='M247.327,67.812c2.898-0.291,5.839-0.443,8.814-0.443c2.975,0,5.916,0.152,8.814,0.443c3.88,0.389,7.68,1.055,11.396,1.938c6.726,1.595,13.153,3.967,19.184,7.017l15.317-15.318c7.893-7.892,7.893-20.689,0-28.582c-7.892-7.893-20.689-7.893-28.582,0l-5.919,5.919V20.211C276.352,9.049,267.303,0,256.141,0s-20.211,9.049-20.211,20.211v18.576l-5.92-5.919c-7.892-7.893-20.689-7.893-28.582,0c-7.893,7.892-7.893,20.689,0,28.582l15.317,15.318c6.032-3.052,12.458-5.422,19.184-7.017C239.647,68.867,243.448,68.201,247.327,67.812z'/></g><g id='stalk'><rect width='128' height='3584' x='0' y='1024' class='green' /></g><g id='leaf'><path class='dark-green' d='M256,0 q64,0 96,64 q32,64 32,448 v192 q0,64 -96,64 q-96,0 -96,-64 v-192 q0,-448 32-448 z' /><path class='green' d='M0,256 Q128,0 256,0 q64,0 96,64 q32,64 32,448 q0,-384 -92,-384 Q128,64 0,256 z' /><rect class='green' width='48' height='256' x='264' y='704' /></g><g id='reversed-leaf'><path class='dark-green' d='M256,0 q-64,0 -96,64 q-32,64 -32,448 v192 q0,64 96,64 q96,0 96,-64 v-192 q0,-448 -32-448 z' /><path class='green' d='M512,256 Q384,0 256,0 q-64,0 -96,64 q-32,64 -32,448 q0,-384 92,-384 Q384,64 512,256 z' /><rect class='green' width='48' height='256' x='200' y='704' /></g><g id='tassel' transform=''><path class='yellow' d='M0,0 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 z' /><path class='yellow' transform='translate(0,256)' d='M0,0 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 z' /><path class='yellow' transform='rotate(5, 0, 512)' d='M0,0 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 z' /><path class='yellow' transform='rotate(10, 0, 512)' d='M0,0 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 z' /><path class='yellow' transform='rotate(-5, 0, 512)' d='M0,0 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 z' /><path class='yellow' transform='rotate(-10, 0, 512)' d='M0,0 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q32,32 0,64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 q-32,-32 0-64 z' /></g><g transform='translate(120,128)'><use href='%23stalk' x='960'/><use href='%23tassel' x='992' y='256' /><use href='%23leaf' x='716' y='3072' transform='rotate(-20,960,4096)' /><use href='%23leaf' x='716' y='2560' transform='rotate(-20,960,3536)' /><use href='%23leaf' x='716' y='2048' transform='rotate(-20,960,3072)' /><use href='%23leaf' x='716' y='1536' transform='rotate(-20,960,2560)' /><use href='%23leaf' x='716' y='1024' transform='rotate(-20,960,2048)' /><use href='%23leaf' x='716' y='512' transform='rotate(-10,960,1536)' /><use href='%23reversed-leaf' x='828' y='3072' transform='rotate(20,960,4096)' /><use href='%23reversed-leaf' x='828' y='2560' transform='rotate(20,960,3536)' /><use href='%23reversed-leaf' x='828' y='2048' transform='rotate(20,960,3072)' /><use href='%23reversed-leaf' x='828' y='1536' transform='rotate(20,960,2560)' /><use href='%23reversed-leaf' x='828' y='1024' transform='rotate(20,960,2048)' /><use href='%23reversed-leaf' x='828' y='512' transform='rotate(5,960,1536)' /><use href='%23cob' x='768' y='2560' transform='rotate(20,1024,3072)' /><use href='%23cob' x='768' y='1788' /><use href='%23cob' x='768' y='1024' transform='rotate(-20,1024,1536)' /></g><g transform='translate(1256,128)'><use href='%23stalk' x='960'/><use href='%23tassel' x='992' y='256' /><use href='%23leaf' x='716' y='3072' transform='rotate(-20,960,4096)' /><use href='%23leaf' x='716' y='2560' transform='rotate(-20,960,3536)' /><use href='%23leaf' x='716' y='2048' transform='rotate(-20,960,3072)' /><use href='%23leaf' x='716' y='1536' transform='rotate(-20,960,2560)' /><use href='%23leaf' x='716' y='1024' transform='rotate(-20,960,2048)' /><use href='%23leaf' x='716' y='512' transform='rotate(-10,960,1536)' /><use href='%23reversed-leaf' x='828' y='3072' transform='rotate(20,960,4096)' /><use href='%23reversed-leaf' x='828' y='2560' transform='rotate(20,960,3536)' /><use href='%23reversed-leaf' x='828' y='2048' transform='rotate(20,960,3072)' /><use href='%23reversed-leaf' x='828' y='1536' transform='rotate(20,960,2560)' /><use href='%23reversed-leaf' x='828' y='1024' transform='rotate(20,960,2048)' /><use href='%23reversed-leaf' x='828' y='512' transform='rotate(5,960,1536)' /><use href='%23cob' x='768' y='2560' transform='rotate(-20,1024,3072)' /><use href='%23cob' x='768' y='1788' /><use href='%23cob' x='768' y='1024' transform='rotate(20,1024,1536)' /></g><g transform='translate(-512)'><use href='%23stalk' x='960'/><use href='%23tassel' x='992' y='256' /><use href='%23leaf' x='716' y='3072' transform='rotate(-20,960,4096)' /><use href='%23leaf' x='716' y='2560' transform='rotate(-20,960,3536)' /><use href='%23leaf' x='716' y='2048' transform='rotate(-20,960,3072)' /><use href='%23leaf' x='716' y='1536' transform='rotate(-20,960,2560)' /><use href='%23leaf' x='716' y='1024' transform='rotate(-20,960,2048)' /><use href='%23leaf' x='716' y='512' transform='rotate(-10,960,1536)' /><use href='%23reversed-leaf' x='828' y='3072' transform='rotate(20,960,4096)' /><use href='%23reversed-leaf' x='828' y='2560' transform='rotate(20,960,3536)' /><use href='%23reversed-leaf' x='828' y='2048' transform='rotate(20,960,3072)' /><use href='%23reversed-leaf' x='828' y='1536' transform='rotate(20,960,2560)' /><use href='%23reversed-leaf' x='828' y='1024' transform='rotate(20,960,2048)' /><use href='%23reversed-leaf' x='828' y='512' transform='rotate(5,960,1536)' /><use href='%23cob' x='768' y='2560' transform='rotate(-20,1024,3072)' /><use href='%23cob' x='768' y='1788' /><use href='%23cob' x='768' y='1024' transform='rotate(20,1024,1536)' /></g><g transform='translate(1792)'><use href='%23stalk' x='960'/><use href='%23tassel' x='992' y='256' /><use href='%23leaf' x='716' y='3072' transform='rotate(-20,960,4096)' /><use href='%23leaf' x='716' y='2560' transform='rotate(-20,960,3536)' /><use href='%23leaf' x='716' y='2048' transform='rotate(-20,960,3072)' /><use href='%23leaf' x='716' y='1536' transform='rotate(-20,960,2560)' /><use href='%23leaf' x='716' y='1024' transform='rotate(-20,960,2048)' /><use href='%23leaf' x='716' y='512' transform='rotate(-10,960,1536)' /><use href='%23reversed-leaf' x='828' y='3072' transform='rotate(20,960,4096)' /><use href='%23reversed-leaf' x='828' y='2560' transform='rotate(20,960,3536)' /><use href='%23reversed-leaf' x='828' y='2048' transform='rotate(20,960,3072)' /><use href='%23reversed-leaf' x='828' y='1536' transform='rotate(20,960,2560)' /><use href='%23reversed-leaf' x='828' y='1024' transform='rotate(20,960,2048)' /><use href='%23reversed-leaf' x='828' y='512' transform='rotate(5,960,1536)' /><use href='%23cob' x='768' y='2560' transform='rotate(-20,1024,3072)' /><use href='%23cob' x='768' y='1788' /><use href='%23cob' x='768' y='1024' transform='rotate(20,1024,1536)' /></g><g transform='translate(720)'><use href='%23stalk' x='960'/><use href='%23tassel' x='992' y='256' /><use href='%23leaf' x='716' y='3072' transform='rotate(-20,960,4096)' /><use href='%23leaf' x='716' y='2560' transform='rotate(-20,960,3536)' /><use href='%23leaf' x='716' y='2048' transform='rotate(-20,960,3072)' /><use href='%23leaf' x='716' y='1024' transform='rotate(-20,960,2048)' /><use href='%23leaf' x='716' y='1536' transform='rotate(-20,960,2560)' /><use href='%23leaf' x='716' y='512' transform='rotate(-10,960,1536)' /><use href='%23reversed-leaf' x='828' y='3072' transform='rotate(20,960,4096)' /><use href='%23reversed-leaf' x='828' y='2560' transform='rotate(20,960,3536)' /><use href='%23reversed-leaf' x='828' y='2048' transform='rotate(20,960,3072)' /><use href='%23reversed-leaf' x='828' y='1024' transform='rotate(20,960,2048)' /><use href='%23cob' x='768' y='1788' transform='rotate(20,1024,2300)' /><use href='%23reversed-leaf' x='828' y='1536' transform='rotate(20,960,2560)' /><use href='%23reversed-leaf' x='828' y='512' transform='rotate(5,960,1536)' /><use href='%23cob' x='768' y='2560' transform='rotate(-20,1024,3072)' /><use href='%23cob' x='768' y='1024' /></g></svg>"),
		radial-gradient(closest-side at 50% 88%, green 112%, transparent 113%),
		radial-gradient(closest-side at 50% 88%, darkgreen 112%, transparent 113%),
		url("data:image/svg+xml,<svg width='80px' height='80px' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M3 13.6493C3 16.6044 5.41766 19 8.4 19L16.5 19C18.9853 19 21 16.9839 21 14.4969C21 12.6503 19.8893 10.9449 18.3 10.25C18.1317 7.32251 15.684 5 12.6893 5C10.3514 5 8.34694 6.48637 7.5 8.5C4.8 8.9375 3 11.2001 3 13.6493Z' stroke='%23dcdcff' fill='%23dcdcff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");
	background-size:
		100% 100%,
		400px 800px,
		50% 52%,
		50% 51%,
		33% 40%;
	background-position:
		0 0,
		0 calc(80% - calc(3.2% * var(--date-day))),
		0 0,
		50% 0,
		0 -10%;
	background-repeat:
		no-repeat,
		repeat-x,
		repeat,
		repeat,
		repeat;
	
	@media (max-width: 950px) {
		background-position:
			0 0,
			0 calc(50% - calc(1.8% * var(--date-day))),
			0 0,
			50% 0,
			0 -10%;
		}
	@media (max-width: 600px) {
		background-position:
			0 0,
			0 calc(30% - calc(1% * var(--date-day))),
			0 0,
			50% 0,
			0 -10%;
	}
}

.leaves-background {
	background-color: var(--secondary-color);
	background-image:
		linear-gradient(transparent 575px, white 575px),
		url("data:image/svg+xml,<?xml version='1.0'?><svg xmlns='http://www.w3.org/2000/svg' width='900px' height='600px' viewBox='800 0 3060 2040'><style>:root {--date-day: 4;}.maple-color {fill: hsl(calc(124 - 4 * var(--date-day)), 92%, 60%);}.oak-color {fill: hsl(calc(94 - 4 * var(--date-day)), 92%, 60%);}.pointy-color {fill: hsl(calc(64 - 4 * var(--date-day)), 92%, 60%);}.leaf-vein {fill: %23333;}</style><g id='maple'><path class='maple-color' d='M502.722,364.874l-25.221,25.221c-54.202,54.202-142.073,54.202-196.276,0l-25.221-25.221l-25.233,25.221c-54.19,54.202-142.073,54.202-196.276,0L9.274,364.874l25.221-25.221c15.993-15.993,34.918-27.225,55.031-33.78c-25.839-29.872-41.462-68.81-41.462-111.398v-37.541h37.541c25.085,0,48.908,5.43,70.356,15.165c4.465-36.415,20.669-71.668,48.624-99.622l51.419-51.419l51.407,51.419c27.955,27.955,44.171,63.207,48.636,99.622c21.448-9.735,45.272-15.165,70.356-15.165h37.528v37.541c0,42.587-15.622,81.526-41.449,111.398c20.112,6.556,39.037,17.787,55.019,33.78L502.722,364.874z'/><g><path class='leaf-vein' d='M509.283,358.312l-25.225-25.225l0,0c-13.492-13.491-29.037-24.016-46.338-31.393c22.971-30.875,35.492-68.473,35.492-107.223v-37.536c0-5.123-4.154-9.277-9.277-9.277h-37.536c-21.776,0-42.92,3.817-63.014,11.36c-6.721-35.363-23.657-67.348-49.411-93.104L262.561,14.5c-1.739-1.739-4.099-2.718-6.559-2.718c-2.46,0-4.82,0.977-6.559,2.718l-51.415,51.415c-25.754,25.754-42.69,57.741-49.412,93.104c-20.094-7.543-41.237-11.36-63.014-11.36H48.063c-5.123,0-9.277,4.154-9.277,9.277v37.536c0,38.75,12.523,76.348,35.492,107.223c-17.302,7.377-32.844,17.901-46.338,31.393L2.717,358.312c-3.623,3.623-3.623,9.496,0,13.119l25.225,25.225c27.966,27.966,65.148,43.367,104.697,43.367s76.732-15.401,104.697-43.367l9.388-9.388v103.674c0,5.123,4.154,9.277,9.277,9.277s9.277-4.154,9.277-9.277V387.267l9.387,9.387c27.966,27.966,65.148,43.367,104.697,43.367s76.732-15.401,104.697-43.367l25.225-25.225C512.906,367.808,512.906,361.935,509.283,358.312z M470.94,383.536c-24.461,24.461-56.984,37.933-91.577,37.933c-34.594,0-67.117-13.471-91.578-37.933l-25.225-25.225c-1.739-1.739-4.099-2.718-6.559-2.718c-2.46,0-4.82,0.977-6.559,2.718l-25.225,25.225c-24.461,24.461-56.984,37.933-91.578,37.933c-34.593,0-67.116-13.471-91.577-37.933L22.397,364.87l18.664-18.664c14.549-14.547,31.821-25.15,51.336-31.511c2.954-0.964,5.23-3.341,6.062-6.334c0.832-2.993,0.111-6.204-1.921-8.555C71.26,270.575,57.339,233.166,57.339,194.47v-28.259h28.26c23.192,0,45.573,4.822,66.522,14.33c2.688,1.221,5.799,1.089,8.374-0.356s4.308-4.03,4.668-6.96c4.411-35.951,20.312-68.522,45.98-94.191l44.856-44.855l44.855,44.855c25.669,25.67,41.569,58.241,45.98,94.191c0.36,2.932,2.093,5.515,4.668,6.96c2.577,1.445,5.686,1.577,8.374,0.356c20.949-9.51,43.33-14.33,66.522-14.33h28.259v28.259c0,38.696-13.922,76.106-39.199,105.337c-2.032,2.35-2.753,5.561-1.921,8.555c0.832,2.993,3.108,5.371,6.062,6.334c19.516,6.362,36.789,16.963,51.337,31.511l18.664,18.665L470.94,383.536z'/><path class='leaf-vein' d='M256,121.976c-5.123,0-9.277,4.154-9.277,9.277V276.4c0,5.123,4.154,9.277,9.277,9.277c5.123,0,9.277-4.154,9.277-9.277V131.253C265.277,126.13,261.124,121.976,256,121.976z'/><path class='leaf-vein' d='M299.788,298.681c0.886,0,1.786-0.127,2.678-0.396c33.231-10.002,66.826-30.401,99.851-60.632c3.78-3.46,4.039-9.328,0.579-13.106c-3.46-3.78-9.329-4.039-13.106-0.579c-30.952,28.332-62.13,47.358-92.671,56.551c-4.906,1.477-7.686,6.651-6.209,11.557C292.117,296.091,295.801,298.681,299.788,298.681z'/><path class='leaf-vein' d='M414.894,362.252c-29.705,0.658-74.196-17.102-119.077-47.492c-4.244-2.873-10.01-1.763-12.883,2.48c-2.873,4.243-1.763,10.01,2.48,12.884c47.051,31.861,94.687,50.699,127.998,50.699c0.633,0,1.265-0.007,1.889-0.021c5.122-0.113,9.183-4.356,9.07-9.479C424.261,366.2,420.021,362.153,414.894,362.252z'/><path class='leaf-vein' d='M209.535,298.285c0.892,0.268,1.791,0.396,2.678,0.396c3.987,0,7.671-2.591,8.88-6.605c1.477-4.906-1.304-10.08-6.209-11.557c-30.54-9.193-61.719-28.219-92.671-56.551c-3.78-3.46-9.647-3.201-13.106,0.579c-3.46,3.779-3.2,9.647,0.579,13.106C142.709,267.884,176.303,288.284,209.535,298.285z'/><path class='leaf-vein' d='M216.182,314.759c-44.881,30.391-89.374,48.163-119.077,47.492c-0.071-0.001-0.139-0.003-0.208-0.003c-5.028,0-9.159,4.02-9.271,9.073c-0.113,5.122,3.948,9.366,9.07,9.479c0.626,0.014,1.253,0.021,1.889,0.021c33.312,0,80.949-18.84,127.998-50.699c4.243-2.873,5.353-8.641,2.48-12.884C226.193,312.997,220.424,311.887,216.182,314.759z'/></g></g><g id='oak'><path class='oak-color' d='M429.747,220.305l-109.22,92.359c-11.97,10.126-1.982,29.45,13.196,25.544l23.757-6.105c21.397-5.498,36.002,21.168,19.851,36.231l-59.862,55.864c-8.339,7.778-18.007,13.837-28.431,17.949c-10.435,4.112-21.626,6.277-33.035,6.277c-22.818,0-44.788-8.66-61.466-24.227l-59.874-55.864c-16.151-15.063-1.535-41.729,19.851-36.231l23.768,6.105c15.177,3.906,25.154-15.418,13.196-25.544L82.247,220.306c-30.847-26.094,2.142-74.432,37.674-55.223l32.153,17.377c13.253,7.159,26.506-9.473,16.563-20.79l-55.819-63.528c-20.607-23.459,8.694-57.25,34.834-40.172l38.087,20.092c14.353,7.56,31.603-2.841,31.603-19.072V47.248c0-10.676,4.33-20.344,11.329-27.342c6.987-6.987,16.655-11.317,27.331-11.317c21.352,0,38.66,17.308,38.66,38.66v11.741c0,16.231,17.251,26.632,31.603,19.072l38.075-20.092c26.14-17.079,55.441,16.712,34.834,40.172l-55.819,63.528c-9.943,11.317,3.322,27.949,16.575,20.79l32.142-17.377C427.617,145.873,460.595,194.212,429.747,220.305z'/><path class='leaf-vein' d='M442.902,170.863c-10.329-15.137-31.918-25.767-54.915-13.337L355.843,174.9c-3.266,1.765-5.41-0.293-6.18-1.261c-0.771-0.967-2.298-3.518,0.151-6.306l55.814-63.523c12.013-13.675,12.077-32.829,0.152-46.583c-11.83-13.646-30.599-16.363-45.775-6.683l-37.752,19.913c-4.112,2.17-8.756,2.037-12.739-0.365c-3.983-2.402-6.267-6.447-6.267-11.097V47.248C303.247,21.196,282.053,0,255.999,0S208.75,21.196,208.75,47.248v11.747c0,4.651-2.284,8.695-6.267,11.097c-3.98,2.402-8.622,2.536-12.738,0.365l-37.753-19.912c-15.175-9.68-33.945-6.962-45.775,6.683c-11.924,13.754-11.86,32.908,0.155,46.583l55.813,63.523c2.449,2.788,0.922,5.338,0.151,6.305c-0.77,0.967-2.913,3.026-6.181,1.261l-32.144-17.374c-22.999-12.433-44.587-1.8-54.915,13.337C58.767,186,56.743,209.979,76.704,226.86l109.225,92.367c3.475,2.939,2.023,6.504,1.495,7.527c-0.529,1.022-2.586,4.27-7.003,3.137l-23.762-6.109c-13.465-3.462-26.999,2.404-33.679,14.597c-6.68,12.192-4.339,26.757,5.825,36.241l59.87,55.864c16.229,15.143,36.828,24.251,58.735,26.148v46.775c0,4.745,3.845,8.591,8.591,8.591c4.746,0,8.591-3.846,8.591-8.591v-46.775c21.908-1.897,42.506-11.003,58.735-26.148l59.868-55.864c10.165-9.484,12.506-24.049,5.826-36.241c-6.679-12.192-20.214-18.058-33.678-14.597l-23.763,6.109c-4.413,1.134-6.474-2.115-7.002-3.137c-0.528-1.023-1.982-4.588,1.495-7.527l109.225-92.367C455.257,209.98,453.232,186,442.902,170.863z M424.2,213.741l-109.225,92.367c-8.494,7.183-10.771,18.649-5.665,28.532c5.105,9.883,15.777,14.661,26.546,11.892l23.763-6.109c7.068-1.814,12.035,2.018,14.333,6.212s2.852,10.448-2.48,15.424l-59.869,55.864c-13.032,12.161-29.479,19.605-47.012,21.448V405.75l35.85-26.632c3.809-2.829,4.602-8.211,1.773-12.019c-2.829-3.809-8.212-4.601-12.019-1.773l-25.603,19.019V287.81l35.85-26.632c3.809-2.829,4.602-8.211,1.773-12.019c-2.829-3.809-8.212-4.601-12.019-1.773l-25.603,19.02V169.26l35.85-26.632c3.809-2.829,4.602-8.211,1.773-12.019c-2.829-3.809-8.212-4.602-12.019-1.773l-25.603,19.019V80.752c0-4.745-3.845-8.591-8.591-8.591c-4.746,0-8.591,3.846-8.591,8.591v67.104l-25.605-19.02c-3.809-2.829-9.19-2.035-12.019,1.773c-2.829,3.809-2.035,9.19,1.773,12.019l35.851,26.632v97.146l-25.605-19.02c-3.809-2.83-9.19-2.035-12.019,1.773c-2.829,3.809-2.035,9.19,1.773,12.019l35.851,26.632v96.534l-25.605-19.021c-3.809-2.829-9.19-2.035-12.019,1.773c-2.829,3.809-2.035,9.19,1.773,12.019l35.851,26.632v33.622c-17.534-1.843-33.98-9.286-47.012-21.448l-59.871-55.864c-5.331-4.976-4.777-11.229-2.479-15.423c1.896-3.46,5.611-6.675,10.819-6.675c1.105,0,2.278,0.144,3.514,0.463l23.762,6.109c10.766,2.769,21.442-2.009,26.547-11.892c5.105-9.883,2.828-21.349-5.665-28.531L87.798,213.742c-12.711-10.749-10.374-24.6-4.51-33.195c5.864-8.594,17.911-15.82,32.552-7.906l32.144,17.374c9.578,5.178,21.006,2.846,27.79-5.67c6.783-8.514,6.503-20.174-0.684-28.351L119.277,92.47c-7.756-8.827-4.89-18.437-0.079-23.986c4.811-5.549,13.92-9.747,23.755-3.322c0.223,0.147,0.454,0.282,0.691,0.407l38.086,20.087c9.426,4.971,20.5,4.654,29.628-0.85c9.126-5.504,14.575-15.153,14.575-25.811V47.248c0-16.578,13.489-30.066,30.067-30.066s30.066,13.488,30.066,30.066v11.747c0,10.657,5.448,20.306,14.575,25.81c9.126,5.505,20.203,5.822,29.629,0.85l38.085-20.087c0.236-0.125,0.466-0.26,0.691-0.407c9.838-6.425,18.944-2.226,23.755,3.322c4.81,5.549,7.676,15.159-0.078,23.986l-55.814,63.523c-7.184,8.179-7.466,19.837-0.682,28.353c6.783,8.515,18.212,10.845,27.788,5.669l32.144-17.374c14.645-7.916,26.688-0.688,32.553,7.905C434.574,189.141,436.911,202.991,424.2,213.741z'/></g><g id='pointy'><path class='pointy-color' d='M359.183,361.274L256.004,464.452L152.813,361.274c-68.786-68.786-68.786-180.315,0-249.1L256.004,8.982l103.179,103.191C427.969,180.959,427.969,292.488,359.183,361.274z'/><path class='leaf-vein' d='M365.541,105.819L262.353,2.632C260.668,0.946,258.383,0,255.999,0s-4.668,0.946-6.353,2.632L146.459,105.819c-72.18,72.18-72.18,189.624,0,261.803l100.555,100.555v34.837c0,4.962,4.023,8.985,8.985,8.985c4.962,0,8.985-4.023,8.985-8.985v-34.837l100.557-100.555C437.72,295.443,437.72,177.999,365.541,105.819z M264.984,442.767v-73.943l46.134-22.44c4.462-2.171,6.319-7.547,4.15-12.009c-2.172-4.462-7.547-6.32-12.009-4.15l-38.273,18.616v-49.569l90.416-37.91c4.576-1.919,6.73-7.184,4.812-11.759c-1.918-4.575-7.182-6.732-11.759-4.812l-83.468,34.997v-51.38l63.008-26.418c4.576-1.919,6.73-7.184,4.812-11.759c-1.918-4.575-7.182-6.732-11.759-4.812l-56.06,23.505v-52.338l31.033-13.011c4.576-1.919,6.73-7.184,4.812-11.759c-1.918-4.576-7.184-6.728-11.759-4.812l-24.085,10.099V102.73c0-4.962-4.023-8.985-8.985-8.985c-4.962,0-8.985,4.023-8.985,8.985v34.371l-24.083-10.099c-4.574-1.918-9.841,0.236-11.759,4.812c-1.918,4.576,0.235,9.841,4.812,11.759l31.032,13.011v52.338l-56.059-23.505c-4.573-1.919-9.841,0.235-11.759,4.812c-1.919,4.576,0.235,9.841,4.812,11.759l63.007,26.418v51.38l-83.467-34.997c-4.571-1.918-9.841,0.235-11.759,4.812c-1.919,4.576,0.235,9.841,4.812,11.759l90.415,37.91v49.57l-38.273-18.616c-4.46-2.169-9.838-0.313-12.009,4.15c-2.171,4.462-0.313,9.839,4.15,12.009l46.133,22.44v73.943l-87.85-87.85C94,289.744,94,183.699,159.173,118.526l96.835-96.835l96.835,96.835c65.173,65.173,65.173,171.219,0,236.391L264.984,442.767z'/></g><use href='%23maple' x='800' /><use href='%23pointy' x='1820' /><use href='%23oak' x='2840' /><use href='%23oak' x='1310' y='510' /><use href='%23maple' x='2330' y='510' /><use href='%23pointy' x='3350' y='510' /><use href='%23maple' x='800' y='1020' /><use href='%23pointy' x='1820' y='1020' /><use href='%23oak' x='2840' y='1020' /><use href='%23oak' x='1310' y='1530' /><use href='%23maple' x='2330' y='1530' /><use href='%23pointy' x='3350' y='1530' /></svg>");
	background-size:
		100% 100%,
		900px 600px;
	background-position:
		0 0,
		0 0;
	background-repeat:
		no-repeat,
		repeat;
}

.meteor-background {
	animation: 30s falling-meteor linear infinite;
	background-color: var(--secondary-color);
	background-image:
		linear-gradient(transparent 575px, white 575px),
		url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 250 250' width='500px' height='10px'><filter id='filter'><feTurbulence baseFrequency='0.15' numOctaves='2'/><feColorMatrix values='0 0 0 9 -4 0 0 0 9 -4 0 0 0 9 -4 0 0 0 9 -4'/></filter><rect width='100%25' height='100%25' fill='transparent' filter='url(%23filter)'/></svg>"),
		radial-gradient(closest-side at 50% 88%, green 112%, transparent 113%),
		radial-gradient(closest-side at 50% 88%, darkgreen 112%, transparent 113%);
	background-size:
		100% 100%,
		100% 2580px,
		50% 52%,
		50% 51%
	;
	background-position:
		0 0,
		0 0,
		0 0,
		50% 0
	;
  
  @media (max-width: 800px) {
	background-size:
		100% 100%,
		200% 50%,
		50% 51%,
		50% 52%
		;
	}
	@media (max-width: 600px) {
		background-size:
		100% 100%,
		400% 50%,
		50% 51%,
		50% 52%
		;
	}

	@media (prefers-reduced-motion) {
		animation: unset;
	}
}

.rainbow-background {
	background-color: var(--secondary-color);
	background-image:
		linear-gradient(transparent 575px, white 575px),
		radial-gradient(closest-side at 50% 50%, transparent 64%, rgb(115 0 110 / 0.6) 70%, rgb(40 113 250 / 0.8) 75%, rgb(31 167 240 / 0.8) 77%, rgb(33 209 162 / 0.9) 79%, rgb(55 212 60 / 0.9) 80%, rgb(126 224 72 / 0.9) 83%, rgb(252 206 3 / 0.95) 84%, rgb(252 173 3 / 0.95) 86%, rgb(252 123 3 / 0.98) 88%, rgb(252 78 3 / 0.98) 90%, rgb(252 3 57 / 0.98) 90%, transparent 98%),
		radial-gradient(closest-side at 50% 88%, green 112%, transparent 113%),
		radial-gradient(closest-side at 50% 88%, darkgreen 112%, transparent 113%),
		url("data:image/svg+xml,<svg width='80px' height='80px' viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M3 13.6493C3 16.6044 5.41766 19 8.4 19L16.5 19C18.9853 19 21 16.9839 21 14.4969C21 12.6503 19.8893 10.9449 18.3 10.25C18.1317 7.32251 15.684 5 12.6893 5C10.3514 5 8.34694 6.48637 7.5 8.5C4.8 8.9375 3 11.2001 3 13.6493Z' stroke='%23dcdcff' fill='%23dcdcff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");
	background-size:
		100% 100%,
		1760px 1760px,
		50% 52%,
		50% 51%,
		33% 40%;
	background-position:
		0 0,
		50% 15%,
		0 0,
		50% 0,
		0 -10%;
	background-repeat:
		no-repeat,
		no-repeat,
		repeat,
		repeat,
		repeat;
	
	/* @media (max-width: 800px) {
		background-size:
			100% 100%,
			200% 50%,
			50% 51%,
			50% 52%
			;
		}
	@media (max-width: 600px) {
		background-size:
		100% 100%,
		400% 50%,
		50% 51%,
		50% 52%
		;
	} */
}

.rainy-background {
	animation: 1s falling-rain linear infinite;
	background-color: var(--secondary-color);
	background-image:
		linear-gradient(transparent 575px, white 575px),
		url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 250 250' width='500px' height='5px'><filter id='filter'><feTurbulence baseFrequency='1'/><feColorMatrix values='0 0 0 9 0 0 0 0 9 0 0 0 0 9 0 0 0 0 0.15 0'/></filter><rect width='100%25' height='100%25' fill='transparent' filter='url(%23filter)'/></svg>"),
		radial-gradient(closest-side at 50% 88%, green 112%, transparent 113%),
		radial-gradient(closest-side at 50% 88%, darkgreen 112%, transparent 113%);
	background-size:
		100% 100%,
		50% 50%,
		50% 52%,
		50% 51%
	;
	background-position:
		0 0,
		0 0,
		0 0,
		50% 0
	;
  
  @media (max-width: 800px) {
	background-size:
		100% 100%,
		200% 50%,
		50% 51%,
		50% 52%
		;
	}
	@media (max-width: 600px) {
		background-size:
		100% 100%,
		400% 50%,
		50% 51%,
		50% 52%
		;
	}

	@media (prefers-reduced-motion) {
		animation: unset;
	}
}

.snowy-background {
	animation: 30s drifting-snow linear infinite;
	background-color: var(--secondary-color);
	background-image:
		linear-gradient(transparent 300px, white 575px),
		radial-gradient(closest-side at 50% 88%, #eef 112%, transparent 113%),
		radial-gradient(closest-side at 50% 88%, #ccd 112%, transparent 113%),
		url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewbox='0 0 250 250' width='500px' height='500px'><filter id='filter'><feTurbulence baseFrequency='0.2'/><feColorMatrix values='0 0 0 9 -4 0 0 0 9 -4 0 0 0 9 -4 0 0 0 9 -4'/></filter><rect width='100%25' height='100%25' fill='transparent' filter='url(%23filter)'/></svg>")
	;
	background-size:
		100% 100%,
		50% 52%,
		50% 51%,
		50% 50%
	;
	background-position:
		0 0,
		0 0,
		50% 0,
		0 0
	;
  
  @media (max-width: 800px) {
	background-size:
		100% 100%,
		50% 52%,
		50% 51%,
		200% 50%
		;
	}
	@media (max-width: 600px) {
		background-size:
		100% 100%,
		50% 52%,
		50% 51%,
		400% 50%
		;
	}

	@media (prefers-reduced-motion) {
		animation: unset;
	}
}

@keyframes drifting-snow {
	to {
		background-position:
		0 0,
		0 0,
		50% 0,
		0 100%
	;
	}
}

@keyframes falling-meteor {
	to {
		background-position:
		0 0,
		0 5160px,
		0 0,
		50% 0
	;
	}
}

@keyframes falling-rain {
	to {
		background-position:
		0 0,
		0 100%,
		0 0,
		50% 0
	;
	}
}

.howling-wolf {
	background-image: 
		url('../../images/WisconsinAdventures/WisconsinAdventuresMainSprite.png');
  width: 100%;
  aspect-ratio: 1/1;
	background-size: 207%;
	background-position: center top;
  background-repeat: no-repeat;
  position: relative;
  /* animation: 5s wolf-eye steps(1, end) infinite; */
  
  @media (min-width: 500px) {
	aspect-ratio: 2.1/1;
	background-size: cover;
	&::before {
		animation: 10s tree-sway alternate ease-in-out infinite;
	}
  }
	  
	@media (prefers-reduced-motion) {
		&::before {
			animation: unset;
		}
	}
  
  &::before {
	content: '';
	width: 100%;
	height: 100%;
	position: absolute;
	background-image: url('../../images/WisconsinAdventures/WisconsinAdventuresTreesCroppedAndShrunk.png');
	  background-size: cover;
	  background-repeat: no-repeat;
	  background-position: center;
	  transform-origin: bottom;
  }
}

@keyframes tree-sway {
	from {
		transform: skewX(1deg);
	}
	to {
		transform: skewX(-1deg);
	}
}
@keyframes wolf-eye {
	0% {
		background-position: center bottom;
	}
	20%, 40%, 60%, 80% {
		background-position: center top;
	}
}

/* derived from Animate.css's tada animation */
.tada:hover {
	animation: 3s tada;
}
@media (prefers-reduced-motion) {
	.tada:hover {
		animation: unset;
	}
}

@keyframes tada {
	from {
		transform: scale3d(1, 1, 1);
	}
	
	10%,
	20% {
		transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
	}
	
	30%,
	50%,
	70%,
	90% {
		transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
	}
	
	40%,
	60%,
	80% {
		transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
	}
	
	to {
		transform: scale3d(1, 1, 1);
	}
}

.ghosty {
	contain: layout;
	
	&::before {
		content: '👻';
		position: absolute;
		z-index: -1;
		left: -1.3rem;
		font-size: 3rem;
		rotate: -10deg;
		top: -1rem;
		transition: top 1s;
	}
	
	@media (min-width: 600px) {
		&::before {
			left: 1.3rem;
			rotate: unset;
			top: 0;
		}
	}
	
	&:hover::before {
		top: -3rem;
	}
}

.turkey {
	contain: layout;
	
	&::before {
		content: '🦃';
		position: absolute;
		z-index: -1;
		left: -1.3rem;
		font-size: 3rem;
		rotate: -10deg;
		top: -1rem;
		/*transition: top 1s;*/
	}
	
	@media (min-width: 600px) {
		&::before {
			left: 1.3rem;
			rotate: unset;
			top: 0;
		}
	}
	
	@media not (prefers-reduced-motion) {
		&:hover::before {
			/*top: -3rem;*/
			animation: 3.1s sneaky-peek ;
		}
	}
}

@keyframes sneaky-peek {
	0%, 100% {
		top: 0;
	}
	64.5% {
		top: -2.7rem;
	}
	96.8% {
		top: -2.7rem;
	}
}
/*---------------------------------------------------------------------------


                             Framework
                           -------------

  This section styles the page framework and grid for each template.
  
  Current page templates include:
  
  		- article template (articles, collection items)
		- search result template (search result pages)
		- section page template (family and preserve pages) 


----------------------------------------------------------------------------*/

.clear {
	clear:both;
}
/* This is a bad clearfix, requiring an empty div, so look into getting rid of it */
.clear-fix {
	clear:both;
	font-size:1px;
	text-indent:-2000em;
	display: block;
	height: 1px;
}

/*#container { Used to be #container, now it's...*/
body > section, body > header, body > nav {
	max-width: 80rem;
	text-align:left;
	margin:auto;
}

body > footer {
	margin: 4rem auto 0 auto;
	background: #fff;
	font-size: 16px; /* remove this eventually when I fix the font size general */
}

/* Header and branding content
----------------*/
#logo {
	margin: .5rem;
}

#logo img {
	width: fit-content;
}

body > header > h1 {
	text-indent: -1000em;
	display: none;
}

/*     Styling for the "New" Navigation and Search      */
		
		body > header {
			display: grid;
			grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
			padding: 0 .5rem;
		}

		nav#secondary-nav {
			font-size: 70%;
			margin-top: 1rem;
		}

		#logo img {max-width: 17rem;}


		@media (max-width: 700px) {
			div#banner-elements {
				display: none;
			}
		}
	
	@media (max-width: 850px) {
		nav {
			display: grid;
			grid-template-columns: 1fr 1fr 1fr;
		}

		nav#secondary-nav {
			grid-column: span 3;
		}

		body > nav > .major-link {
			height: 1.5rem;
			padding: 5px;
		}
	}

	@media (max-width: 480px) {
		div#banner-elements {
			display: none;
		}

		.alert {
			margin-bottom: 1rem;
		}

		nav {
			display: grid;
			grid-template-columns: 1fr 1fr;
		}

		body > nav > .major-link {
			margin: .5rem .5rem 0;
		}

		a#Membership, a#Donate {
			grid-column: span 2;
		}

		nav#secondary-nav {
			grid-column: span 2;
		}

		#search-section {
			justify-self: center;
		}
	}

/* Might need to rethink this above section placement */

/* Footer */
/* Footer Links
-----------------------------------------------------------------------------*/
body > footer > p {
	clear:both;
	color: #e6e3d1;
	margin: -10px auto 10px auto;
	top: 40px;
	text-align:center;
}
body > footer > ul {
	clear:both;
	list-style: none;
	margin: 0 auto 50px auto;
	text-align:center;
}
body > footer > ul > li {
	display:inline;
}
body > footer > ul > li + li {
	border-left: 1px solid #a69285;
}

body > footer > ul > li > a, body > footer > ul > li > a:link, body > footer > ul > li > a:visited, body > footer > ul > li > a:active {
	color: #e6e3d1;
	padding: 0 5px 0 8px;
	text-decoration: none;
}
body > footer > ul > li > a:hover, body > footer > ul > li > a:focus {
	text-decoration: underline;
	color: #fff;
}

/*---------------------------------------------------------------------------


                         Footer Styling 
                         ------------------------


---------------------------------------------------------------------------*/
footer p {
    color: #6D6E71;
}

footer {
	font: 100%/1.45 Verdana, Geneva, Arial, Helvetica, sans-serif; /* Controls font style (size, font face, color) throughout website */
}

footer h3 {
	margin-bottom: .25rem;
	color: var(--primary-color);
	font-weight: 100;
}

.condensed {
	font-family: 'Oswald', sans-serif;
	filter: opacity(0.85);
}

.footer-site-info a {
    filter: saturate(0);
}

.thank-you-banner {
	background-color: #fff;
    outline: solid 2px var(--primary-color);
    outline-offset: -2rem;
    padding: 5rem;
    text-align: center;
    margin: 2rem auto 4rem;
    max-width: 70rem;
    color: var(--primary-color);
}

.thank-you-banner h3 {
    font-family: 'Oswald', sans-serif;
    font-size: 4.5rem;
    margin-top: 3rem;
    margin-bottom: 2.5rem;
    color: var(--primary-color);
    text-transform: uppercase;
    font-weight: 500;
    letter-spacing: 2.5px;
	line-height: 4.5rem;
}

.newsletter {
    background: #003e73;
    padding: 4rem;
    margin: auto;
    color: white;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.newsletter .title, .newsletter-email {
    margin-inline-start: 1rem;
    margin-inline-end: 1rem;
}

.newsletter h4 {
    font-family: 'Oswald', sans-serif;
    font-size: 2rem;
    margin-bottom: .25rem;
    margin-top: 0;
	color: #fff;
	line-height: 2rem;
}

.newsletter p {
	color:white;
}

.newsletter-subscribe {
  align-self: center;
}

.newsletter-email {
    min-width: 15rem;
    text-align: center;
	align-self: center;
	padding: 1rem;
    background: rgba(255,255,255, .1);
    margin-inline-end: 3rem;
}

.footer-site-info {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    margin: auto;
    max-width: 80rem;
    margin: 3rem auto 0;
}

.footer-site-info picture {
    width: 8rem;
    margin-inline-start: 1rem;
    margin-inline-end: 1rem;
    fill: #6D6E71;
    filter: opacity(0.85);
}

.footer-site-info .list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    grid-gap: 1rem;
    grid-column:2/6;
} 

.list li {
	line-height: 1.5rem;
	margin-bottom: .5rem;
}

.footer-lower {
    grid-row-start: 3;
    border-top: 1px solid rgba(0,0,0,.15);
    grid-column: 1/6;
    padding: 1rem;
    margin-top: 1rem;
    display: flex;
    justify-content: space-between;
    font-family: 'Open Sans Condensed', sans-serif;
}

.social-links {
    grid-row: 2;
    grid-column: 1/6;
    margin-top: 1.5rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}

.social-links svg {
  max-width: 3rem;
  height: 1.5rem;
  margin: 1rem;
  fill: var(--secondary-color);
  filter: saturate(0);
  filter: opacity(.75);
}

.footer-lower p {
    margin: 0 .5rem;
}


footer a:hover, .footer-site-info a:hover, .social-links a:hover, .social-links a:hover svg {
    filter: opacity(1) saturate(1);
}


@media (max-width: 720px) {
  .footer-site-info {
    grid-template-columns: 1fr 1fr 1fr;
  }
  
  footer .list {
    grid-column: 2/4;
    grid-template-rows: repeat(2, 1fr);
  }
  
  .footer-lower {
    flex-wrap: wrap;
  }

  .thank-you-banner h3 {
    font-size: 3.25rem;
    margin-bottom: 1rem;
    line-height: 3.25rem;
}

  .thank-you-banner p {
    line-height: 1.5rem;
}

	.newsletter {
		padding: 2rem;
	}

}

@media (max-width: 450px) {
  .newsletter {
	text-align:center;
  }
  
  .newsletter-email {
	  min-width: 10rem;
	  margin-inline-end: 0;
	  margin: auto;
  }

  .footer-site-info {
    margin:auto;
    padding: 1.5rem;
  }
  
  .footer-site-info picture {
	margin-inline-start: 0;
	width: 6rem;
  }
  
  .footer-lower {
    display:block;
  }
  
  .footer-lower p {
	margin: 0;
  }

  .condensed {
	  margin-top: 1rem;
  }

  .social-links {
		justify-content: space-around;
	}

  .social-links svg {
		margin: .5rem;
	}

}

/* Page navigation */
body > nav {
    background-color: var(--primary-color);
    z-index: 800;
}
body > nav > * { /*div, body > nav > ul {*/
    display: inline-block;
    *zoom: 1;
    *display: inline;
}
body > nav > .major-link {
	border-color: white;
	border-width: 1px;
    box-shadow: 0 0 0 1px #00254b;
    color: white;
	margin-top: .5rem;
}
body > nav > .major-link:hover,
body > nav > .major-link:focus {
    background-color: white;
    box-shadow: 0 0 0 1px white;
    color: var(--primary-color);
}
body > nav > .major-link {
	margin-left: 0.6rem;
}
/* This is totally related, that's why it's here */
@media (min-width: 500px) {
	[for="search-toggle"] {
		float: right;
	}
}
body > nav {
	padding-top: 1em;
	margin-bottom: 1rem;
}
body > nav > ul {
    background: none repeat scroll 0 0 transparent;
    color: #fff;
    margin-left: 20px;
    height: 32px;
    line-height: 32px;
    width: 270px;
}

.no-link-top a {
    cursor: default;
	margin:17px 0 0 40px;
}
.no-link a {
    cursor: default;
}

/*  Top banner
-----------------------------------------------------------------------------*/
.alert {
	background: #eba900;
    padding: 1rem;
    /* display: flex; */
    /* flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-around; */
    max-width: 2000px !important;
    text-align: left;
}

.alert h2 {
    font-size: 1.15rem;
    padding: 5px;
}
.alert h3 {
    font-weight: 400;
    color: black;
    font-size: 1.15rem;
    flex-grow: 2;
    padding: 5px;
}
.alert p {
    padding: 5px;
}

#banner-elements {
	display: flex;
    flex-wrap: wrap;
    margin-top: 1rem;
    justify-content: space-between;
	align-items: baseline;
	padding: 0 1rem;
}

#banner-elements p {
    color:#ffffff;
}
/*.sites-dropdown-form { was, now...*/
#banner-elements select {
    font-size: 13.333px; /* You're asking, what's this for? It returns default font size, at least for FF, GC, and IE */
}

#banner-elements a, #banner-elements a:link, #banner-elements a:hover, #banner-elements a:focus, #banner-elements a:active, #banner-elements a:visited {
    color:#ffffff;
	font-weight:bold;
	text-decoration:underline;
}
#forward { /* FORWARD link */
	padding: 0;
	margin: 0;
	position: absolute;
	top: 0px;
	right: -40px;
}
/* Accessiblity: Skip Navigation Link styles
---------------------------------------------------------------------------*/
#skip a, #skip a:hover, #skip a:visited {
	position:absolute;
	left:0px;
	top:-500px;
	width:1px;
	height:1px;
	overflow:hidden;
}
#skip a:active, #skip a:focus {
	position:static;
	width:auto;
	height:auto;
}

/* Content grid boxes for various pages
----------------------------------*/
/*#content { was, now... */
body > section {
	background-color:#fff;
	position: relative;
	z-index:0;
	overflow:hidden;
	padding-bottom: 1rem;
}

#content-wrapper-wide {
	margin:20px 40px 40px 40px;
	padding:20px 0px;
}
#content-wrapper-article {
	border-top:solid 1px #ccc;
	border-bottom:solid 1px #bbb;
	max-width:910px;
	margin:20px 20px 20px 20px;
	padding:0;
	float:left;
	position:relative;
	left:5px;
	overflow:hidden;
}
#content-wrapper-serp, #content-wrapper-category {
	max-width:930px;
	margin:13px 0px 0px 20px;
	padding:0;
	float:left;
	position:relative;
	left:5px;
}
#content-wrapper-category ul.dim-list {
	margin-top:0;
}
.category-heading {
	float:left;
	margin-top:20px;
	margin-bottom:10px;
}
.content-box-large {
	float: left;
	display: block;
	width: 75%;
	margin: 0;
	padding: 0;
}
.right-nav-box {
    float: right;
	display: block;
	width: 200px;
	margin: 0;
	padding: 0;
	min-height:900px; /* Fits membership content - this will need to change. Need to research a fix for the IE 7 padding bug with previous approach - 29px left padding to overlap line. */
}
.bottom-nav-box {  
	float:left;
	display: block;
	width: 622px;
	margin: 0 0 0 0px;
	padding: 0 0 20px 40px;
}
.share-utility-box {
	display: block;
	max-width: 75%;
	margin: 0 0 1rem 0px;
	padding: 10px 0 5px 0;
	border-top:1px dotted #ccc;
	border-bottom:1px dotted #ccc;
}

@media (max-width: 670px) {
    .share-utility-box {  
        max-width: 100%;
    }
}

div.share-utility-box + p {
	clear:both;
}
.at-icon-wrapper {
    border-radius: 100%;
    padding: .25rem;
	margin-inline-end: .25rem;
}
.addthis_default_style .at300b, .addthis_default_style .at300m {
    display: flex;
    align-items: center;
}
ul.page-tools-b li a {
	border-right:0;
}

#content-wrapper-wide .share-utility-box {
	float: left;
}

.article-side-bar {
    position: relative;
	border-top:solid 1px #ccc;
	border-bottom:solid 1px #bbb;
    height: 100%;
    right: 25px;
}
.container .article-content-holder {
	max-width:680px; /* This width is for the CMS Preview. */
}
.results-list {
	display: inline-block;
    *zoom: 1;
    *display: inline;
	margin-left: 18px;
	margin-top: 5px; /* was set at 17px, adjusted when removed old search tips message. */
    vertical-align: top;
	max-width: 75%;
}
.guided-navigation {
    display: inline-block;
    *zoom: 1;
    *display: inline;
    vertical-align: top;
    width: 260px;
    margin-left: 20px;
    margin-top: 5px;
}
.search-questions {
    max-width: 75%;
    margin: 16px 0 20px 302px;
    border: 1px solid #929496;
}
.search-questions > h1.help {
    font-size: 18px;
    font-size: 1.125rem;
    padding: 0;
    font-weight: bold;
    line-height: 34px;
    line-height: 2.125rem;
    text-transform: none;
    color: #fff;
}
.search-questions > p {
    margin-left: 20px;
}

hr {
	border:0;
	background-color:#ccc;
	text-align:left;
	height:1px;
	margin: 20px 0;
}

.w640 {
	width:75%;
	/*max-width:640px !important; messes up video on About page...*/
}
/* SECTION CARTRIDGE ADD-ON: dark (creates a grey background with white text)
--------------- */
.dark {
	background-color:#5c5c5c;
	color:#fff;
}
.dark a, .dark a:link, .dark a:visited, .dark a:hover, .dark a:focus, .dark a:active {
	color: #fff !important;
	font-weight:bold;
}
.dark p, .dark h2 {
	color: #fff !important;
}
.right-related div.record-description p {
	display:none;
}

/* SECTION CARTRIDGE ADD-ONS: Remove default border, remove default background
--------------*/
.no-border {
	border:none !important;
	padding:0px 1px !important;
	margin-bottom:15px !important;
}

/* Hides aspects that are on the page for accessiblity reasons
------------------- */
.structural {
    position:absolute;
    left:-9999px;
}

/* carouFredSel styles
----------------------------------------*/

.image_carousel {
	position: relative;
	clear:both;
}
.image_carousel ul {
	margin:0;
	padding:0;
}
.image_carousel li {
	background-color: white;
	padding: 0;
	margin:0;
	display: block;
	float: left;
}
.section-cartridge .image_carousel {
	max-width:340px;
	float:right;
	margin-left:20px;
}
.section-cartridge .image_carousel li {
	background-color: transparent;
}
div.image_carousel ul#property li a {
	background:none !important;	
    padding-right: 13px;
}
div.article-content-holder .image_carousel li, div#content-wrapper-wide .image_carousel li, body.mceContentBody .image_carousel li {
	padding-bottom:20px;
	background-color:transparent;
}
.image_carousel img {
	border: 1px solid #ccc;
}
.image_carousel li p {
	padding: 0 0 0 9em;
	text-align:center;
	width:200px;
	height:20px;
	display: block;
	font-size:2em;
}
/* carouFredSel styles for pagination - all styles below are from plugin
----------------------------------------*/
a.prev, a.next, a.play, a.pause {
    background: url('/images/site/miscellaneous_sprite.png') no-repeat scroll 0 0 transparent;
    display: block;
    height: 60px;
    position: absolute;
    width: 60px;
}
a.prev, a.next {
    top: 35px;
}
a.play, a.pause {
    left: 50%;
    margin-left: -22px;
    top: 185px;
    z-index: 200;
}
a.next {
    right: -12px;
	background-position: -80px -24px;
}
a.prev {
    left: -20px;
	background-position: -15px -24px;
}
a.prev:hover {
    background-position: -15px -85px;
}
a.prev.disabled {
    background-position: -15px -145px !important;
    cursor: default;
}
a.next:hover {
    background-position: -80px -85px;
}
a.next.disabled {
    background-position: -80px -145px !important;
    cursor: default;
}
a.play {
    background-position: -100px 0;
}
a.play:hover {
    background-position: -100px -50px;
}
a.play.disabled {
    background-position: -100px -100px !important;
    cursor: default;
}
a.pause {
    background-position: -150px 0;
}
a.pause:hover {
    background-position: -150px -50px;
}
a.pause.disabled {
    background-position: -150px -100px !important;
    cursor: default;
}
a.prev span, a.next span, a.play span, a.pause span {
    display: none;
}

/* NHD CMS Homepage
----------------------------------------*/

.container
{
  max-width: 100%;
}
.left-div
{
	display: inline-block;
	max-width: 50%;
	text-align: left;
	padding: 30px;
	background-color: #ddd;
	border-radius: 3px;
	margin: 15px;
	vertical-align: top;
}
.right-div
{
	display: inline-block;
	max-width: 20%;
	margin: 15px;
}

/*----------------------------------------------------
 NHD CMS Page Top Navigation Layout using nav 
----------------------------------------*/ 

/*nav
{
	box-shadow: 0px 0px 14px 0px rgba(0,0,0,0.75);
}*/

article.cms-article > nav > ul
{
	overflow: hidden;
	display: flex;
	list-style: none;
	margin: 0px;
	padding-top:0px;
	flex-direction: column;
	background-color: #f1f1f1;
}

article.cms-article > nav > ul li
{
    margin-bottom: 0px;
}

article.cms-article > nav > ul li a 
{
	display: block;
	color: black;
	padding: 14px 25px;
	text-transform: uppercase;
	font-size: 17px;
	border-bottom: 3px solid transparent;
}

article.cms-article > nav > ul li a:hover 
{
    border-bottom: 3px solid var(--primary-color);
}

article.cms-article > nav > ul li a.active 
{
    border-bottom: 3px solid var(--primary-color);
}

@media (min-width: 1025px) {
	article.cms-article > nav > ul
	{
		flex-direction: row;
		justify-content: space-between;
	}
}

.accordion-toggle {
	cursor: pointer;
	padding: 5px;
	margin: 8px 0 16px 16px;
}
.accordion-content {
	display: none;
	padding: 6px 20px;
}
.accordion-content.default {
	display: block;
	padding: 6px 20px;
}
/* This is for dealing with ActiveCampaign's careless style tag injection
 It wouldn't normally be a problem except it gets injected in places where
 we're using * to set display, so we don't want to override the display none */
 body style {
	display: none !important;
}

.stack {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.stack > * + * {
    margin-block-start: 1rem;
}

/*.article-content-holder { was, now... */
/*article {*/
.two-columns-one {
    /*position: relative; 
	float: left;
	display: block;
    left: 25px;*/
	border-right: 1px var(--primary-color) solid;
	/*border-top: 1px #ccc solid;*/
	padding: 1.5rem;
	max-width: 75%;
    /*margin-inline-start: 25px;*/
	margin-bottom: 0;
	min-height: 900px; /* Fits membership content - this will need to change. Need to research a fix for the IE 7 padding bug with previous approach - 29px left padding to overlap line. */
}
.two-columns-two {
    /*border-top: 1px #ccc solid;*/
    padding: 15px 0 0 15px;
    width: 210px;
	padding: 30px 20px 40px 20px;
}
[class*=two-columns] {
    display: inline-block;
    *zoom: 1;
    *display: inline;
    vertical-align: top;
    /*margin-top: 30px;*/
}

[class*=one-column] {
    margin: 20px 40px 40px 40px;
    padding: 20px 0px;
}
[class*=one-column] .associated-records {
    max-width: 75%;
}

[class*=three-columns] {
    display: inline-block;
    *zoom: 1;
    *display: inline;
    vertical-align: top;
    margin-inline-start: 1.5rem;
    margin-bottom: 1rem;
}
.three-columns-one, .three-columns-three {
    width: 260px;
}
.three-columns-two {
    max-width: 360px;
}
.three-columns-wide {
    max-width: 75%;
}
.three-columns-full {
    max-width: 80rem;
}

/* Sibling Selector-based Display
 Basic *-column div sibling selector is 1rem top margin with 16px fallback
 Current restriction is to keep top margin off side-by-side inline-block siblings*/
[class*=one-column] div + div, [class*=two-columns] div + div, [class*=three-columns] div + div {
    margin-top: 16px;
    margin-top: 1rem;
}

/* for ul elements that need their li's displayed as inline-blocks */
.inline-list {
    list-style: none;
}
.inline-list li {
    display: inline-block;
    *zoom: 1;
    *display: inline;
    vertical-align: top;
}
.inline-list.three-per-row li {
    width: 28%;
    margin: 0;
}

@media (max-width: 670px) {
    .two-columns-one {  
        margin-inline-start: 0;
        padding: 1rem;
        max-width: -webkit-fill-available;
    }
}

/***************************************************************************
    Type
    This section styles all typography and article formatting.
  
  Current formatting includes:  
  		- headings
		- paragraphs
		- lists (bulleted, numbered, data lists)
		- special items (quotes, blockquotes, cite, etc)
****************************************************************************/

/* --------------- PARAGRAPHS ------------------*/
p {
	margin: 0 0 0.85rem 0;
    font-size: 16px;
    line-height: 1.25rem;
}
.article-content-holder p, .record-type-info p{
	font-size:1rem;
	line-height:1.75rem;
	margin:0 0 1.25rem 0;
}
div.content-image-left p, .content-image-top p, div.content-image-right p {
	padding: 0 2px 0px 7px !important;
	margin-bottom:2px !important;
	font-size:1rem !important;
	clear:both;
}
.RecordContainer p {
	line-height:1.25rem;
	margin-bottom: 1rem;
}
.hanging-indent {
	text-indent:-25px;
	padding-left:25px;
}

/* --------------- HEADINGS ------------------*/
h1, h2, h3, h4, h5, h6, dt, .TitleText {
	font-family: Arial, Helvetica, sans-serif;
	letter-spacing:normal;
}
h1{
	padding: 0 0 0.6rem 0;
	margin: 0;
	font-size: 2rem;
	line-height:2.2rem;
	font-weight:normal;
}
h2 {
	padding: 0;
	margin: 0;
	font-size: 1.75rem;
	font-weight:bold;
}
h3 {
	font-size: 1.3rem;
	line-height: 1.5rem;
	color:#4B90D1;
	font-weight:bold;
}
.article-content-holder h3, #content-wrapper-wide h3 {
	font-size: 1.5rem;	
}
h4 {
    margin-top: 1.75rem;
    margin-bottom: .5rem;
    line-height: 1.4rem;
    color:#666;
    font-weight:bold;
    font-size: 1.5rem;
}
#link-bar h1 {
	font-size: 1.25rem;
	line-height: 1.25rem;
	color:#666;
	font-weight:bold;
}
.article-content-holder h4 {
	font-size: 1.4rem;
}
h5 { /* seen on collection item detail record pages */
	font-size: 1.15rem;
	font-weight: bold;	
	margin: 1rem 0 .5rem 0;
}
.article-content-holder h5, #content-wrapper-wide h5 {
	font-size: 1.3rem;	
}

h6 {
	font-size: 1.1rem;
	line-height: 1.2rem;
	font-weight:bold;
	padding-top:20px;
}
.article-content-holder h6 {
	font-size:1.2rem;	
}

/* ARTICLE, HOME, AND WIDE PAGE SUBHEAD PADDING */
.article-content-holder h2,
.article-content-holder h3, #content-wrapper-wide h3,
.article-content-holder h4, #content-wrapper-wide h4,
.article-content-holder h5, #content-wrapper-wide h5,
.article-content-holder h6 {
	padding: .2rem 0 .4rem;	
}

/* UNDERLINED HEADINGS */
.underline {
	border-bottom: #80a6d3 solid 1px;
	width:100%;
	margin-bottom:10px;
}

.article-content-holder h2.underline, 
.article-content-holder h5.underline {
	padding: .6rem 0 0.12rem;
}

.article-content-holder h2.underline {
		font-size: 1.8rem;
		font-weight:normal;
}

/* UPPERCASE */
.box-two, ul.page-tools-b li, .right-related .TitleText {
	text-transform: uppercase;
}	
/* REMOVE BOLD */
.share-utility-box a {
	font-weight: normal;
}

/* CUSTOM HEADINGS */


/*H2 Custom Headings 
-----------------------------*/
.content-image-left h2, .content-image-top h2, .content-image-right h2 {
    font-size: 1.07rem;
    font-weight: bold;
    padding: 10px 2px 2px 7px;
}
.content-image-left h2 a, .content-image-top h2 {
	font-size:1.07rem;
}

/*H3 Custom Headings 
-----------------------------*/
.RecordContainer h3, .RecordContainer table caption {
    font-size: 1.25rem;
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	color:#000000;
	padding: 1.6rem 0 0.2rem;
	clear:both;
}
.RecordContainer h3:after, .RecordContainer table caption:after {
	padding: 0px 0px 0px 10px;
    content:url('/images/site/arrow.gif');
    display:none;
}
.page-title h3:after, h3.color:after {
	content:none !important;
	padding:0 !important;
}
.RecordContainer h3.color, .RecordContainer table caption.color {
	text-transform:none;
	color:#4B90D1 !important;
	clear:none;
	padding:0 !important;
}
h3.subtitle {
    color: #999999;
    font-size: 1.6rem;
    line-height: 1.6rem;
    padding: 0 0 15px;
    text-transform: none;
}
div.record-title h3 a, div.record-title h3 {
	font-size:1.2rem;
	padding-top:0;
	text-transform:none;
}
div.record-title h3 a:visited {
	/* doesn't work correctly color:#800080; */
	color:#0033CC;
}
div.record-title h3 a:hover, div.record-title h3 a:focus {
	text-decoration: underline;
}
div.record-title h3 a:active {
	color: #ca6115;
}
.right-related .TitleText  {
	margin:-1px 0 0 0 !important;
	background: #3f3f3f url('/images/site/box-type-one-section-gradient.gif') top repeat-x;
	padding-left:20px !important;
	border-bottom:1px solid #444 !important;
}
.right-related .TitleText {
	background: #3f3f3f url('/images/site/box-type-one-section-gradient.gif') top repeat-x;
	border:0 !important;
	color:#fff !important;
	font-weight: normal !important;
	font-size: 1.1rem !important;
	padding: 5px 0 5px 15px !important;
	margin:15px 0 0 0 !important;
}
.right-nav-box div.record-title h3 a {
	font-size:1.1rem !important;
}

/*H4 Custom Headings 
-----------------------------*/
.page-title h4 {
	font-size: 1.1rem;
	color: #999;
	text-transform: uppercase;
	letter-spacing:normal;
	font-weight: bold;
	padding:0;
}
.record-title h4, .record-caption h4 {
	padding-top:0.6rem;
	text-transform: uppercase;
	color:#999;
	font-weight:bold;
}
/*H5 Custom Headings
------------------------------------*/
.arrow-list h5 {
	font-size: 1.3rem;
}

.RecordContainer > header > .content-type {
    text-transform: uppercase;
    font-size: 1.1rem;
    font-weight: bold;
    color: #999;
}
/* This fills in for h3.subtitles; for CMS articles it's an h2 and for everything else it's div.collection-area */
.RecordContainer > header > .collection-area,
.RecordContainer > header > h2 {
    text-transform: none;
    font-size: 1.6rem;
    font-weight: bold;
    padding: 0 0 15px;
    color: #999;
    line-height: 1.6rem;
}

/* Links styles */
.browse-links
{ 
display: block;
width: 150px;
height: 35px;
background-color: #003D7D;
color: white;
box-sizing: border-box;
-moz-box-sizing: border-box;
text-align: center;
padding-top: 5px;
font-family: 'Didact Gothic', sans-serif;
text-transform: uppercase;
text-decoration: none;
border: 3px solid #B99E80;
font-weight: bold;
font-size: 13px;
}


/* Search bread crumbs
-----------------------------*/
#crumbs-bar {
    margin: 13px 20px;
    margin: 0.8rem 1.25rem;
}
#crumbs-bar > h1 {
    position: absolute;
    left: -1000px;
}
#crumbs-bar > ul > li {
    display: inline-block;
    *zoom: 1;
    *display: inline;
    color: #333;
    font-size: 0.95rem;
    padding: 4px 10px 4px 7px;
    border: 1px solid #ccc;
}
#crumbs-bar > ul > li:last-child {
    border: none;
}
#crumbs-bar > ul > li + li {
    margin-inline-start: 0.5rem;
}
#crumbs-bar > ul > li > a {
    height: 11px;
    display: inline-block;
    *zoom: 1;
    *display: inline;
    margin-right: 7px;
    vertical-align: top;
}

/* Search Results Pagination
-----------------------------*/
.results-list > h1 {
    font-size: 1.5rem;
    font-weight: bold;
    margin-top: 16px;
    margin-top: 1rem;
    margin-inline-start: 8px;
    margin-inline-start: 0.5rem;
}
.results-list > ul:first-of-type {
     padding: 0 0.5rem 0.5rem;
}
.results-list > ul:last-of-type {
    margin-top: 0.5rem;
}
.results-list > ul li {
    display: inline-block;
    *zoom: 1;
    *display: inline;
    vertical-align: middle;
    text-align: center;
    margin: 2px 3px 0 0;
    padding: 0px 6px 1px;
}
.results-list li.previous-page a {
    display: block;
    text-indent: -1000rem;
    width: 0;
    height: 0;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-right: 7px solid blue;
}
.results-list li.current-page {
    font-weight: bold;
}
.results-list li.current-page {
    border: 1px solid hsl(210, 20%, 75%);
}
.results-list li.next-page a {
    display: block;
    text-indent: -1000rem;
    width: 0;
    height: 0;
    border-top: 7px solid transparent;
    border-bottom: 7px solid transparent;
    border-left: 7px solid blue;
}

/* Guided Search
-------------------------------*/
.guided-navigation > h1 {
    position: absolute;
    left: -1000px;
}
.guided-navigation > ul > li {
    margin-bottom: 16px;
    margin-bottom: 1rem;
    padding: 8px 0;
    padding: 0.5rem 0;
}
.guided-navigation > ul > li > * {
    padding: 0 20px;
    padding: 0 1.25rem;
}
.guided-navigation > ul > li > h1 {
    color: hsl(210, 20%, 50%);
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1.3rem;
    font-weight: bold;
    min-height: 20px;
}
.guided-navigation > ul > li > ul > li {
    color: hsl(210, 20%, 60%);
    line-height: 1.8rem;
}
.guided-navigation > ul > li > ul > li + li {
    padding-top: 3px;
}

/* Article Styles
---------------------*/

/* --------------- INDENTS ------------------*/
.indent, p.indent {
	margin-inline-start:30px !important;
}
.double-indent, p.double-indent {
	margin-inline-start:60px !important;
}
.triple-indent, p.triple-indent {
	margin-inline-start:90px !important;
}

/* --------------- LISTS ------------------*/

.article-content-holder li li:first-child {
	margin-top: 1.8rem !important;
}
.record-type-info ul, #content-wrapper-wide ul {
	list-style-type:disc;
	margin:0 0 1.8rem 0;
	margin-inline-start:45px;
	font-size:1.05rem;
}
.article-content-holder ul ul {
	list-style-type:disc;
	margin:0 0 0 0;
	margin-inline-start:45px;
	font-size:1.05rem;
}
.article-content-holder ul.double-indent {
	margin-inline-start:75px;
}
.article-content-holder ul li, #content-wrapper-wide ul li, .article-content-holder ol li {
	padding-bottom:10px;
	line-height:1.6rem;
}
.article-content-holder ol {
	list-style-type:decimal;
	margin:0 0 1.8rem 0;
	margin-inline-start:50px;
	font-size:1.05rem;
}
.article-content-holder ol.triple-indent {
	margin-inline-start:110px;
}
.article-content-holder ol li {
	padding-bottom:10px;
}
li {
	line-height: 1.3rem;
}
.article-content-holder ul.no-bullet {
	list-style-type:none;
	margin-inline-start:0px;
}
.download-box ul {
	list-style-type:none !important;
	margin:5px 5px 0 5px !important;
}
.download-box li {
	padding: 0 0 0 40px;
	margin:0;
}
.download-box li span {
	font-size:0.85rem;
}
.article-content-holder ul.hanging-indent li {
	list-style-type:none;
	margin-inline-start:0px;              /* As seen on 4-digit year timelines in HPC content, Chapter 1, Article 1 */
    padding-left: 0;
    text-indent: -54px;
}
/* columns */
.article-content-holder ul.column {
  max-width:75%;
  margin: 10px 0 20px 0;
  overflow:hidden;
  font-size:0.85rem;
}
.article-content-holder ul.column li {
  line-height:1rem;
  display:inline;
}
.image-list ul.column li {
  float:left;
  height:60px;
  width:200px;
}
.image-list ul.column h2 {
  margin:0;
  padding:0;
  padding-left:100px;
}
div#content div.image-list li a[target=_blank] {
	padding-right:0px !important;
	}
.image-list h2 {
	margin-top:30px !important;
}
.image-list ul.column img {
  position:absolute;
  padding:15px 0 0 18px;
}
.image-list li a {
	background:none!important;
}
.article-content-holder .double li { width:45%;} /* 2 col */
.article-content-holder .triple li { width:25%; } /* 3 col */
.article-content-holder .quad li { width:20%; } /* 4 col */

ul.bullet-list {
	margin:0 0 1.8rem 0;
	margin-inline-start: 30px !important;
	list-style-type: disc !important;
}
ul.bullet-list li {
	padding: 0;
}

/* ARROW LISTS (as seen on section pages) */

.record-type-info ul.arrow-list, .article-content-holder ul.arrow-list-indent, .article-content-holder ul.arrow-list ul, #content-wrapper-wide ul.arrow-list {
	list-style-type:none;
	padding:0;
	margin:0 0 1rem 0;
}

.article-content-holder ul.arrow-list h2 {
	padding:0;
	margin:0;
}

.article-content-holder ul.arrow-list h5, .article-content-holder ul.arrow-list-indent h5, #content-wrapper-wide ul.arrow-list h5 {
	padding:0;
	margin:0 0 0 0;
	font-size:1.1rem;
}

.article-content-holder ul.arrow-list li, .article-content-holder ul.arrow-list-indent li, #content-wrapper-wide ul.arrow-list li {
	padding-top: 2px;
}

.arrow-list, .arrow-list-white, .arrow-list-indent  {
	margin:0;
	padding:0;
}
.arrow-list li, .arrow-list-indent li {
	background: url('/images/site/blue-circle-arrow.png') no-repeat;
	background-position: 0px 2px;
	padding: 0px 0px 10px 18px;
	margin: 0px 10px 0px 0px;
}
.arrow-list-white li {
	background: url('/images/site/white-circle-arrow.png') no-repeat;
	background-position: 0px 2px;
	padding: 0px 0px 10px 25px;
	margin: 0px 10px 0px 20px;
	font-weight:bold;
}
.record-type-info .arrow-list li {
    font-size:1.1rem;
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif
}
p.arrow-link {
	background: url('/images/site/blue-circle-arrow.png') no-repeat;
	background-position: 0px 0px;
	padding: 0px 0px 0px 18px;
	font-size:1rem;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	line-height:1.2rem;
}
p.arrow-description {
	margin-inline-start:1rem;
	margin-top:-.5rem;
	line-height:1.2rem;
}
.article-content-holder ul.arrow-list-indent {
	margin:0 0 0 30px;
	padding: 10px 0 0;
}
.article-content-holder ul.arrow-list-indent li {
	padding-bottom: 30px;
}
.article-content-holder ul.arrow-list-indent li:last-child {
	padding-bottom: 2.8rem;
}

/* --------------- TABLES ------------------*/
.RecordContainer.cms-article table {
	margin:0 0 1.8rem 0;
	margin-right: 10px;
	margin-inline-start: 21px;
	border-collapse: collapse;
	max-width: 590px; 
}
.RecordContainer.cms-article table td {
	padding: 10px;
	vertical-align: top;
	text-align: left;
	border-bottom: 1px solid #ccc;
    font-weight: normal;
    color: #333;
}

.RecordContainer.cms-article table th {
	font-weight:bold;
	color: #333;
    font-size: 1rem;
    margin-bottom: 5px;	
}

.RecordContainer.cms-article table caption {
	padding: 0 0 .4rem 0;
	margin: 0;
	font-size: 1.5rem;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
}

/* New tables for records */
.RecordContainer[class$=record] table, .results-list > .search-record > table {
    display: block;
    /*padding-bottom: 20px;*/
    /*width: 100%;*/
}
.RecordContainer[class$=record] table tbody, .RecordContainer[class$=record] table caption, .RecordContainer table tr,
.results-list > .search-record > table tbody, .results-list > .search-record > table caption, .results-list > .search-record > table tr {
    display: block;
    margin: 0;
}
.RecordContainer table tr, .results-list > .search-record > table tr {
    line-height: 1.5rem;
}
.RecordContainer[class$=record] table th, .RecordContainer[class$=record] table td, .results-list > .search-record > table th, .results-list > .search-record > table td {
    font-size: 1.05rem;
    display: inline;
}
.RecordContainer[class$=record] table th, .RecordContainer[class$=record] table.long-description td, 
.results-list > .search-record > table th, .results-list > .search-record > table.long-description td {
    font-weight: normal;
    color: #666;
}
.RecordContainer[class$=record] table td, .RecordContainer[class$=record] table.long-description th, 
.results-list > .search-record > table td, .results-list > .search-record > table.long-description th {
    font-weight: bold;
    color: #000;
}
.RecordContainer[class$=record] table td::before, .results-list > .search-record > table td::before {
    content: " "
}

/* --------------- Definition Lists ------------------*/

.record-type-info dl, #content-wrapper-wide dl {
	max-width:550px;
	margin:0 0 1.8rem 0;
	margin-top: 10px;
	margin-inline-start: 30px;
}
.record-type-info dt, #content-wrapper-wide dt {
	font-weight:bold;
	color: #333;
    font-size: 1.1rem;
    margin: 20px 0 3px;	
}

.record-type-info dd ul {
	font-size:1rem;
}
.record-type-info dl {
	font-weight:normal;
}





/* Old Stickies */
/* Now they're record-type-info */
.record-type-info {
	background-color:#fff;
	margin-bottom: 20px;
	min-height:10px; 
	z-index:0;
	max-width:620px;
	border:1px solid #ccc;
	-moz-box-shadow: 0px 6px 6px #eee; 
	-webkit-box-shadow: 0px 8px 6px #eee; 
	box-shadow: 0px 6px 6px #eee; 
	-ms-filter: progid:DXImageTransform.Microsoft.Shadow(Strength=8, Direction=135, Color='#eeeeee');
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=8, Direction=135, Color='#eeeeee');
}
.record-type-info h1 {
    padding: 0;
	margin-bottom: 10px;
	color: #fff;
	font-size: 1.6rem;
    font-weight: bold;
	text-transform: none;
    line-height: 34px;
}

.info::before, .tip::before, .print::before, .help::before, .person::before, .cite::before, .buy::before, .book::before {
    content: " ";
    width: 60px;
    height: 36px;
    vertical-align: top;
    zoom: 1;
    display: inline-block;
    *zoom: 1;
    *display: inline;
}

.info, .light-blue { background: #88b0d7 url('/images/site/box-light-blue-gradient.gif') top repeat-x;}
.info::before { 
    background: url('/images/site/icon-info.png') 5px 2px no-repeat transparent;
}

.tips, .green { background: #98ab64 url('/images/site/box-green-gradient.gif') top repeat-x;}
.tips::before {
    background: url('/images/site/icon-tack.png') 5px 2px no-repeat transparent;
}

.print, .orange { background: #ca6115 url('/images/site/box-orange-gradient.gif') top repeat-x;}
.print::before {
    background: url('/images/site/icon-print.png') 5px 2px no-repeat transparent;
}

.help, .blue { background: #0062bd url('/images/site/box-blue-gradient.gif') top repeat-x;}
.help::before { 
    background: url('/images/site/icon-help.png') 5px 2px no-repeat transparent;
}

.person, .teal { background: #007b7d url('/images/site/box-teal-gradient.gif') top repeat-x;}
.person::before { 
    background: url('/images/site/icon-person.png') 5px 2px no-repeat transparent;
}

.cite, .brown { background: #8c5c2c url('/images/site/box-brown-gradient.gif') top repeat-x;}
.cite::before { 
    background: url('/images/site/icon-cite.png') 5px 2px no-repeat transparent;
}

.buy, .dark-blue { background: var(--primary-color) url('/images/site/box-dark-blue-gradient.gif') top repeat-x;}
.buy::before { 
    background: url('/images/site/icon-buy.png') 5px 2px no-repeat transparent;
}
.whi-buy h1 { 
    background: #003e73; 
    padding-left: 1rem;
}

.book, .wine { background: #7a3136 url('/images/site/box-wine-gradient.gif') top repeat-x;}
.book::before {
    background: url('/images/site/icon-book.png') 5px 2px no-repeat transparent;
}

.grey {color:#666;}
.light-grey { background-color:#ddd !important;}
.black {color:#333;}

.blue-background {
	background: var(--primary-color); /* for non-css3 browsers */
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='var(--primary-color)', endColorstr='#0062bd'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(var(--primary-color)), to(#0062bd)); /* for webkit browsers */
	background: -moz-linear-gradient(top,  var(--primary-color),  #0062bd); /* for firefox 3.6+ */
}
.record-type-info p, .record-type-info ul, .record-type-info ol, .record-type-info h2, .record-type-info h3, .record-type-info ul.arrow-list {
	padding-right: 10px;
	padding-left: 10px;
}

/* Search results Records */
.search-record {
    border-top: 1px solid hsl(26, 46%, 45%);
    margin: 0 10px;
    overflow: hidden;
    padding: 20px 3px;
}
.search-record h1 {
    font-size: 1.3rem;
    line-height: 1.3rem;
    letter-spacing: normal;
}
.search-record .content-type {
    font-size: 1.1rem;
    font-weight: bold;
    color: #999;
    text-transform:uppercase;
}

/* Results List records
-----------------------------*/
.results-list .search-record > * {
    display: block;
    position: relative;
    margin-inline-start: 160px;
    margin-inline-start: 10rem;
}
.results-list .search-record > a {
    float: left;
    margin-inline-start: 0;
    width: 144px;
}
.results-list .search-record > a > img {
    display: block;
    float: right;
    max-width:150px;
}

/* Associated Records */
.associated-records > div,
.group-border {
    border: 1px #929496 solid;
}

.associated-records > div > h1,
.associated-records > div > h2,
.associated-records > div > h5,
.associated-records > div > p,
.associated-records > div > strong,
.group-padding/*,
.associated-records > div > ul*/ {
    padding: 6px 20px;
}
/*
.associated-records > div > :nth-child(2) {
    padding-top: 4.5rem;
}
*/
.associated-records > div > img {
    width:100%;
}
.associated-records > div > h1,
.group-heading {
    background: var(--primary-color);
    color: #fff;
    font-weight: 500;
    font-size: 1.6rem;
    line-height: 1.6rem;
    text-transform: uppercase;
    font-family: 'Oswald', sans-serif;
    letter-spacing: 0.05em;
}
.associated-records > div > h1.help {
    font-size: 18px;
    font-size: 1.125rem;
    padding: 0;
    font-weight: bold;
    line-height: 34px;
    line-height: 2.125rem;
    text-transform: none;
}

.related-record, .featured-record {
    margin: 0 10px;
    padding: 20px 3px 20px;
    border-top: 1px solid #ddd;
}

.chunk .related-record, .chunk .featured-record {
    border-top: none;
}
.chunk .related-record img, .chunk .featured-record img {
    width: unset;
}

#dynamicBooks>.related-record {
    border: none;
    padding: 0;
}

.record-image {
    margin: 0 10px;
    padding: 0px 3px;
    border-top: 1px solid #ddd;
}
.related-record > h1, .featured-record > h1, .featured-photo > h1, .search-record h1 {
    font-size: 1.3rem;
    line-height: 1.3rem;
    letter-spacing: normal;
    font-weight: bold;
}
.featured-record > * {
    display: block;
    width: 75%;
    padding-left: 26%;
}
.featured-record > a {
    float: left;
    padding-left: 0;
    width: auto;
}
.featured-photo {
    display: inline-block;
    *zoom: 1;
    *display: inline;
    vertical-align: top;
    overflow: hidden;
}
.featured-photo + div {
    display: inline-block;
    *zoom: 1;
    *display: inline;
    vertical-align: top;
    width: 50%;
}
.featured-photo > * {
    display: block;
    /*padding-left: 150px;
    width: 45%;*/
}
.featured-photo > a {
    position: relative;
    float: left;
    padding-left: 0;
    width: auto;
}


/* Buy Boxes with multiple buy options */
.whi-buy-options {
    text-align: center;
    margin-top: 2rem;
}
.whi-buy-options > div, .record-type-info > form {
    display: inline-block;
    *zoom: 1;
    *display: inline;
    text-align: center;
    /*width: calc(50% - 4px);*/
    margin-top: 0;
}
.whi-buy-options > div + div, .record-type-info > form + form {
    border-left: 1px #ccc solid;
}
.whi-buy-options > div > * {
    display: block;
    margin: 0.5rem auto;
}
.whi-buy-options h2 {
    font-size: 1.3rem;
}
.whi-buy-options p:last-child {
    margin-top: 2rem;
    font-size: 0.9rem;
    font-style: italic;
}


/* image and slideshow titles
-------------------------*/
.enlarg-image a img, .enlarg-image a:hover img {
	border: none;	
}
.enlarg-image a span {
	cursor: pointer;
} 
.enlarg-image span {
	position: absolute;
	width: 30px;
	height: 30px;
	background: url('/images/site/enlarge.gif') left no-repeat;
	left: 0;
	top: 0;
	text-indent: -2000rem;
	z-index:1000;
}
.content-image-left, .content-image-right {
    float: right;
    margin: 5px 0 1rem;
    margin-inline-start: 2rem;
    padding: 0 0 0 10px;
    border-left: solid 1px #ccc;
    width: 260px;
    position: relative;
    clear: right;
}

@media (max-width: 500px) {
    .content-image-left, .content-image-right {
        float: none;
        margin-inline-start: 0;
        margin: 1rem 0;
        padding: 0;
        border: none;
        width: inherit;
    }
}

.RecordContainer .dark {
	padding:0 !important;
}
.content-image-top {
	margin: 0 0 20px 0;
	padding: 0 0 20px 0 !important;
	border-bottom: solid 1px #ccc;
	max-width: 75%;
	position:relative;
	clear:right;
}
.slideshow {
	width: 260px;
	height:0px;
	overflow:hidden;
}
.right {
	float: right !important;
	clear:none !important;
}
.left {
	float: left !important;
	clear:none !important;
}



/*------------------------------------*\
	Dropdown Nav (as seen in hours cartridge on home page)
\*------------------------------------*/
#nav{
	list-style:none;
	font-weight:bold;
	margin:10px 0;
	width:100%;
}
#nav li{
	margin-right:10px;
	position:relative;
	width:205px;
}
#nav-down-arrow {
	width: 0;
	height: 0;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 5px solid blue;
	display:inline-block;
    *zoom: 1;
    *display: inline;
	float:right;
	margin-top:5px;
}
#nav a {
	display:block;
	padding:5px !important;
	width:210px;
	background:#fff !important;
	text-decoration:none;
	border:1px solid #929496;
	border-radius: 2px 2px 2px 2px;
}
#nav ul a {
	border:none;
	border-radius:none;
}
#nav a:hover{
	background:#3399ff !important;
	color:#fff;
}

/*--- DROPDOWN ---*/
#nav ul{
	background:#fff; /*  IE7+ fix - make this the same as the background of where this is positioned. */
	list-style:none;
	position:absolute;
	left:-9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */
	border:1px solid #ddd;
	border-bottom-left-radius: 2px;
	border-bottom-right-radius: 2px;
	width:220px;
}
#nav ul li{
	float:none;
}
#nav ul a{
	white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
}
#nav li:hover ul{ /* Displays the dropdown on hover */
	left:0; /* Bring back on-screen when needed */
}
#nav li:hover ul li a:hover{ /* styles hover on each individual link. */
	background:#3399ff !important;
	color:#fff;
}


/*-- Content-Type Specific --*/

/* preserve-your-building-nav */
.preserve-your-building-nav > div {
    background: #ddd;
    font-size: 13.5px;
    font-size: 1.2rem;
    font-family: Arial, Verdana, sans-serif;
}
.preserve-your-building-nav > div > * {
    padding-left: 20px;
}
.preserve-your-building-nav > div > h1 {
    background: #98ab64;
    font-size: 16.8px;
    font-size: 1.25rem;
    text-transform: none;
}
.preserve-your-building-nav > div > ul > li + li {
    margin-top: 11px;
    margin-top: 1em;
}
.related-product:hover {
    background-color: #ccc;
}


/* Presentational cheats we still apparently need */
.bottom-margin {
    margin-bottom: 1rem;
}
@property --stop-one {
	syntax: "<length>";
	inherits: false;
	initial-value: 0;
}
@property --stop-two {
	syntax: "<length>";
	inherits: false;
	initial-value: 0;
}
@property --color-one {
	syntax: "<color>";
	inherits: false;
	initial-value: white;
}
@property --color-two {
	syntax: "<color>";
	inherits: false;
	initial-value: white;
}
@property --color-three {
	syntax: "<color>";
	inherits: false;
	initial-value: white;
}
@property --color-four {
	syntax: "<color>";
	inherits: false;
	initial-value: white;
}

#record-search{
    float:right;
}
#record-search .search-input {
    max-width: 5em;
}
aside > #record-search { 
    margin: 2em 0 2em 0;
    float:unset;
}

#search-section {
        background-color: white;
    }
#search-section > ul > li > form, #home-search-form > form, #record-search {
    border-bottom: 1px solid hsl(210, 20%, 70%);
    border-bottom-color: var(--primary-color);
}

#home-search-form form {
	display: flex;
	flex-wrap: nowrap;
	width: 100%;
}

.big-hero .major-link {
    color: var(--primary-color);
    background-color: white;
    border: none;
    margin-bottom: 1em;
}

.big-hero .major-link:hover, .big-hero .major-link:focus {
    color: var(--primary-color);
    background-color: white;
    border: none;
    margin-bottom: 1em;
    -webkit-box-shadow: 0 0 3px 1px #ddd;
    -moz-box-shadow: 0 0 3px 1px #ddd;
    box-shadow: 0 0 3px 1px #ddd;
}


#search-form {
    width: 100%;
}

.user-term, .user-facet {
    font-size: 1em;
    height: 2em;
    line-height: 2em;
}

input[name="terms"] {
    font-size: 1.7em;
    height: 2em;
    line-height: 1.7em;
    padding-left: 1em;
    width: 87%;
}

input[name="addTerm"] {
    border: 1px inset hsl(210, 10%, 60%);
    font-size: 1.7em;
    height: 2em;
    line-height: 1.7em;
    padding-left: 1em;
}

.search-button {
    height: 2em;
    font-size: 1.7em;
    line-height: 1.0em;
    padding: 0em 2em 0em 2em;
    margin-left: 0;
    background-color: #ca6115;
    background-image: none;
    color: #fff;
    font-family: 'Oswald', sans-serif;
    font-weight: 500;
    letter-spacing: 0em;
    float:right;
}

.search-button:hover, .search-button:focus{
    cursor: pointer;
    background-color: #9c4b10;
}

#search-section {
    z-index: 1;
}

#search-section > div > ul > li {
    display: inline-block;
    color: #ddd;
    font-size: 1.5em;
    padding: 0.5em 1.5em 1.5em 1.5em;
}
#search-section > div > ul > li > a {
    color: #777;
    font-weight: 500;
    text-transform: uppercase;
}

#search-section > div > ul > li .active {
    border-bottom: 3px solid var(--primary-color);
    color: var(--primary-color);
    font-weight: 500;
}

#search-section > div > ul > li a:not(.active):hover, #search-section > div > ul > li a:not(.active):focus {
    color: black;
}

/*Affects all submits*/
[type="submit"]:hover {
    background-color: #9c4b10;
}

.browse-stuff {
    display: block;
    padding: 8px 8px 0px 8px;
}
.browse-stuff > p {
    font-size: 1.8em;
    color: white;
    font-family: 'Oswald', sans-serif;
    font-weight: 500;
    text-align: left;
    line-height: 1em;
    margin-bottom: .2em;
}
.browse-stuff > p:first-of-type {
    font-size: 1.5em;
    line-height: 1em;
}
.browse-stuff > p:last-of-type {
    font-size: 1.1em;
    line-height: 1.1em;
    font-weight:100;
}

@media (max-width: 450px) {
    .browse-stuff > p:last-of-type {
        font-size: .6rem;
    }
}

.browse-stuff .brand-underline {
    text-transform: uppercase;
    margin-bottom: 5px;
    min-height: 2em;
}
.swag-line {
    display: inline-block;
    height: 2px;
    margin-bottom: 10px;
    background-color: white;
    width: calc((50%) - 9px);
}
.swag-left-box {
    background-color: white;
    display: inline-block;
    height: 8px;
    width: 2px;
    margin: 0 1px 0 -5px;
    margin-bottom: 7px;
}
.swag-box {
    background-color: white;
    display: inline-block;
    height: 8px;
    width: 2px;
    margin-bottom: 7px;
}
.swag-right-box {
    background-color: white;
    display: inline-block;
    height: 8px;
    width: 2px;
    margin: 0 -5px 0 1px;
    margin-bottom: 7px;
}

.swag-bar {
	--stop-one: 8px;
	--color-one: white;
	--color-two: white;
	--color-three: white;
	--color-four: white;
	background-color: var(--brand-blue);
	background-image:
		linear-gradient(var(--color-four) 0, var(--color-three) 50%, var(--color-four) 100%),
		linear-gradient(var(--color-four) 0, var(--color-three) 50%, var(--color-four) 100%),
		linear-gradient(var(--color-four) 0, var(--color-three) 50%, var(--color-four) 100%),
		linear-gradient(to right, var(--color-one) 0, var(--color-two) 100%),
		linear-gradient(to left, var(--color-one) 0, var(--color-two) 100%);
	background-size: 2px 8px, 2px var(--stop-one), 2px 8px, calc(50% - 8px) 2px, calc(50% - 8px) 2px;
	background-position: calc(50% - 8px) 2px, center, calc(50% + 8px) 2px, 0 5px, 100% 5px;
	background-repeat: no-repeat;
	height: 12px;
	width: 100%;
	margin-top: -2px;
	margin-bottom: 12px;

	transition: --color-one 0.5s ease, --color-two 0.5s ease 0.125s, --color-three 0.5s ease 0.25s, --color-four 0.5s ease 0.375s,
        --stop-one 0.5s;
}
.browse-stuff:hover .swag-bar {
	--stop-one: 10px;
	--color-one: #ac5c2c;
	--color-two: #9c5c2c;
	--color-three: #9c5c2c;
	--color-four: #ac5c2c;
}

#secondary-nav {
    background-color: white;
    border-bottom: 1px solid hsl(210, 20%, 70%);
    border-bottom-color: var(--primary-color);
    display: none;
    padding-bottom: 7px;
    padding-top: 7px;
}

#secondary-nav-toggle,
#search-toggle {
    left: -1000px;
    position: absolute;
}
label.major-link {
    cursor: pointer;
    user-select: none;
}

nav > input#secondary-nav-toggle:checked ~ nav,
nav > input#search-toggle:checked ~ #search-section {
    display: block !important;
}

nav > input[type=checkbox]:active + label,
.browse-label:hover,
nav > input[type=checkbox]:checked + label {
    background-color: white;
    color: var(--primary-color);
}

body > nav > .donate-link {
    color: white;
    background-color: #7a3136;
    border-color: white;
    margin-bottom: 8px;
    border-width: 1px;
    border-style: solid;
    box-shadow: 0 0 0 1px #00254b;
}

body > nav > .donate-link:hover, body > nav > .donate-link:focus {
    color: #7a3136;
    background-color: white;
    box-shadow: 0 0 0 1px white;
    border-width: 1px;
    border-style: solid;
}

#secondary-nav ul {
    display: grid;
	grid-template-columns: repeat(auto-fit, minmax(135px, 1fr));
	grid-gap: 1rem;
	background: white;
	padding: 1rem;
	grid-column: 1/span 7;
}

#secondary-nav ul li {
    filter: drop-shadow(0 0 3px rgba(0, 0, 0, .25));
    /* display: inline-block;
    height: 148px;
    margin-left:4px;
    margin-right:4px;
    vertical-align: top;
    width: 15%; */
}
.browse-stuff {
    background-color: var(--primary-color);
}
.browse-stuff:hover span {
    background-color: #8c5c2c;
}

body > nav > * {
    text-align: center;
}

#search-section {
    display: block;
    align-self: center;
    background-color: var(--primary-color);
    margin: 0 .5rem;
    width: 98%;
    justify-self: right;
}

#home-search-form input.search-input {
    border-radius: 5px 0 0 5px;
    font-size: 1.25rem;
}

#home-search-form button.search-button {
    border-radius: 0 5px 5px 0;
    background: white;
    font-size: 1.25rem;
}

.fa-search::before {
    color: var(--primary-color);
}

@media (max-width: 450px) {
    .browse-stuff > p:last-of-type {
        font-size: .6rem;
    }

    #search-section {
        justify-self: center;
    }
}
a:link {
    text-decoration: none;
}

.cms-article {
    font-size: 16px;
    font-size: 1rem;
}

.cms-article header h1:first-child{
	padding: 10px 25px;
}

.cms-article ol {
    list-style: decimal;
}

.cms-article ul {
    list-style: disc;
    margin: 0 0 1.8em 45px;
}
.cms-article ul > li {
	margin-bottom: 8px;
	font-size: 1rem;
}
.cms-article ul.inline-list {
    margin: 0;
}
.cms-article ul[class*=arrow-list] {
    list-style: none;
    margin: 8px 0 16px 16px;
}
.cms-article ul[class*=arrow-list] > li {
    margin: 0;
}

.cms-article table tr {
    display: table-row;
}

/*Chunk Grid Style*/
.chunk {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
	grid-gap: 1rem;
 }

    .large {
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    }

    .small {
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    }
 
    .half, .video, .sites {
    grid-template-columns: repeat(auto-fit, minmax(49%, 1fr));
    }
 
 .chunk img {
   width: 100%;
   filter: drop-shadow(0 0 3px rgba(0,0,0,.25));
 }

 .fig img {
     height: 100%;
 }
 
 .chunk a:hover img {
   filter: sepia(100%) hue-rotate(190deg) saturate(100%) drop-shadow(0 0 3px rgba(0,0,0,.25));
 }


/* Related Products
----------------------------------- */
.related-products-caption {
    border: none !important;
    font-weight: bold;
    text-align: center;
	width: 100%;
	font-family: 'Oswald', sans-serif; 
	font-weight: 500;
}

.related-product {
    border: none !important;
    display: flex;
    flex-direction: column;
    align-items: center;
	text-align: center;
	filter: drop-shadow(1px 1px 4px rgba(0,0,0,.25));
	background: white;
	margin: 1rem 0;
    padding: 1rem 0;
}

.product-title {
    padding: 0 1rem;
}

.product-price {
	display:none;
}

/*TMD - Edge sizes the children of a display: flex element by the size of their contents, instead of based on the size of their parent, so this should fix that*/
.related-product > * {
    width: 100%;
}

/* Article banner and transparent overlay
----------------------------------- */

.category-banner {
	background-size: cover;
	height: 300px;
}

.transparent-text-wrapper {
	background-color:rgba(0,0,0,0.5);
	color: white;
    height: 100%;
    padding: 0 20px 0 20px;
    width: 40%;
    
}

.transparent-text-wrapper h2 {
	padding-top:20px;
}


/* HTML forms in CMS
----------------------------------- */

.cms-article label, body.mceContentBody label {
	font-weight:bold;
	padding-top:10px;
	display:block;
}
.cms-article label.error {
	color:#F00 !important;
	}
.cms-article .float-field, body.mceContentBody .float-field {
	float:left;
	margin-right:6px;
} 
.cms-article label span, body.mceContentBody label span {
	font-weight:normal;
	font-size: 0.9em;
}
.cms-article fieldset, body.mceContentBody fieldset {
	background-color:#ddd;
	padding: 1rem;
	max-width:100%;
}
.cms-article legend, body.mceContentBody legend {
	font-weight:bold;
	font-size:1.4em;
	font-family:Arial, Helvetica, sans-serif;
	margin:0 0 0 -2px;
	padding:30px 0 0 0;
}
.cms-article fieldset input[type="text"], .cms-article fieldset input[type="tel"], .cms-article fieldset input[type="email"], .cms-article fieldset textarea,
body.mceContentBody fieldset input[type="text"], body.mceContentBody fieldset input[type="tel"], body.mceContentBody fieldset input[type="email"], body.mceContentBody fieldset textarea {
    background-color: #FCF7F9;
	border:solid 1px #ddd;
	padding:5px;
	color:#666;
	width: 95%;
}
.cms-article fieldset input[type="text"].error, .cms-article fieldset input[type="tel"].error, .cms-article fieldset input[type="email"].error, .cms-article fieldset textarea.error,
.cms-article fieldset input[type="text"].input-validation-error, .cms-article fieldset input[type="tel"].input-validation-error, .cms-article fieldset input[type="email"].input-validation-error, .cms-article fieldset textarea.input-validation-error {
    background-color:#FCC !important;
    border: solid 1px #F00 !important;

}
#btnSubmitFeedback {
	font-size:14px;
	padding: 8px 19px 9px;
	margin:0 !important;
	color:#fff !important;
	font-weight:bold;
	font-family:Arial, Helvetica, sans-serif;
}
#btnSubmitFeedback:hover {
	text-decoration: underline;
	cursor:pointer;
}

/* Jquery UI overrides */
.ui-tabs {
	padding: 0 !important;
}
.ui-tabs .ui-tabs-panel {
    padding: 0 !important;
}
.ui-widget {
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif !important;
	font-size: 1.05em !important;
}
.ui-widget-content {
	border:0 !important;
	background: transparent !important;
}
.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl {
    border-top-left-radius: 0 !important;
}
.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr {
    border-top-right-radius: 0 !important;
}
.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl {
    border-bottom-left-radius: 0 !important;
}
.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {
    border-bottom-right-radius: 0 !important;
}
.ui-tabs .ui-tabs-nav li {
	top:0 !important;
	padding: 0 !important;
}
.ui-tabs .ui-tabs-nav li a {
	padding: 0 !important;
}
.ui-widget-header {
	background: none !important;
	border: 0 !important;
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    background: none !important;
    border: 0 !important;
    color: #333 !important;
    font-weight: normal !important;
}

/***************************************************************************


              Tabbed Menu and Wrapper - Membership Pages
                                -------

  This section styles the tabbed menu on all donation pages

  
  Current formatting includes tabs for:
  
		- join or renew
		- donate
		- gift memberships
		- monthly giving


****************************************************************************/

ul.internalMenu {
	list-style-type: none !important;
	padding-bottom: 35px !important;
	border-bottom: 1px solid #ccc !important;
	margin: 0 !important;
}
.press-tabs-wrapper ul.internalMenu {
	list-style-type: none !important;
	padding-bottom: 0px !important;
	border-bottom: 1px solid #ccc !important;
	margin: 0 0 -1px 0 !important;
	max-width: 618px !important;
}
ul.internalMenu li, .press-tabs-wrapper div.ui-tabs .ui-tabs-nav li {
	float: left !important;
	height: 26px !important;
	background-color: #fff !important;
	margin: 0 -1px 0 0 !important;
	padding: 4px 1em !important;
	border: 1px solid #ccc !important;
	text-transform:uppercase !important;
	font-family:Arial, Helvetica, sans-serif !important;
	font-size:1.2em !important;
}
.press-tabs-wrapper div.ui-tabs .ui-tabs-nav li {
	margin-left: -2px !important;
}
ul.internalMenu li.selected, ul.internalMenu li.selected:hover,
.press-tabs-wrapper ul.internalMenu li.ui-tabs-selected, .press-tabs-wrapper ul.internalMenu li.ui-tabs-selected:hover {
	border-bottom: 1px solid #ddd !important;
	background-color: #ddd !important;
}
ul.internalMenu li.selected a, ul.internalMenu li.selected a:hover
.press-tabs-wrapper ul.internalMenu li.ui-tabs-selected a, .press-tabs-wrapper ul.internalMenu li.ui-tabs-selected a:hover { 
	color: #000 !important; 
}
ul.internalMenu a, .press-tabs-wrapper ul.internalMenu a {
	float: left !important;
	display: block !important;
	color: #666 !important;
	text-decoration: none !important;
	padding: 4px !important;
	font-weight:normal !important;
}
ul.internalMenu a:hover, .press-tabs-wrapper ul.internalMenu a:hover {
	color:#0033cc !important;
}
ul.internalMenu li:hover, .press-tabs-wrapper ul.internalMenu li:hover { 
	background-color: #fbfbfb !important;
	border-bottom: 1px solid #ddd !important; 
}
var(--secondary-color), .press-tabs-wrapper var(--secondary-color) {
	font-family: Verdana, Arial, sans-serif !important;
	line-height: 1.6em !important;
	clear:both !important;
	margin: 0 0 20px 0 !important;
	padding:20px !important;
	border-left: 1px solid #ccc !important;
	border-right: 1px solid #ccc !important;
	border-bottom: 1px solid #ccc !important;
	background: #ddd !important; /* for non-css3 browsers */
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dddddd', endColorstr='#ffffff') !important; /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#ddd), to(#fff)) !important; /* for webkit browsers */
	background: -moz-linear-gradient(top,  #ddd,  #fff) !important; /* for firefox 3.6+ */ 
}
var(--secondary-color) p, .press-tabs-wrapper .ui-widget-content p {
	margin-bottom:1.8em !important;
}
var(--secondary-color) a, .press-tabs-wrapper .ui-widget-content a {
	font-size:1em !important;
}
.right-nav-top-promo {
	margin:20px 0;
}
/*---------------------------------------------------------------------------


                            Custom Styles
                         ------------------------

  Styles developed after the main styles
    


---------------------------------------------------------------------------*/

.left p, .right p {
	margin-bottom:1.0em !important;
}
.left h2, .right h2 {
	margin-bottom:1.0em !important;
}
/* New Sidebar Ribbon Style
--------------------------------------------*/
.sidebar {
	float:right; 
	clear:right;
	position:relative;
	background-color:#fff;
	width:260px; 
	margin:0 0 20px 20px;
	min-height:10px; 
	border-left:1px solid #ccc; 
	z-index:0;
	padding-left:10px;
}
.sidebar p:first-child {
	margin-top:50px;
}
.ribbon {
   position:relative;
   width: 301px;
   font-size: 20px!important;
   background: #5c5c5c;
   font-family: 'Helvetica Neue',Helvetica, sans-serif;
   left:-20px;
   margin-bottom:10px;
   }
.ribbon h4 {
   font-size: 16px!important;
   color:#fff;
   text-shadow: 0px 1px 2px #000;
   margin:0;
   padding: 15px 10px 15px 20px;
   }
.ribbon:before {
  content: '';
  position: absolute;
  top: 100%;
  left: 0px;
  height: 0;
  width: 0;
  border-top: 10px solid #333;

  border-left: 10px solid transparent;
}

/* New sidebar for HOBO restoration how-tos
---------------------------------------------- */
.sidebar-restoration {
	float:right; 
	clear:right;
	position:relative;
	background: #fff url('/images/site/sidebar-restoration-header.png') no-repeat 0 0;
	width:250px; 
	margin:0 0 20px 20px;
	min-height:10px; 
	border:1px solid #ccc; 
	z-index:0;
	padding-left:10px;
	padding-top:93px;
}
.sidebar-restoration div {
	max-width:110px;
	float:left;
	padding-right: 20px;
}
.sidebar-restoration h6 {
	padding-bottom:0px !important;
	margin-bottom:0px !important;
}
.sidebar-restoration div.tools {
	background: #fff url('/images/site/icon-tools.png') no-repeat 17px 0;
	padding-left:60px;
}
.sidebar-restoration div.tools a {
	font-size: 100% !important;
	width:110px !important;
	padding:0px !important;
}
/* Disabled links for commission navigation
-------------------------------------------------*/
li.grey, ul.grey {
	color:#666;
	font-weight:normal;
}
/* Popup styles
-------------------------------------------------*/
a.donate-now {
	background:url('/images/site/DONATE-NOW-button.png') no-repeat 0 0 transparent;
	display:block;
	width:223px;
	height:50px;
	padding:0;
	margin-top:5px;
	position:absolute;
	bottom:5px;
	right:5px;
	outline:none;
	border:none;
	color:#fff;
	font-family: Helvetica,Arial,Sans-serif,sans-serif;
	letter-spacing:-0.02em;
	font-weight:bold;
	text-transform:uppercase;
	font-size:1.6em;
	cursor: pointer;
}
a.donate-now:hover {
	background-position: 0 -50px;
	text-decoration:none;
}
a.donate-now span {
	position:absolute;
    left:-9999px;
}
div.popup-donate {
	max-width: 480px;
	height: 380px;
	background-image:url('/images/site/membership-popup.jpg');
	position:relative;
	color:#fff;
	font-size:1.25em;
}
.fund-address {            /* Styles propery funding articles organizational address */
	font-weight: normal; 
	display: block; 
	margin-left: 90px;
}
.source {
	margin-top: 7px !important;
	color: #444444; 
	font-size: 0.90em !important;
}
.section-cartridge .source {
	margin-top: 0px !important;
}
.table-header {
	background-color:#88b0d7;
}
.section-promo-image {
	float:left;
	margin: 2px 0 0 18px;
	width:100px;
}
.award .section-promo-image {
	margin: 0 0 0 2px;
	width:55px;
}
.award {
	padding-bottom: 15px;
}
.section-promo-description {
	padding-left: 105px;
}
.award .section-promo-description {
	padding-left: 40px;
}
.promo-top {
	margin:0;
	padding:10px 0 0 0;
}
.textbook {
	margin-top:-10px;
	padding-bottom:4px;
	margin-bottom:-1px; /*used for the textbook top to a search results 360 cartridge. To switch to short promo, remove this line. Seen on Teach and Learn. */
	border-bottom:1px solid #ccc;
	background-color:#ddd;
}
.textbook div.section-promo-image {
	margin:0;
	padding:0;
	width:150px;
	height:117px;
	overflow:hidden;
}
.textbook h2 {
	padding-top: 20px;
	margin-bottom: 0;
}
.textbook div.section-promo-description {
	padding-left:150px;
}
/* New Purchase a copy styles October 2012
---------------------------------------------- */
.purchase-info {
	border:1px solid #ccc;
	max-width:605px;
	margin-top:20px;
	font-size:0.9em !important;
	float:left;
}
.purchase-info p {
	max-width:85%; /* Set to 70% with orange "buy this" button is added or 40% when dropdowns and add-to-cart button is added */
	float:left;
	padding:0 0 0 15px;
}
.purchase-info p.intro {
	padding-top:15px;
}
.dropdown-wrapper {
	float:left;
	margin-left:20px;
}
.dropdown-wrapper div {
	float:left;
	clear:left;
	padding-bottom:7px;
}
.no-clear {
	clear:none !important;
}
.audio-360 {
	display:block;
	width:360px;
	height:30px;
}
/* New Field Trip Table Styles
------------------------------------*/
.field-trip-details {
	width:45% !important;
}
.field-trip-details td + td {
	 font-weight: bold;
}
/* Learn cartridge picture
------------------------------------*/
.learn {
	background:url('/images/promo/Medium/bob-lafollette.png') no-repeat 100% 100% #ffffff;
	overflow:hidden;
}

/* This Day styling
----------------------------------------*/
.whsbox {
font-family: arial, san-serif;
}

.whstitle {
font-size: 14px;
color: #132744;
font-weight: 900;
}

.whsheader {
font-size:11px;
font-weight: 900;
}

.whstext {
font-size:11px;
margin-top:2px;
margin:10px 20px 10px 66px;             /* As seen on 4-digit year timelines in HPC content, Chapter 1, Article 1 */
padding-left: 0;
text-indent: -46px;
}

.this-day-wrapper {
margin-bottom:20px;
}

/* New Large Circle Number styling - circle-numbers
--------------------------------------*/
ol.circle-numbers {
    counter-reset:li;
    margin-left:0 !important;
    padding-left:0 !important;
}
ol.circle-numbers > li {
    position:relative; /* Create a positioning context */
    margin:0 0 6px 60px; /* Moves text over to make room for the numbers */
    padding:0px 8px; /* Add some spacing around the content */
    list-style:none; /* Disable the normal item numbering */
    min-height:60px;
}
ol.circle-numbers > li:before {
    content:counter(li); /* Use the counter as content */
    counter-increment:li; /* Increment the counter by 1 */
    position:absolute;
    top:5px;
    left:-35px;
    -webkit-border-radius: 999px;
    -moz-border-radius: 999px;
    border-radius: 999px;
    behavior: url(PIE.htc);
    width: 12px;
    height: 12px;
    padding: 0px 4px 6px 4px;
    background: #fff;
    border: 2px solid #666;
    color: #666;
    text-align: center;
    font: 14px Arial, sans-serif;
    margin-right:8px;
    border-top:2px solid #666;
    color:#fff;
    background:#666;
    font-weight:bold;
    font-family:"Helvetica Neue", Arial, sans-serif;
    text-align:center;
}
li ol.circle-numbers,
li ul.circle-numbers {margin-top:6px;}
ol.circle-numbers ol.circle-numbers li:last-child {margin-bottom:0;}
ol.circle-numbers h5 {font-family:Arial; font-size: 1.4em; margin:0; padding:0;}


/* New Large Circle Number styling - circle-numbers-large LARGER
--------------------------------------*/

ol.circle-numbers-large {
    counter-reset:li;
    margin-left:0 !important;
    padding-left:0 !important;
}
ol.circle-numbers-large > li {
    position:relative; /* Create a positioning context */
    margin:0 0 6px 60px; /* Moves text over to make room for the numbers */
    padding:0px 8px; /* Add some spacing around the content */
    list-style:none; /* Disable the normal item numbering */
    min-height:60px;
}
ol.circle-numbers-large > li:before {
    content:counter(li); /* Use the counter as content */
    counter-increment:li; /* Increment the counter by 1 */
    position:absolute;
    top:5px;
    left:-55px;
    -webkit-border-radius: 999px;
    -moz-border-radius: 999px;
    border-radius: 999px;
    behavior: url(PIE.htc);
    width: 18px;
    height: 18px;
    padding: 8px;
    background: #fff;
    border: 2px solid #666;
    color: #666;
    text-align: center;
    font: 22px Arial, sans-serif;
    margin-right:8px;
    padding: 0 4px 8px 4px;
    border-top:2px solid #666;
    color:#fff;
    background:#666;
    font-weight:bold;
    font-family:"Helvetica Neue", Arial, sans-serif;
    text-align:center;
}
li ol.circle-numbers-large,
li ul.circle-numbers-large {margin-top:6px;}
ol.circle-numbers-large ol.circle-numbers-large li:last-child {margin-bottom:0;}
ol.circle-numbers-large h5 {font-family:Arial; font-size: 1.4em; margin:0; padding:0;}
ol.circle-numbers h4, ol.circle-numbers-large h4 {line-height:1.6em;}

/* Accordion Styles
----------------------------*/
.ui-widget-content a {

	color:#0033cc !important;
	letter-spacing:normal !important;
	/*font-size: 0.9em !important;  AKT - removed this line because it was making CMS links tiny in accordion */
}
.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited, .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited {
	color:#0033cc !important;
	font-weight:bold !important;
	font-size: 0.85em !important;
	font-family: Arial, Helvetica, sans-serif;
	letter-spacing:normal !important;
}
.ui-state-default .ui-icon, .ui-icon {
	background-image: url(/jqueryui/css/ui-lightness/images/ui-icons_0008c4_256x240.png) !important;
}
.ui-accordion .ui-accordion-header a {
	padding: 0.29em 0 0 1.8em !important;
	}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {
	border:0 !important;
	background:none !important;
	}
.ui-accordion-content {
	padding-bottom:0 !important;
	}
.ui-accordion .ui-accordion-header .ui-icon {
	left: 0 !important;
	}

/* Our div-link-fake-buttons */
.button {
    border: 1px solid #ccc;
    margin-top: 40px;
    margin-bottom: 60px;
    padding-top: 5px;
    min-height: 20px;
    width: 45%;
    border-radius: 8px;
	filter: drop-shadow(0px 2px 2px rgba(0,0,0,.25));
    text-align: center;
}
.button.dark-blue * {
    color: white;
}
[class*=three-columns] .button.dark-blue {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
}

/**
    For some groups, probably
*/
.download-box {
	border: 1px solid #ccc;
	max-width:590px;
	margin: 2rem 0;
	padding: 1rem 0;
	min-height:20px;
	filter: drop-shadow(1px 1px 6px rgba(0,0,0,.25));
	border-radius: 8px;
	-moz-border-radius: 8px; /* Firefox 3.6 and earlier */
	-moz-box-shadow: 5px 5px 5px #888888; /* Firefox 3.6 and earlier */	
}
.download-box h2 {
	margin-left:10px;
}
.right-nav-box div.download-box {
	padding: 8px 0 0 0;
	margin: 10px 0 0px 0px;
	display: block;
	float: left;
	min-height:45px;
	width: 198px;
	box-shadow: none;
	-moz-box-shadow: none;
}

/*****************************************
    For specific articles
*/

/* CS3531, Connect with the Society */
#flickr_badge_wrapper {
	max-width:360px !important;
	text-align:left;
}

/* CS2868, Native American Object Recovery Effort */
div.museum-object-recovery .floatleft {
margin:5px 10px 10px 0px;
clear:left;
float:left;
}
div.museum-object-recovery .photo-wrapper {
margin:0px 0px 10px 0px;
float:left;
}
div.museum-object-recovery .tallest {
margin-bottom:90px;
}
div.museum-object-recovery .tall {
margin-bottom:70px;
}
div.museum-object-recovery dl {
margin-left:5px;
}
div.museum-object-recovery dd {
margin-top:3px;
margin-bottom:6px;
}
div.museum-object-recovery .body h4 {
margin-bottom:10px;
font-size:125%;
}
div.museum-object-recovery .top {
border-top:1px #666 solid;
padding-top:10px;
}
div.museum-object-recovery dt {
	font-weight:bold;
}
div.museum-object-recovery dt span {
	font-weight:normal;
}
div.museum-object-recovery .style1 {
    	margin-top:0;
}

/* CS15265,  */
#gmap {
    display: block;
    width: 360px;
    height: 391px;
    background: url('/images/restoration-map/restoration.png') no-repeat 0 0;
    position: relative;
    margin: 0 auto 2em auto;
}
#gmap a {
    color: #000;
    font-family: arial, sans-serif;
    font-size: 1.2em;
    font-weight: bold;
    text-transform: uppercase;
}
#gmap a span {
    position:absolute;
    left:-9999px;
}
a#roof {
    display: block;
    width: 227px;
    height: 0;
    padding-top: 140px;
    overflow: hidden;
    position: absolute;
    left: 0px;
    top: 0px;
}
* html a#roof {
    height: 120px;
    height: 0;
}
a#roof:hover {
    background: transparent url('/images/restoration-map/restoration-roof.png') no-repeat 0 0;
    overflow: visible;
}
a#efficiency {
    display: block;
    width: 175px;
    height: 0;
    padding-top: 135px;
    overflow: hidden;
    position: absolute;
    right: 0px;
    top: 0px;
}
* html a#efficiency {
    height: 105px;
    height: 0;
}
a#efficiency:hover {
    background: transparent url('/images/restoration-map/restoration-efficiency.png') no-repeat -185px 0;
    overflow: visible;
}
a#paint {
    display: block;
    width: 60px;
    height: 0;
    padding-top: 265px;
    overflow: hidden;
    position: absolute;
    right: 0px;
    bottom: 0px;
}
* html a#paint {
    height: 55px;
    height: 0;
}
a#paint:hover {
    background: transparent url('/images/restoration-map/restoration-paint.png') no-repeat -300px -126px;
    overflow: visible;
}
a#systems {
    display: block;
    width: 86px;
    height: 0;
    padding-top: 92px;
    overflow: hidden;
    position: absolute;
    left: 185px;
    top: 120px;
}
* html a#systems {
    height: 100px;
    height: 0;
}
a#systems:hover {
    background: transparent url('/images/restoration-map/restoration-systems.png') no-repeat -185px -120px;
    overflow: visible;
}
a#exterior {
    display: block;
    width: 106px;
    height: 0;
    padding-top: 280px;
    overflow: hidden;
    position: absolute;
    left: 80px;
    bottom: 0px;
}
* html a#exterior {
    height: 120px;
    height: 0;
}
a#exterior:hover {
    background: transparent url('/images/restoration-map/restoration-exterior.png') no-repeat -80px -111px;
    overflow: visible;
}
a#interior {
    display: block;
    width: 160px;
    height: 0;
    padding-top: 195px;
    overflow: hidden;
    position: absolute;
    right: 50px;
    bottom: 0px;
}
* html a#interior {
    height: 105px;
    height: 0;
}
a#interior:hover {
    background: transparent url('/images/restoration-map/restoration-interior.png') no-repeat -150px -196px;
    overflow: visible;
}
a#windows {
    display: block;
    width: 50px;
    height: 0;
    padding-top: 280px;
    overflow: hidden;
    position: absolute;
    left: 0px;
    bottom: 0px;
}
* html a#windows {
    height: 50px;
    height: 0;
}
a#windows:hover {
    background: transparent url('/images/restoration-map/restoration-windows.png') no-repeat 0px -111px;
    overflow: visible;
}