/* for compatibility with BS4 for clionav: */
*, ::after, ::before {
    box-sizing: content-box;
}

/* ---------------------------------------------------------------------------
	Copyright 2011 Paul Hansen / Ecopixel - www.ecopixel.com
	Reset basic HTML styles to common defaults.
--------------------------------------------------------------------------- */

/*	Idea from undohtml.css (CC) 2004-2005 Tantek Celik */
/* Also from YUI reset.css */

/* NOTE: We do not reset input and select. */

html,body,
h1,h2,h3,h4,h5,h6,p,blockquote,
dl,dt,dd,
ul,ol,li,
table,th,td,
form,fieldset,
pre,code,kbd,address,abbr,
a img,a:link img,:visited img { 
	font-weight: normal;
	font-style: normal;
	border: 0;
	margin: 0;
	padding: 0;	
	text-align: left;
	font-size: 1em;
	line-height: 120%;
}

/* These are not in the previous list */
/* Setting these specifically seems to create more cross-browser issues than it fixes. */
input,select {
}

table {
	border-collapse: collapse; /*	Equivalent to cellpadding="0" */
	border-spacing: 0; /* cellpadding="0", Gecko only, CSS2 */
	font-size: inherit; /* for html4 doctype, see: http://css-discuss.incutio.com/?page=UsingEms */
}

ul,ol { /*	We'll add back consistent indents and bullets later */
	list-style: none;
}

/* fix after upgrading from 9.5 to 10.4 */
.ce-intext.ce-right .ce-gallery, .ce-intext.ce-left .ce-gallery, .ce-above .ce-gallery {
    margin-bottom: 18px;
}


/* ---------------------------------------------------------------------------
	Copyright 2011 Paul Hansen / Ecopixel - www.ecopixel.com
	All Rights Reserved.
--------------------------------------------------------------------------- */

body {
	width: 100%;
	font-size: 80%;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #000;
	background-color: #574E37;
	position: relative;
}


/*
body#page-1,
body#page-316 {
	background-color: #000;
	color: #D6CEB9;
}
*/

body.sec-makinghistory {
/* original green
	background-color: #535737; 
	background-color:#414F26; 
	background-color: #535737; */ 
/*	background-color: #374857; */
}

body.sec-about {
	background-color: #374857;
}


body.sec-films {
/*	background-color: #572A25; */
}

body.sec-visualizing {
	background-color: #676A40;
}

body.sec-visualizing #wrap-top,
body.sec-visualizing #clionav {
	background-color: #3E4327;
}

body.sec-wmh {
	background-color: #0A182E;
	background-color: #3E526C;
}

body.sec-wmh #wrap-top,
body.sec-wmh #clionav {
	/* background-color: #374857; */
	/* background: #0A182E url(img/bg-top.png) center -200px no-repeat; */
	background-color: #1C2B44;
}



/* Order should be :link, :visited, :hover, :focus, :active */
a {
	color: #564398;
	text-decoration: none;
	border-bottom: 1px solid #564398;
}

a:visited {
	border-bottom: 1px dashed #564398;
}

a:hover {
	background-color: #EEEAE2;
}

/*
#page-1 #content a,
#page-316 #content a {
	color: #AEA3D6;
	text-decoration: none;
	border-bottom: 1px solid #AEA3D6;
}

#page-1 #content a:visited,
#page-316 #content a:visited {
	border-bottom: 1px dashed #AEA3D6;
}

#page-1 #content a:hover,
#page-316 #content a:hover {
	color: #564398;
	background-color: #EEEAE2;
}
*/

/* No underline on images that are links */
/* No border on img anchors */
#content .csc-textpic-image a,
#content .csc-textpic-image a:visited,
#content .csc-textpic-image a:hover,
#content .csc-textpic-imagewrap a,
#content .csc-textpic-imagewrap a:visited,
#content .csc-textpic-imagewrap a:hover {
	border: none;
	background-color: transparent;
}


/* ---------------------------------------------------------------------------
	BEGIN main layout section
--------------------------------------------------------------------------- */


#wrap {
	position: relative;
	margin: 0 auto;
	width: 750px;
}

/* remove wrap from test pages */
#page-1 #wrap,
#page-524 #wrap {
    display: none;
}

/* holds logo and nav */
#wrap-top {
	position: relative;
	width: 100%;
	background-color: #3A3424;
	overflow: hidden;
	border-bottom: 3px solid #9D8D64;
}

#clionav {
	background-color: #3A3424 !important;
	border-bottom: 3px solid #9D8D64 !important;
}

/*
#page-1 #wrap-top,
#page-1 #clionav,
#page-316 #wrap-top,
#page-316 #clionav {
	background-color: #572A25 !important;
}
*/

#wrap-logo {
	margin: 0 auto;
	width: 960px;
	position: relative;
}
#wrap-logo a {
	background-color: transparent !important; /* for ie7 */
/* for ie8 */
	border-bottom: none !important;
	position: relative; 
	display: block;
	height: 44px;
	width: 273px;
/* end for ie8 */
}

#logo {
	display: block;
	height: 44px;
	width: 273px;
	position: relative;
	left: -5px;
}

#logo-ruler {
	position: absolute;
	height: 3px;
	background-color: #FFF;
	z-index: 1;
	width: 695px;
	top: 36px;
	right: 0;
}

#wrap-nav {
	position: relative;
	width: 960px;
	margin: 0 auto;
}

#wrap-header {
	width: 100%;
	position: relative;
	overflow: hidden;
}


#header {
	margin: 0 auto;
	border-top: none;
	clear: both;
	position: relative;
	width: 750px;
	overflow: hidden;
	background: url(img/bg-header-allen.jpg) left bottom no-repeat;
}

/* Change header on Johnston pages */
body.subsec-johnston #header {
	background: url(img/johnston_banner_08.jpg) left 50% no-repeat;
}

body.sec-visualizing #header {
	background: url(img/bg-visualizing.gif) left bottom no-repeat;
	height: 200px;
}

body.sec-makinghistory h1#headline {
	color: #000;
}

body.sec-films #header {
	background: url(img/bg-header-films.jpg) left bottom no-repeat;
}

/* About Clio */
body.sec-about #header {
	background: #000 url(img/header-clio.jpg) left 50% no-repeat;
}

/* Women Making History */
body.sec-wmh #header {
	background: #000 url(img/header-books.jpg) left 50% no-repeat;
	height: 180px;
}

/* Palmquist 8/2/21 add width so it doesn't overlap with photo */
body.subsec-palmquist h1#headline {
    width: 24.5rem;
}

/* Change header on Johnston pages */
body.subsec-palmquist #header {
	background: #000 url(img/palmquist-banner.jpg) left 50% no-repeat;
}

/* on the home page */
/*
body#page-1 #header,
body#page-316 #header {
	background: url(img/bg-header-home.jpg) left top no-repeat;
	height: 187px;
}
*/
/* remove header from test pages */
body#page-1 #header,
body#page-316 #header,
body#page-524 #header {
    display: none;
}

h1#headline {
	clear: both;
	color: #FFF;
	font-size: 1.4em;
	line-height: 120%;
	text-transform: uppercase;
	padding: 0.8em 0 0.8em 36px;
	letter-spacing: 0.15em;
	font-weight: bold;
}

body.sec-wmh h1#headline {
	/*
	-moz-box-shadow: 3px 3px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: 3px 3px 3px rgba(0,0,0,0.5);
	box-shadow: 3px 3px 3px rgba(0,0,0,0.5);
	*/
	-moz-text-shadow: 1px 1px 3px rgba(0,0,0,1);
	-webkit-text-shadow: 1px 1px 3px rgba(0,0,0,1);
	text-shadow: 1px 1px 3px rgba(0,0,0,1);
}

#main {
	clear: both;
	margin: 0 auto;
	position: relative;
	overflow: hidden;
	width: 750px;
	background-color: #DDD6C5;
}

#page-1 #main,
#page-316 #main {
	background-color: #000;
}

/* ---------------------------------------------------------------------------
	BEGIN navigation
--------------------------------------------------------------------------- */

#nav {
	position: relative;
	left: 50%;
	float: left;
}

#nav > nav > ul {
	position: relative;
	right: 50%;
}

#nav > nav > ul > li {
	float: left;
	/* padding-right: 3px;
	padding-bottom: 5px; */
}

#nav a {
	float: left;
	display: block;
	font-weight: bold;
	padding: 4px 8px;
	text-decoration: none;
	color: #D6CEB9;
	white-space: nowrap;
	border: 3px solid transparent;
}

#nav a:hover {
	background-color: #3A3424;
	background-color: #000;
	background-color: transparent;
	color: #FFF;
}


#nav a.nav-act,
#nav a.nav-act:hover { /* for IE6/Win */
	background-color: #2B271B;
	background-color: #9D8D64;
	background-color: #3A3424;
	background-color: #9D8D64;
	background-color: #8B383D;
	color: #FFF;
}

#nav li.nav-last {
	padding-right: 0;
}
/* was for donation button */
/*
#nav li.nav-last a {
	border: 3px solid rgba(255,255,255,0.2);
}
*/


/* Breadcrumb nav */

#navcrumbs {
	float: left;
	width: 750px;
}

#page-1 #navcrumbs,
#page-316 #navcrumbs {
	display: none;
}
#page-1 #headline,
#page-316 #headline {
	display: none;
}

#navcrumbs ul {
	float: left;
}

#navcrumbs li {
	float: left;
}

#navcrumbs a {
	border-bottom: 0;
	float: left;
	display: block;
	position: relative;
	text-decoration: none;
	color: #D6CEB9;
	white-space: nowrap;
	background: url(img/bg-navcrumbs.gif) right 50% no-repeat;
}

#navcrumbs a span {
	display: block;
	padding: 0.3em 0 0.3em 23px;
	position: relative;
	left: -15px;
	background: url(img/bg-navcrumbs-left.gif) left 50% no-repeat;
}

#navcrumbs a:hover {
	color: #FFF;
	background: url(img/bg-navcrumbs-hover.gif) right 50% no-repeat;
}

#navcrumbs a:hover span {
	color: #FFF;
	background: url(img/bg-navcrumbs-left-hover.gif) left 50% no-repeat;
}

#navcrumbs li.nav-first a, 
#navcrumbs li.nav-firstlast a {
	padding-left: 27px;
}


/* Page nav */

#navpage {
	clear: both;
	float: left;
	width: 650px;
}

#navpage ul {
	float: left;
}

#navpagebot {
	clear: both;
	float: left;
	width: 700px;
	margin-top: 0;
	background-color: #A8B1C8;
    margin-bottom: 24px;
    font-size: 1rem;
}

#navpagebot a {
    font-weight: bold;
}

#navpagebot ul {
	float: right;
	background-color: #DDD6C5;
	padding-right: 30px;
}

#navpage li,
#navpagebot li {
	float: left;
}

#navpage a,
#navpagebot a {
	border-bottom: 0;
	float: left;
	display: block;
	position: relative;
	padding: 0.3em 10px;
	text-decoration: none;
	color: #493880;
	white-space: nowrap;
	background: url(img/bg-navpage.gif) left 50% no-repeat;
	border-right: 1px solid #DDD6C5;
}

#navpage a:hover,
#navpagebot a:hover {
	color: #493880;
	background: url(img/bg-navpage-hover.gif) left 50% no-repeat;
}

#navpage li.nav-first a {
	padding-left: 36px;
}

#navpage li.nav-last a,
#navpagebot li.nav-last a {
	border-right: 0;
	background: url(img/bg-navpage.gif) right 50% no-repeat;
	padding-right: 1em;
	padding: 0.3em 15px 0.3em 10px;
}

#navpagebot li.nav-last a {
    padding-right: 20px;
}

#navpage li.nav-last a:hover,
#navpagebot li.nav-last a:hover {
	color: #493880;
	background: url(img/bg-navpage-hover.gif) right 50% no-repeat;
}

 
/* ---------------------------------------------------------------------------
	BEGIN main content formatting
--------------------------------------------------------------------------- */

#headline, #nav, #navcrumbs, #navpage, #navpagebot, #footer {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-family: Arial, Helvetica, sans-serif;
}


#content {
	width: 678px;
	padding: 18px 36px;
    overflow: hidden;
}

#page-1 #content,
#page-316 #content {
	width: 750px;
	padding: 18px 0;
}

#content h1 {
	margin: 0 0 0.5em 0;
	font-size: 1.8em;
	line-height: 120%;
	font-weight: normal;
	color: #574E37;
}

#page-1 #content h1,
#page-316 #content h1 {
	font-size: 2em;
	color: #9D8D64;
}

#content h2 {
	margin: 0 0 0.5em 0;
	font-size: 1.3em;
	line-height: 120%;
	font-weight: normal;
	border-bottom: 1px solid #9D8D64;
}

#page-1 #content h2,
#page-316 #content h2 {
	clear: both;
	text-transform: uppercase;
	font-family: Arial, Helvetica, sans-serif;
	margin: 1.6em 0 1em 0;
	font-size: 1.2em;
	color: #FFF;
	color: #D6CEB9;
	padding: 0.2em 0.4em;
	border-bottom: none;
}

#page-1 h2,
#page-316 h2 {
	background-color: #374857;
}

/* featured */
#page-1 #content #c1046 h2,
#page-316 #content #c1046 h2 {
	background-color: #5F2629;
	background-color: #572A25;
}

/* ---------- captions start ------------- */


/* see TS for imageWrap that inserts this */
#content .image-caption {
	font-family: Arial, Helvetica, sans-serif;
	line-height: 150%;
    /* display: block; */ /* it's a table now */
/*	border-top: 1px solid #9D8D64;
	border-bottom: 1px solid #9D8D64; */
	color: #000;
	padding: 0.5em 0.7em; 
	border: 1px solid #BDB194;
	border-top: none;
}

/* ---------- end captions ------------- */



#content .csc-frame-rulerBefore {
	clear: both;
	border-top: 1px dashed #9D8D64;
	padding-top: 1em;
}

#content .csc-frame-frame1 {
	border-top: 1px dashed #9D8D64;
	padding: 1em 0 0 0;
	border-bottom: 1px dashed #9D8D64;
	margin: 1em 0 1em 0;
}


/* #content .csc-frame-rulerBefore */

#content h3 {
	margin-top: 1em;
	line-height: 160%;
	font-weight: bold;
	color: #000;
}

#content h4 {
	margin-top: 1em;
	line-height: 160%;
	font-weight: bold;
	font-style: italic;
	color: #574E37;
}

#content p {
	margin: 0 0 1em 0;
	line-height: 160%;
	font-size: 1.2em;
}

#content blockquote {
	float: right;
	width: 170px;
	color: #574E37;
	border-top: 1px solid #9D8D64;
	border-bottom: 1px solid #9D8D64;
	margin: 0 0 1em 1em;
	padding: 0.5em 0;
	font-style: italic;
	font-weight: bold;
	line-height: 160%;
}

#content ul {
	list-style-type: square;
	padding-left: 18px;

}

#content ol {
	list-style-type: decimal;
	padding-left: 18px;
}

#content ul li, #content ol li {
	line-height: 160%;
	margin-bottom: 1em;
}


/* ---------------------------------------------------------------------------
	BEGIN footer block
--------------------------------------------------------------------------- */

#footer {
	clear: both;
	margin: 0 auto;
	float: none;
	width: 960px;
	color: #D6CEB9;
	padding-bottom: 20px;
}

#wrap-footer {
	width: 100%;
	clear: both;
	width: 100%;
	background-color: #3A3424;
	border-top: 3px solid #9D8D64;
	overflow: hidden;
}

/* FOOTER NAVIGATION */

#navfoot {
	padding: 10px 0 15px 0;
	position: relative;
	float: left;
	left: 50%;
}

#navfoot ul {
	position: relative;
	right: 50%;
	text-align: center;
}

#navfoot li {
	float: left;
}

#navfoot a {
	border-bottom: 0;
	float: left;
	display: block;
	text-decoration: none;
	padding: 0.3em 0.7em;
	color: #D6CEB9;
	white-space: nowrap;
	border-right: 1px solid #9D8D64;
	border-bottom: none !important;
}

#navfoot a:hover {
	background-color: #2B271B;
	color: #FFF;
}

#navfoot a.nav-act,
#navfoot a.nav-act:hover { /* for IE6/Win */
	background-color: #000;
	color: #FFF;
}

#navfoot li.nav-last a {
	border-right: 0;
}

/* FOOTER TEXT */

#footer-text {
	clear: both;
	padding: 0;
}

#footer-text p {
	line-height: 140%;
	text-align: center;
}

#footer-text a {
	color: #D6CEB9;
	border-bottom: none;
	/* border-bottom: 1px solid #78715F; */
}


#footer-text a:visited {
	border-bottom: 1px dashed #78715F;
}

#footer-text a:hover {
	color: #FFF;
	background-color: #2B271B;
}





/* better list styles */


#content ul {
	margin-left: 0;
	padding-left: 2em;
	margin: 1.2em 0;

}

#content ol {
	list-style-type: decimal;
	margin-left: 0;
	padding-left: 2em;
	margin: 1.2em 0;
}

#content ul li, #content ol li {
	padding-left: 0;
	margin: 0;
/*	list-style-type: none;
	background: url(bg-li.png) left 0.7em no-repeat; */

}

#content ol li {
	list-style-type: decimal;
	background: none;
}

/* addthis */
.ep-addthis-wrap {
	width: 440px;
	overflow: visible;
	margin: 1.2em auto;
}
.ep-addthis {
	padding-top: 1px;
	padding-left: 1px;
	background-color: #391719;
	border: 1px solid #745A4A;
	overflow: hidden;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}

.ep-addthis a {
	font-family:Arial, Helvetica, sans-serif;
	color: #C1686C;
	color: #CAB185 !important;
	text-decoration: none;
	display: block;
	float: left;
	padding: 4px !important;
	line-height: 120% !important;
	border-bottom: none !important;
}

.ep-addthis a.ep-addthis-text {
}

.ep-addthis a:hover,
.ep-addthis a:active {
	color: #FFF;
}

.ep-addthis .ep-addthis-gplusone {
	float: left;
	padding-top: 2px;
	padding-left: 6px;
}

.ep-addthis-buttons {
	padding-top: 2px;
	padding-right: 3px;
	float: right;
}

.ep-addthis-fb {
	float: left;
}
.ep-addthis-fb a iframe {
	height: 22px !important;
}

.frame-type-div {
	clear: both;
	overflow: hidden;
	border-top: 3px solid #374857;
	padding: 0;
	margin: 1.2em 0;
	position: relative;
}

.frame-type-div hr.ce-div {
  display: none;
}


/* fix for CSC no longer supporting removal of clearer for successive images in CSC 7.6. default overflow: hidden */
div.csc-textpic.csc-textpic-intext-left,
div.csc-textpic.csc-textpic-intext-right {
    overflow: inherit;
}

div.csc-textpic-imagecolumn, td.csc-textpic-imagecolumn .csc-textpic-image {
    margin-bottom: 12px;
}

#c293 {
    clear: both;
}

/* uploads / file links content element */
div.frame-type-uploads {
    clear: both;
}

.ce-uploads {
    margin: 0 0 1rem 0 !important;
    padding: 0 !important;
}

.ce-uploads li {
    overflow: hidden;
    margin-bottom: 1rem !important;
    display: block;
}

.ce-uploads li img {
    margin-right: 0.6rem;
}

.ce-uploads div a {
    text-decoration: underline;
}

/* about clio blurb at bottom of home page */
#c589 {
    padding: 1rem;
    margin: 1rem 0;
    background-color: #572A25;
}

#c589 p {
    margin: 0;
}

/* Palmquist gallery and default on home page */
/*
#page-1 #content h1,
#page-1 h3,
#page-1 h1 a,
#page-1 h3 a,
#page-316 #content h1,
#page-316 h3,
#page-316 h1 a,
#page-316 h3 a {
	color: #9D8D64;
    color: #c4b07e;
    font-weight: normal;
    text-decoration: none;
    border-bottom: none;
}


#page-1 h1 a:hover,
#page-1 h3 a:hover,
#page-316 h1 a:hover,
#page-316 h3 a:hover {
	color: #9D8D64;
    color: #c4b07e;
    background-color: transparent;
}
*/

/* vvfw only */

#c4193 h1 a:hover,
#c4193 h3 a:hover {
    color: #ffcc00;
    color: #e9a41c;
    background-color: transparent;
}

#c4193 h1 {
    margin-bottom: 0;
}

#c4193 h1 a {
    color: #ffcc00;
    color: #e9a41c;
}

#c4193 h3 {
    font-weight: normal;
    margin-top: -.7rem;
    font-size: 1.4rem;
    line-height: 1.2;
    margin-top: 0 !important;
    margin-bottom: 1rem !important;
}

#c4193 h3 a {
    color: #ffcc00;
    color: #e9a41c;
}

/* headers on home page for 2019-06-20 interim design changes */
#page-1 #content h2,
#page-316 #content h2 {
    text-align: center;
    text-transform: uppercase;
    background-color: #3A3424;
    font-size: 1.4rem;
    padding: .6rem;
}

#c1264 h2 {
    margin-top: 1em !important;
}

.text-center {
    text-align: center;
}

/* LT */
#c1265 h1 a,
#c1265 h1 a:hover {
    color: #C1686C;
}

/* PTP */
#c566 h1 a,
#c566 h1 a:hover {
    color: #c2423c;
    color: #95aead;
}

/* Quilts */
#c208 h1 a,
#c208 h1 a:hover {
    color: #939d4c;
}

#page-1 h4,
#page-316 h4 {
    color: #D6CEB9;
    font-weight: bold;
    font-style: normal;
    margin: 0.5rem 0 0 0;
    font-family: sans-serif;
    font-size: 1rem;
}

/* button like bootstrap */

a.btn {
    border: 0;
    border-bottom: none !important;
    border-right: none;
    background-color: #453757;
    background-color: #8B383D;
    padding: 0.6em 1.2em;
    margin: 0.8em 0;
    margin-left: 5em;
    margin-left: 0;
    border-radius: 3px;
    border-radius: 0;
    line-height: 1;
    width: auto;
    color: #FFF !important;
    font-family: sans-serif;
    text-decoration: none;
    vertical-align: middle;
    display: inline-block;
    transition: background-color 0.2s ease;
}

a.btn:hover {
    background-color: #AB454B !important;
    color: #FFF;
}

/*
#page-1 h3,
#page-316 h3 {
    font-weight: normal;
    font-size: 1.4rem;
    line-height: 1.2;
    margin-bottom: 0;
    margin-top: 0;
}
*/

/* photo galleries */

/* fbj */
#c4199 h1,
#c4199 h1 a,
#c4199 h1 a:hover {
    color: #ae9ab0;
}

/* allen sisters */
#c4200 h1,
#c4200 h1 a,
#c4200 h1 a:hover {
    color: #9fb099; 
}

/* palmquist galleries */
/* intro */
#c4201 {
    margin-bottom: 2rem !important;
}

/* withington */
#c4202 {
    width: 330px;
    float: left !important;
    clear: both;
    overflow: hidden;
    margin-bottom: 2rem;
}

#c4202 img {
    width: 330px;
    height: auto;
}

/* cardozo */
#c4203 {
    width: 330px;
    float: right !important;
    clear: none;
    overflow: hidden;
}
#c4203 img {
    width: 330px;
    height: auto;
}

/* oconnor */
#c4204 {
    width: 330px;
    float: left !important;
    overflow: hidden;
    clear: both;
}

/* tichenor */
#c4205 {
    width: 330px;
    float: right !important;
    clear: none;
    overflow: hidden;
}
#c4205::after {
    display: block;
    content: "";
    clear: both;
    margin-bottom: 2rem;
}

/* h3 on Palmquist overview page */
#page-70 h3,
#page-70 h3 a,
#page-70 h3 a:hover {
    font-weight: bold;
    color: #574E37;
    font-size: 1rem;
    border-bottom: 0;
    background-color: transparent;
}


#page-70 .csc-textpic-image {
    margin-bottom: 0;
}

/* CE after Palmquist images on Palmquist overview page. */
#c135 {
    clear: both;
    width: 100%;
}

/* call to action at bottom of home page */
#c589 {
    clear: both;
    width: 100%;
}

/* FBJ Johnson exhibit */
/* intro */
#c4218 {
    box-sizing: border-box;
    margin: 1rem 0;
    padding: 1rem 1.2rem;
    background-color: #574E37;
    color: #DDD6C5;
}

#c4218 p {
    margin: 0;
}

.btn-basic {
	border: 0;
	border-bottom: 1px solid #333;
	border-right: 1px solid #333;
	background-color: #453757;
	padding: 0.6em 1.2em;
	margin: 0.8em 0;
	margin-left: 5em;
	margin-left: 0;
	border-radius: 3px;
	line-height: 1;
	width: auto;
	color: #FFF;
	font-family: sans-serif;
	text-decoration: none;
	vertical-align: middle;
	display: inline-block;
	transition: background-color 0.2s ease;
}

.btn-basic:hover {
	background-color: #665281 !important;
	color: #FFF;
}

.csc-sitemap li a {
    font-weight: bold;
}

.csc-sitemap li li a {
    font-weight: normal;
}



/* 2019 dropdown navigation (pre-bootstrap version). */
#wrap-logo {
    margin-bottom: -5px;
}

#nav nav ul, #nav nav li {
    margin: 0;
    padding: 0;
}
#nav nav ul ul li {
    list-style-type: none;
    display: block !important;
}

#nav nav {
    font-size: .9rem;
}

#nav nav a {
    line-height: 1;
    font-size: .9rem;
    padding: 0.8rem 1rem;
    border: 0;
}

#nav nav ul ul li a {
    display: block;
    float: none;
    line-height: 1.2;
}

#nav nav ul ul {
    position: absolute;
    background: #572A25;
    top: 2.5rem;
    /* padding-bottom: .5rem; */
    width: 18rem;
    border-top: 3px solid #9D8D64;
}

#nav nav ul ul li {
    border-bottom: 1px solid #9D8D64;
    border-bottom: 1px solid #857855;
    float: none;
}

#nav nav ul ul li:last-child {
    border-bottom: none;
}

#nav nav ul ul a {
    font-weight: normal;
    white-space: normal;
}

#nav nav ul ul a:hover,
#nav nav ul ul a:focus {
    background-color: #4F2722;
}

#nav .dropdown-toggle {
    white-space: normal;
}

#nav .dropdown-toggle::after {
    display: inline-block;
    margin-left: 0.355em;
    vertical-align: 0.255em;
    content: "";
    border-top: 0.3em solid #9D8D64;
    border-right: 0.3em solid transparent;
    border-bottom: 0;
    border-left: 0.3em solid transparent;
}

#nav .dropdown-toggle:empty::after {
    margin-left: 0;
}

#nav .submenu {
    left: -1000rem;
}
/*
.drop .submenu.hover:focus-within,
.drop:focus .submenu.hover,
.drop:hover .submenu.hover,
.drop:active .submenu.hover,
*/
#nav .drop .submenu.hover {
    left: initial;
    display: block !important;
}

#wrap-top {
    position: relative;
    z-index: 101;
    overflow: visible;
}

#wrap-top::after {
    content: "";
    display: block;
    clear: both;
}

/* don't show home button on the home page */
#page-1 #clionav .navbar-nav > li:first-child,
#page-316 #clionav .navbar-nav > li:first-child {
    display: none;
}

/* for multi-CE intext floating like on home page */
.ce-textpic.ce-right.ce-intext {
    float: right;
}

.ce-column {
    margin-bottom: 12px;
}

/* QUILTS: See quilts.css */

/* content changes for v9.5 */

.sec-visualizing .frame-default,
.sec-exhibits .frame-default,
.sec-about .frame-default {
    clear: both;
    width: 100%;
}

.sec-visualizing .frame-default::after,
.sec-exhibits .frame-default::after,
.sec-about .frame-default::after {
    display: block;
    clear: both;
    content: "";
}

/* facebook feed on /about page */
#c1268 {
    float: right;
    width: 48%;
    clear: none;
}
/* menu next to facebook feed */
#c22 {
    float: left;
    width: 48%;
    clear: none;
}

/* clio intro video added 12/21/21 */

.fadein {
    animation: fadein .5s linear;
    opacity: 1 !important;
    z-index: 7;
}

.fadeout {
    animation: fadeout .5s linear;
    opacity: 0 !important;
    z-index: 6;
}

@keyframes fadein {
    from { opacity: 0 }
    to { opacity: 1 }
}

@keyframes fadeout {
    from { opacity: 1 }
    to { opacity: 0 }
}

#intro-video {
    width: 100%;
    display: grid;
    height: calc(100vh - 17rem); /* iphone mini has very limited vertical space */
    height: calc(100vh - 10rem);
    max-height: 60rem;
    min-height: 8rem;
    background: #6C6057 url(intro-cover.jpg) no-repeat center / cover;
}

#intro-video .wistia_embed {
    width: 100%;
    height: auto;
    grid-row: 1;
    grid-column: 1;
    z-index: 5;
    overflow: hidden;
}

#intro-title {
    grid-row: 1;
    grid-column: 1;
    height: fit-content;
    display: grid;
    color: #fff;
    padding: 1rem;
    text-transform: uppercase;
    font-family: "Nunito Sans", sans-serif;
    font-weight: bold;  
    font-size: 1.6rem;
    text-align: center;
    text-shadow: 0 0 0.625rem #382A1F;
}

@media (min-width: 32em) {
    #intro-title {
        font-size: 1.8rem;
        padding: 2rem 1rem 1rem;
    }

    #intro-title1 .firstline {
        padding-right: 1.15em;
    }

    #intro-title1 .secondline {
        padding-left: 1.15em;
    }

    #intro-title2 .firstline {
        padding-right: 2.2em;
    }

    #intro-title2 .secondline {
        padding-left: 2.2em;
    }
}

@media (min-width: 48em) {
    #intro-title {
        font-size: 2.4rem;
    }
}

#intro-title > span {
    opacity: 0;
    grid-row: 1;
    grid-column: 1;    
}

#intro-title small {
    font-size: .618em;
    font-weight: normal;
}

#intro-title span {
    display: block;
}

#intro-captions {
    display: grid;
    padding-left: 0;
    list-style: none;
    background-color: #6C6057;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 1rem;
}

#intro-captions li {
    grid-row: 1;
    grid-column: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 1rem;
    opacity: 0;
    color: #fff;
    transition: background-color .5s linear;
    text-align: center;
}

#intro-captions li > span {
    height: fit-content;
}

#intro-captions span span {
    margin: 1rem 0.6em 0;
    display: inline-block;
}

#intro-captions .btn {
    padding: 0.6em 1.2em;
    margin: 0 0.6em;
    vertical-align: inherit;
    margin: 1rem 0;
    border: 1px solid #fff !important;
    color: #fff;
    background-color: transparent;
    transition: border-color .2s ease, background-color .2s ease;
}

#intro-captions .btn:hover,
#intro-captions .btn:active,
#intro-captions .btn:focus {
    background-color: #222 !important;
    border-color: #222 !important;
}

#intro-captions a {
    color: #fff;
    border-color: #fff;
    border-width: .0625rem;
}

#intro-caption-kids {
    background-color: #626262;
}

#intro-caption-ballotbox {
    background-color: #834731;
}

#intro-caption-baker {
    background-color: #6C5F4D;
}

#intro-caption-trolley {
    background-color: #62615e;
}

#intro-caption-quilt {
    background-color: #924F49;
}

#intro-caption-puritans {
    background-color: #626356;
}

#intro-caption-pies {
    background-color: #666060;
}

#intro-caption-huerta {
    background-color: #982520;
}

#intro-caption-missamerica {
    background-color: #346880;
}
    
#intro-caption-lawrence {
    background-color: #974A3E;
}

/*
#page-1 #wrap-header {
    display: none;
}
*/

/* end video css */

/* new home page content */

#page-1 #clionav,
#page-524 #clionav {
    background-color: #952F2D !important;
    border-color: #817368 !important;
}


.clio22 {
    background: #fff;
    font-family: 'Nunito Sans', sans-serif !important;
    overflow: hidden;
    font-size: 1.1875rem;
}

.clio22 *,
.clio22 ::after,
.clio22 ::before {
    box-sizing: border-box;
}

.clio22 .container-fluid {
    max-width: 80rem;
}

.clio22 h2 {
    font-weight: bold;
    text-transform: uppercase;
    font-size: 1.8rem;
    margin: 3rem 0 1rem;
    line-height: 1.2;
    background-color: transparent !important;
}

@media (min-width: 576px) {
    .clio22 h2 {
        font-size: 2.125rem;
    }
}

.clio22 h2.header-history {color: #63558A !important}
.clio22 h2.header-upcoming {color: #AB3721 !important}
.clio22 h2.header-photography { color: #4E4E4E !important}

.clio22 h3 {
    font-weight: bold;
    font-size: 1.3rem;
    line-height: 1.2;
    margin: 0 0 1rem;
}

.clio22 p {
    font-size: 1rem;
    line-height: 1.4;
    margin: 0 0 1.2rem;
}

.clio22 p:last-child {
    margin-bottom: 0;
}

.cliocard a:hover {
    background-color: transparent;
}

.clio22 a.photo-link {
    display: block;
    font-weight:bold;
    text-align: center;
    padding: .6rem .6rem 0;
    border: .0625rem solid rgba(149,47,45,.5) !important;
    transition: color .2s ease, background-color .2s ease, border-color .2s ease;
    max-width: 18.7rem;
    margin-left: auto;
    margin-right: auto;
}

.clio22 a.photo-link img {
    width: 100%;
    height: auto;
}

.clio22 a.photo-link:hover,
.clio22 a.photo-link:focus {
    background-color:#952F2D !important;
    border-color:#952F2D !important;
    color: #fff !important;
    text-decoration: none;
}

.clio22 a.photo-link span {
    display: inline-block;
    padding: 1rem;
    line-height: 1.2;
    font-size: 1rem;
}

.clio22 a.btn {
    border-width: .0625rem !important;
    border-style: solid !important;
    background-color: transparent;
    font-weight:bold;
    font-family: 'Nunito Sans', sans-serif !important;
    font-size: 1rem;
    margin: 0;
    transition: color .2s ease, background-color .2s ease, border-color .2s ease;
}

.clio22 a.btn:hover,
.clio22 a.btn:focus {
    color: #fff !important;
}

.clio22 a {
    border-bottom: none;
}

.clio22.footer22 {
    background-color: #817368;
    color: #fff;
}

.clio22.footer22 p,
.clio22.footer22 hr {
    max-width: 60rem;
    margin-left: auto !important;
    margin-right: auto !important;
}

.clio22.footer22 p.footer-cta {
    margin-bottom: 3rem;
}

.clio22.footer22 p:last-child {
    margin-bottom: 4rem;
}

.clio22.footer22 a {
    color: #fff;
    border-bottom: none;
}

.clio22.footer22 a:hover {
    background-color: transparent;
    border-bottom: none;
    text-decoration: underline;
}

.clio22.footer22 a.btn {border-color: rgba(255,255,255,.5) !important}
.clio22.footer22 a.btn:hover,
.clio22.footer22 a.btn:focus {text-decoration: none !important; background-color:#952F2D !important;border-color:#952F2D !important}

.clio22.footer22 .nav {
    margin-bottom: 1.2rem;
}

.clio22.footer22 .nav a {
    font-weight: bold;
}

.clio22.footer22 hr {
    border-top: .1875rem solid rgba(255,255,255,.5);
    margin: 1.2rem 0;
}

.clio22.footer22 .small {
    font-size: 80% !important;
    font-weight: normal !important;
}

.cliocard {
    background-color: #ECECEC;
   /* darker for iOS remote testing */
   /* background-color: #DDDDDD; */
    overflow: hidden;
    position: relative;
    margin-bottom: 3rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
/*    min-height: 25rem; */
}

.cliocard > * {
    padding-left: 0;
    padding-right: 0;
}

.cliocard .cliocard-media {
    overflow: hidden;
    position: relative;
/*    max-height: 25rem; */
    display: flex;
    justify-content: center;
}

.cliocard img {
    display: block;
    object-fit: cover;
    object-position: center center;
    height: 100%;
    /* width: 100%; */
}

/* smallest */
@media (max-width: 575.98px) {
    .cliocard img {
        width: 100%;
        bottom: 0;
    }
}

.cliocard .cliocard-img-left {
    object-position: left;
}

.cliocard .cliocard-img-right {
    object-position: right;
}

/* above this, we go horizontal */
@media (max-width: 767.98px) {
    .cliocard .cliocard-media {
        /* min-height: 10rem;
        max-height: 18rem; */
    }

    .cliocard .cliocard-media .cliocard-figure img {
        min-height: unset;
    }
}

.cliocard .cliocard-text {
    padding: 1rem;
}

.clio22 .photo-links {
    padding: 0 1rem;
}

.clio22 .photo-link {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

@media (min-width: 576px) {
    .clio22 h3 {
        font-size: 1.5rem;
    }

    .clio22 a.btn,
    .clio22 a.photo-link span,
    .clio22 p {
        font-size: 1.1875rem;
    }

    .cliocard .cliocard-text {
        padding: 2rem;
    }

    .clio22 .photo-links {
        padding: 0 2rem;
    }

    .clio22 .photo-link {
        margin-top: 0;
        margin-bottom: 2rem;
    }
}

.cliocard figure {
    margin-bottom: 0;
}

.cliocard .cliocard-figure {
    display: flex;
    height: 100%;
    padding: 0;
    width: 100%;
    margin: 0;
}

.cliocard .cliocard-media a {
    display: flex;
}

.cliocard .cliocard-figure img {
    align-self: center;
    flex-basis: 0;
    flex-grow: 1;
    flex-shrink: 0;
    height: auto;
    max-width: 100%;
    min-height: 25rem;
    opacity: 1;
    position: relative;
    width: 100%;
}

@media (min-width: 992px) {
    .clio22 h3 {
        font-size: 1.875rem;
    }

    .cliocard .cliocard-text {
        padding: 3rem;
    }

    .cliocard .cliocard-figure {
        align-self: flex-end;
        justify-content: flex-end;
        max-height: none;
        text-align: inherit;
    }

    .cliocard .cliocard-figure img {
        height: 100%;
        width: 100%;
    }

    .clio22 .photo-links {
        padding: 0 3rem;
    }

    .clio22 .photo-link {
        margin-bottom: 3rem;
    }

}

/* Ken Burns effect on image links */
.cliocard a.img-zoom img {
    display: block;
    overflow: hidden;
    transition: transform .15s ease-out;
}

.cliocard a.img-zoom:hover img,
.cliocard a.img-zoom:focus img {
    transform: scale(1.05);
}

@media (prefers-reduced-motion) {
    .cliocard a.img-zoom:hover img,
    .cliocard a.img-zoom:focus img {
        transform: unset;
    }
}


.cliocard.votes h3 {color:#63558A}
.cliocard.votes a {color:#63558A !important}
.cliocard.votes a.btn {border-color: rgba(99,85,138,.5) !important}
.cliocard.votes a.btn:hover,
.cliocard.votes a.btn:focus {background-color:#63558A !important;border-color:#63558A !important}

.cliocard.click h3 {color:#355FB5}
.cliocard.click a {color:#355FB5 !important}
.cliocard.click a.btn {border-color: rgba(53,95,181,.5) !important}
.cliocard.click a.btn:hover,
.cliocard.click a.btn:focus {background-color:#355FB5 !important;border-color:#355FB5 !important}

.cliocard.tel h3 {color:#9F843F}
.cliocard.tel a {color:#9F843F !important}
.cliocard.tel a.btn {border-color: rgba(159,132,63,.5) !important}
.cliocard.tel a.btn:hover,
.cliocard.tel a.btn:focus {background-color:#9F843F !important;border-color:#9F843F !important}

.cliocard.ptp h3 {color:#952F2D}
/* used as link and button colors for all other buttons */
.cliocard a {color:#952F2D !important}
.cliocard a.btn {border-color: rgba(149,47,45,.5) !important}
.cliocard a.btn:hover,
.cliocard a.btn:focus {background-color:#952F2D !important;border-color:#952F2D !important}

.cliocard.quilts h3 {color:#7A8F39}
.cliocard.quilts a {color:#7A8F39 !important}
.cliocard.quilts a.btn {border-color: rgba(122,143,57,.5) !important}
.cliocard.quilts a.btn:hover,
.cliocard.quilts a.btn:focus {background-color:#7A8F39 !important;border-color:#7A8F39 !important}

.cliocard.native h3 {color:#AB3721}
.cliocard.native a {color:#AB3721 !important}
.cliocard.native a.btn {border-color: rgba(171,55,33,.5) !important}
.cliocard.native a.btn:hover,
.cliocard.native a.btn:focus {background-color:#AB3721 !important;border-color:#AB3721 !important}

.cliocard.fbj h3 {color:#4E4E4E}
.cliocard.allen h3 {color:#5A524E}
.cliocard.palmquist h3 {color:#292929}