/*
Theme Name: MediaBurn
Theme URI: https://mediaburn.org/
Author: Kurtis Schneider
Author URI: http://example.com
Description: A custom theme for MediaBurn.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: custom-theme, responsive, blog
Text Domain: mediaburn
*/

/* Add your custom styles below this line */


.layout-grid .pause-icon {
    top: 5px;
    left: 5px;
    display: none;
}

.layout-grid .list-icon svg, .layout-grid .pause-icon svg {
    fill: #ffffff;
    width: 16px;
    height: 16px;
}
.play-pause-icon {
    position: absolute;
    position: top;
    z-index: 100;
}


:root {
	--color-gray-1: #333333;
	--color-gray-2: #757575;
	--color-gray-3: #aaaaaa;
	--color-gray-4: #cccccc;
	--color-gray-5: #eeeeee;
	--color-orange: #e06910;
	/*e06910 E26100 #F75E1B */
	
	--font-tech: 'Chakra Petch', sans-serif;
	
	--header-height: 80px;
	--header-spacing: 50px;
	--section-spacing: 40px;
	--center-spacing: 80px; 
	--grid-spacing: 30px;
	--bottom-spacing: 100px;
	--hero-height: 77vh;
	--fade-speed: 200ms;
	--fade-opacity: 0.6;
	--base-margin: 50px;
	--base-sticky: calc(var(--header-height) + var(--header-spacing));	/* header height + element margin */
	--base-border: 1px dotted rgba(0,0,0,1);
	--base-font-size: 16px;
	--base-corner-radius: 0px;
}
@media (max-width: 1080px) {
	:root {
		--base-margin: 35px;
		--section-spacing: 40px;
		--header-spacing: 40px;
		--hero-height: 70vh;
	}
}
@media (max-width: 710px) {
	:root {
		--header-spacing: 35px;
		--section-spacing: 35px;
		--base-margin: 25px;
		--grid-spacing: 20px;
	}
}
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
html, body {
	position: relative;
	margin: 0;
	padding: 0;
	width: 100%;
	/*height: 100%;
	background: #ffffff;*/
	font-family: var(--font-tech);
	font-size: var(--base-font-size);
	line-height: 1.45;
	letter-spacing: 0.01em;
	color: var(--color-gray-1);
	font-weight: 400;
	word-break: break-word;
	
	border: none;
	
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: none;
	-webkit-overflow-scrolling: touch;
	-webkit-appearance: none;
	-moz-appearance: none;
    appearance: none; 
}
body {
	overflow-x: hidden;
	overflow-y: scroll;
}
h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-tech);
	margin: 0;
	padding: 0;
	color: #000000;
	font-weight: 600;
}
h1 {
	font-size: 48px;
	/*margin-bottom: 30px;*/
	line-height: 1.1;
	margin: 0;
}
h2 {
	font-size: 26px;
	margin-bottom: 30px;
	line-height: 1.2;
}
h3 {
	font-size: 21px;
	line-height: 1.25;
	margin-bottom: 30px;
}
h4 {
	font-size: 18px;
    margin-bottom: 10px;
    line-height: 1.35;
}
h5 {
	font-size: 16px;
    margin-bottom: 5px;
}
a, a:visited, a:active {
    color: inherit;
	text-decoration: underline;
}
a:hover:not(:has(*)), a:visited:hover:not(:has(*)), 
a:hover:not(:has(*:hover)), a:visited:hover:not(:has(*:hover)) 
 {
    color: var(--color-orange);
}


#newsBlog-post-container a:hover > .text-holder > .title,
#exhibitions-holder a:hover > .text-holder > .title,
#other-holder a:hover > .text-holder > .title {   
    color: var(--color-orange);
}
#newsBlog-post-container a:hover > .text-holder > .sub-text,
#exhibitions-holder a:hover > .text-holder > .sub-text,
#other-holder a:hover > .text-holder > .sub-text {   
    color: rgb(115, 115, 115);
}

#newsBlog-post-container a:hover > .text-holder > p,
#exhibitions-holder a:hover > .text-holder > p,
#other-holder a:hover > .text-holder > p {   
    color: rgb(51, 51, 51);
}

/*
.grid-list #newsBlog-post-container a:hover > .text-holder > :not(.title),
.grid-list #newsBlog-post-container a:hover > .text-holder > :not(.sub-text) {
	color: initial;
}

.grid-list #newsBlog-post-container a:hover > .text-holder > .title {
	 color: var(--color-orange);
}
*/

a[href^=tel]{
    color:inherit;
    text-decoration:none;
}
a img {
  border: none;
}
ul {
    margin-left: 25px;
    margin-bottom: 30px;
}
ol {
    margin-left: 25px;
    margin-bottom: 30px;
}
ul li {
    list-style: outside disc;
    padding: 2px 7px;
}
ol li {
    list-style: outside decimal;
    padding: 2px 7px;
}
img {
	display: block;
	border: 0;
	margin: 0;
	padding: 0;
	width: 100%;
	height: auto;
}
iframe, video {
	/*clip-path: inset(0 1px 1px 0);*/
	width: 100%;
	height: auto;
	display: block;
	aspect-ratio: 4/3;
}
figure {
	margin-bottom: calc(var(--section-spacing));
	margin-top: calc(var(--section-spacing));
}
.wp-caption, .wp-element-caption, caption {
	display: block;
	padding: 13px 15px;
	/*background: #eeeeee;*/
	font-size: 15px;
	color: var(--color-gray-2);
	margin-bottom: -10px;
	text-align: center;
}	
p {
	margin: 0;
	padding: 0;
	margin-bottom: 30px;
	max-width: 960px;
}
p.large {
	font-size: 18px;
}
h1, h2, h3, h4, p {
	margin-top: -5px;
}

@media (max-width: 1080px) {
	h1 {
		font-size: 40px;
		line-height: 1.1;
	}
}

@media (max-width: 710px) {
	h1 {
		font-size: 36px;
		line-height: 1.15;
	}
}

/*======================================================================
  HELPERS
=======================================================================*/

.clearfix:after {
  content: '';
  display: table;
  clear: both;
}
.fixed {
	position: fixed !important;	
}
.overflow {
	overflow: hidden !important;	
}
.padding-side {
	padding-left: var(--base-margin) !important;
	padding-right: var(--base-margin) !important;
}
.margin-side {
	margin-left: var(--base-margin) !important;
	margin-right: var(--base-margin) !important;
}
.margin-top {
	margin-top: var(--section-spacing) !important;
}
.margin-bottom {
	margin-bottom: var(--section-spacing) !important;
}
.padding-top {
	padding-top: var(--section-spacing) !important;
}
.padding-bottom {
	padding-bottom: var(--section-spacing) !important;
}
.no-padding {
	padding: 0 !important;
}
.no-margin {
	margin: 0 !important;
}
.no-border {
	border: none !important;
}
.align-left {
	float: left;
}
.align-right {
	float: right;
}
.align-center {
	text-align: center;
}
.ratio-1x1 {
	aspect-ratio: 1/1;
}
.ratio-16x9 {
	aspect-ratio: 16/9;
}
.border-bottom {
 	border-bottom: var(--base-border)
}
.border-top {
 	border-top: var(--base-border)
}
.row-reverse {
	flex-flow: row-reverse !important;
}
.accordion {
	visibility: hidden;
}
.accordion.show {
	visibility: visible;
}
.offset-bottom {
	margin-bottom: calc(calc(var(--bottom-spacing) * -1) + 30px);	/* offsets default bottom margin */
}
.page-sticky {
	position: sticky;
	top: var(--base-sticky);
}

@media (max-width: 1080px) {	
	.page-sticky {
		position: relative;
		top: auto;
	}
}

/*=======================================================================
  LOADERS
========================================================================*/

#cover-loader {
	position: fixed;
	width: 100%;
	height: 100vh;
	top: 0;
	left: 0;
	background: rgba(255,255,255,0.5);
	z-index: 900;
	display: none;
}
.section-loader {
	position: relative;
	width: auto;
	height: auto;
	top: 0;
	left: 0;
	z-index: 1;
	display: none;
}

/* spinning circle loader */
.loader-circle {
	position: absolute;
	top: 50%;
	left: 50%;	
	border: 3px solid var(--color-orange);
	border-radius: 50%;
	border-top-color: transparent;
	width: 40px;
	height: 40px;
	animation: spin .6s linear infinite;
	margin: -20px 0 0 -20px;
}
@keyframes spin {
  100% {transform: rotate(360deg);}
}
	.section-loader .loader-circle {
		position: relative;
		top: 0;
		left: 0;
		margin: 0 auto;
		margin-bottom: -40px  /* minus height */
	}
	
/* square loader */
.section-loader .loader-square {
	position: absolute;
	top: 0px;
	left: 0;
	width: 100%;
	text-align: center;
}	
	.section-loader .loader-square svg {
		width: 30px;
		height: 30px;
	}
	.section-loader .loader-square .path {
		display: inline-block;
		stroke: var(--color-orange);
		stroke-width: 14;

		/* base size is 50 x 50 */
		stroke-dasharray: 80, 120;
		stroke-dashoffset: 200;
		animation: dash .4s linear forwards infinite;
	}

@keyframes dash {
  to {
    stroke-dashoffset: 0;
  }
}
	
/*=======================================================================
  STRUCTURE
========================================================================*/
#main {
	position: relative;
}
	/* show page */
	.show-page #main {

	}	


body.admin-bar #header, body.admin-bar #header-search {
      margin-top: 25px;
}
#header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: var(--header-height);
	z-index: 600;
	transition: all var(--fade-speed);
}
#header .logo {
	position: absolute;
	top: 27px;
	left: var(--base-margin);
	font-weight: 600;
	font-size: 24px;
	color: #ffffff;
	z-index: 10;
}
	#header .logo svg {
		fill: #ffffff;
		width: 145px;
		height: auto;
		transition: all var(--fade-speed);
	}
#header .icons {
	position: absolute;
	top: 29px;
	right: var(--base-margin);
	width: auto;
}
	#header .icons div {
		display: inline-block;
		align: right;
		margin-left: 24px;
	}
		#header .icons svg {
			width: 22px;
			height: 22px;
			fill: #ffffff;
		}
	#header .icons a:hover {
		opacity: var(--fade-opacity);
	}
#header.scroll, #header.solid {
		background: #000000;
		/*box-shadow: inset 0 -1px 1px rgba(0,0,0,0.2);*/
	}
	#header.scroll svg, #header.solid svg {
		fill: #ffffff;
	}
#content, #content-with-hero {
	position: relative;
	background: #ffffff;
	min-height: 110vh;
	padding-top: var(--header-height);	/* offset header height */
	padding-bottom: var(--bottom-spacing);
	margin: 0 auto;
	/*max-width: 80%;*/
	padding-left: var(--base-margin);
	padding-right: var(--base-margin);
}
	#content-with-hero {
		padding-top: var(--section-spacing);
	}

/*=======================================================================
  MENU
========================================================================*/ 

#menu {
	position: fixed;
	width: 100%;
	height: 100vh;
	z-index: 999;
	visibility: hidden;
}
.menu-overlay {
	position: fixed;
	width: 100%;
	height: 100vh;
	background: rgba(0,0,0,0.5);
	opacity: 0;
	transition: all .3s cubic-bezier(0, 0.8, 0.4, 1);
}
.menu-holder {
	width: 400px;
	height: 100vh;
	position: absolute;
	position: absolute;
	top: 0;
	right: -400px;
	overflow-y: scroll;
	-ms-overflow-style: none;  /* IE and Edge */
	scrollbar-width: none;  /* Firefox */
	background: #ffffff;
	padding: 35px;
	padding-top: 28px;
	font-size: 18px;
	z-index: 5;
	transition: all .3s cubic-bezier(0, 0.8, 0.4, 1);
}
	.menu-holder::-webkit-scrollbar {
		display: none;
	}
	.menu-holder ul, .menu-holder li {
		margin: 0;
		padding: 0;
		list-style: none;
	}
	.menu-holder ul {
		margin-bottom: 30px;
	}
	.menu-holder li {
		margin-bottom: 7px;
	}
	.menu-holder .menu-links a {	
		color: #000000;
		display: inline;
		padding-bottom: 0px;
		text-decoration: none;
	}
		.menu-holder .menu-links a:hover {
			opacity: 1;
			color: var(--color-orange);
			background-size: 100% 1px;
		}
	.menu-holder .menu-links svg {
		fill: #000000;
		width: 16px;
		height: 16px;
	}
	.menu-holder .menu-links .icon {
		position: relative;
		display: inline-block;
		margin-left: 5px;
		top: 3px;
	}
	.menu-close-icon {
		display: block;
		position: absolute;
		top: 32px;
		right: 35px;
		z-index: 10;
	}
		.menu-close-icon:hover {
			opacity: var(--fade-opacity)
		}
		.menu-close-icon svg {
			fill: #000000;
			width: 20px;
			height: 20px;
		}
	.menu-social {
		margin-top: 35px;
		color: #000000;
		text-align: center;
		display: flex;
		justify-content: flex-start;
		gap: 20px;
	}
		.menu-social a {
			opacity: 1 !important;
		}
		.menu-social svg {
			fill: #000000;
		}
			.menu-social a:hover svg {
				fill: var(--color-orange);
			}
#menu.menu-on {
	visibility: visible;
}
	#menu.menu-on .menu-overlay {
		opacity: 1;
	}
	#menu.menu-on .menu-holder {
		right: 0;
	}
	
@media (max-width: 710px) {
	.menu-holder {
		width: 100%;
		padding-left: var(--base-margin);
		right: -100%;
	}
}

/*=======================================================================
  GLOBAL SEARCH
========================================================================*/
#header-search {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	z-index: 999;
	display: none;
}
#search-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background: rgba(0,0,0,0.5);
}
	#header-search .inner {
		position: relative;
		width: 100%;
		z-index: 10;
		padding: 14px var(--base-margin);
		background: #ffffff;
		height: var(--header-height);
	}
	#header-search form {
		position: relative;
		width: calc(100% - 50px);
	}
	#header-search input { 
		margin: 0;
		padding: 0;
		position: relative;
		appearance: none;
		border: 0;
		
		font-size: 21px;
		font-family: var(--font-tech);
		color: #000000;
		font-weight: 600;
		width: 100%;
		padding: 0px 15px 0px;
		padding-left: 42px;
		top: 12px;
	}
	#header-search input:focus {
		outline: none;
		border-color: black;
	}
	#header-search input::placeholder {
		color: var(--color-gray-3);
	}
		#header-search input:focus::placeholder {
			/*color: transparent;*/
		}
	#header-search .search-icon {
		position: absolute;
		top: 28px;
		left: var(--base-margin);
		z-index: 10;
	}
		#header-search .search-icon svg {
			width: 22px;
			height: 22px;
			fill: #000000;
		}
	#header-search .close-icon {
		position: absolute;
		top: 31px;
		right: calc(var(--base-margin) + 2px );
		z-index: 10;
	}
		#header-search .close-icon:hover {
			opacity: var(--fade-opacity);
		}
		#header-search .close-icon svg {
			width: 20px;
			height: 20px;
			fill: #000000;
		}
	
@media (max-width: 710px) {

}

/*=======================================================================
  MODALS
========================================================================*/ 

.modal {
	position: fixed;
	width: 100%;
	height: 100vh;
	z-index: 999;
	visibility: hidden;
}
.modal-inner {
	width: 100%;
	height: 100vh;
	display: flex;
	justify-content: center;
	align-items: center;
}
.modal-overlay {
	position: fixed;
	width: 100%;
	height: 100vh;
	background: rgba(0,0,0,0.5);
	transition: all 0;
	opacity: 0;
}
.modal-content {
	opacity: 0;
	top: 30px;
	position: relative;
	padding: 29px 29px 30px 29px;
	background: #ffffff;
	width: auto;
	max-width: 95%;
	z-index: 2;
	border-radius: var(--base-corner-radius);
	transition: top .3s cubic-bezier(0, 0.8, 0.4, 1);
}
	.modal-close {
		position: absolute;
		display: block;
		top: 29px;
		right: 30px;
	}
	.modal-close svg {
		width: 16px;
		height: 16px;
		fill: #000000;
	}
		.modal-close:hover {
			opacity: var(--fade-opacity);
		}
		
.modal.modal-on {
	visibility: visible;
}
	.modal.modal-on .modal-overlay {
		opacity: 1;
	}
	.modal.modal-on .modal-content {
		opacity: 1;
		top: 0;
	}
.modal h3 {
	margin-bottom: 22px;
}

/* save to list modal ++++++++++++++++++++++++++++++++++++ */

.modal-save-holder {
	position: relative;
	display: flex;
	gap: 0 30px;
	margin-bottom: -10px;
}	
.modal-save-holder .thumbnail {
	    width: 160px;
    height: 120px;
    background-position: center center;
    flex-shrink: 0;
    background-size: 105%;
    background-size: cover;
    background-color: #000000;
}
.modal-save-holder .new-list {
	position: relative;
	max-width: 280px;
}
.modal-save-holder .current-lists {
	position: relative;
	max-width: 280px;
	margin-top: -4px;
	margin-bottom: 20px;
}
.modal-save-holder .scrolling-list {
	height: 150px;
	overflow-y: scroll;
	border: 1px solid var(--color-gray-3);
}
	.modal-save-holder .current-lists ul, .modal-save-holder .current-lists li {
		margin: 0;
		padding: 0;
		list-style: none;
	}
	.modal-save-holder .current-lists .inner {
		padding: 7px 0;
	}
	.modal-save-holder .current-lists li {
		position: relative;
		display: block;
		width: 100%;
	}
		.modal-save-holder .current-lists a {
			position: relative;
			display: block;
			text-decoration: none;
			padding: 5px 13px;
			padding-right: 55px;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
		}
		.modal-save-holder .current-lists li a:hover {
			background: #eeeeee;
			color: inherit !important;
		}
		.modal-save-holder .current-lists li a:hover span {
			display: block !important;
		}
	.modal-save-holder .current-lists li span {
		position: absolute;
		top: 8px;
		right: 10px;
		text-decoration: none; 
		
		color: var(--color-orange);
		font-size: 13px;
		text-transform: uppercase;
	}
.modal-save-holder .new-list {
	position: relative;
}
	.modal-save-holder .new-list input {
		margin-top: 0 !important;
		padding-right: 55px !important;
	}
	.modal-save-holder .new-list form:focus-within .save-new-list {
		display: block;
	}	
	.modal-save-holder a.save-new-list {
		display: none;
		position: absolute;
		top: 5px;
		right: 5px; 
		text-decoration: none;
		font-size: 13px;
		text-transform: uppercase;
		color: var(--color-orange);
		z-index: 2;
		padding: 10px;
	}
	
@media (max-width: 710px) {
	.modal-save-holder {
		position: relative;
		display: flex;
		gap: 30px;
		margin-bottom: -10px;
		flex-direction: column;
		align-content: center;
		justify-content: center;
		align-items: center;
	}	

}/*
	.modal-save-holder .thumbnail {
		margin-bottom: 28px;
	}
	.modal-save-holder .thumbnail {
		width: 63px;
		height: 46px;
	}
	.modal-save-holder .new-list {
		position: absolute;
		top: 0;
		left: 85px;
		max-width: 200px;
	}
	.modal-save-holder .current-lists a {
		padding-right: 13px;
	}
		.modal-save-holder .current-lists li a:hover span {
			display: none !important;
		}
}

	*/
/*=======================================================================
  FEEDBACK
========================================================================*/ 

#feedback {
	position: fixed;
	display: flex;
	z-index: 999;
	justify-content: center;
	width: 100%;
	top: 0px;
	opacity: 0;
	transition: all var(--fade-speed);
	pointer-events: none;
	/*transition: all .3s cubic-bezier(0, 0.8, 0.4, 1);*/
}
	#feedback .inner {
		padding: 13px 18px; 
		/*width: 100%;*/
		background: var(--color-orange);
		display: flex;
		justify-content: center;
		gap: 0 7px; 
		color: #000000;
	}
	#feedback .icon {
		position: relative;
		top: 2px;
	}
#feedback svg {
	width: 16px;
	height: 16px;
	fill: #000000;
}
#feedback.on {
	opacity: 1;
}

	
	
/*=====================================================================
LAYOUT
======================================================================*/
@media screen and (max-width: 600px) {
    #wpadminbar {
        position: fixed;
    }
}
.layout-50-50 {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 0 var(--center-spacing)
}
	.layout-50-50 > div {
		width: calc(50% - calc(var(--center-spacing)/2));
		flex-shrink: 0;
	}
.layout-inside {
	width: 100%;
	margin: 0 auto;
	max-width: 880px;
}
.layout-grid {
	position: relative;
}
	.layout-grid ul, .layout-grid li {
		margin: 0;
		padding: 0;
		list-style: none;
	}
	.layout-grid ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		margin-left: calc(var(--grid-spacing) * -1);
	}
	.layout-grid ul:has(li.no-results){
		margin-inline-start: 0;
	}
		.layout-grid li {
			position: relative;
			margin-left: var(--grid-spacing);
		}
		.layout-grid li.no-results{
			margin-inline-start: 0;
		}
		.layout-grid .title {
			font-size: 18px;
			font-family: var(--font-sans);
			font-weight: 600;
			color: #000000;
			margin: 0;
			margin-bottom: 6px;
			
			display: -webkit-box;
			-webkit-line-clamp: 2;
			-webkit-box-orient: vertical;  
			overflow: hidden;
		}
		.layout-grid .sub-text {
			display: block;
			font-size: 14px;
			color: var(--color-gray-2);
			margin-bottom: 6px;
		}
		.layout-grid .post-type {
			display: block;
			font-size: 14px;
			color: var(--color-gray-2);
			/*text-transform: uppercase;*/
			letter-spacing: 0.03em;
			margin-bottom: 6px;
		}
		.layout-grid .desc {
			margin: 0;
			font-size: 15px;
			color: var(--color-gray-1) !important;
			
			display: -webkit-box;
			-webkit-line-clamp: 3;
			-webkit-box-orient: vertical;  
			overflow: hidden;
		}
		.layout-grid .text-holder {
			padding-right: 10px;
		}
		.layout-grid li a {
			display: block;
			text-decoration: none;
		}
			.layout-grid li a:hover {
				opacity: 1;
			}
			.layout-grid li a:hover .overlay {
				opacity: 1;
			}			
			.layout-grid li a:hover .title  {
				color: var(--color-orange);
			}	
		
	
		/* add scroll class for horizontal scrolling *********************/

		.layout-grid.scroll  {
			overflow-x: scroll;
			-ms-overflow-style: none;
			scrollbar-width: none;
			
			padding-left: var(--base-margin);
			padding-right: var(--base-margin);
			margin-left: calc(var(--base-margin) * -1);	
			width: calc(100% + var(--base-margin)*2)
		}
		.layout-grid.scroll::-webkit-scrollbar {
			display: none;
		}
			.layout-grid.scroll ul {
				flex-wrap: nowrap;
			}
			.layout-grid.scroll ul:last-child:after {
				content: '';
				flex: none;
				width: calc(var(--base-margin) * 2);
			}
			
		/* for videos ********************************************** */
		
		.layout-grid .list-icon, .layout-grid .play-icon {
			display: block;
			position: absolute;
			z-index: 10;
			padding: 10px;
		}
			.layout-grid .list-icon svg, .layout-grid .play-icon svg {
				fill: #ffffff;
				width: 16px;
				height: 16px;
			}
		.layout-grid .play-icon {
			top: 5px;
			left: 5px;
			display: block;
		}
		.layout-grid .list-icon {
			top: 5px;
			right: 6px;
			/*transition: all var(--fade-speed);
			visibility: hidden;
			*/
			cursor: pointer;
			opacity: 1;
		}
			.layout-grid .list-icon:hover {
				opacity: var(--fade-opacity) !important;
			}
		.layout-grid li video {
			width: 105%;
			position: absolute;
			top: -2%;
			left: -2%;
			height: auto;
			min-height: 105%;
			z-index: 2;
		}
.home .layout-grid .post-type{
	text-transform: uppercase;
}
/* grid sizes */	
.layout-grid.grid-lg li {
	flex: 0 0;
	flex-basis: calc(33.33% - var(--grid-spacing));
	margin-bottom: 70px;
}
.layout-grid.grid-md li {
	flex: 0 0;
	flex-basis: calc(25% - var(--grid-spacing));
	margin-bottom: 70px;
}
.layout-grid.grid-sm li {
	flex: 0 0;
	flex-basis: calc(20% - var(--grid-spacing));
	margin-bottom: 70px;
}
			
@media (max-width: 1450px) {
	/* grid sizes */	
	.layout-grid.grid-lg li {
		flex: 0 0;
		flex-basis: calc(33.33% - var(--grid-spacing));
		margin-bottom: 60px;
	}
	.layout-grid.grid-md li {
		flex: 0 0;
		flex-basis: calc(33.33% - var(--grid-spacing));
		margin-bottom: 60px;
	}
	.layout-grid.grid-sm li {
		flex: 0 0;
		flex-basis: calc(25% - var(--grid-spacing));
		margin-bottom: 60px;
	}
	/* scroll limits */
	.layout-grid.grid-sm.scroll li:nth-child(5) {
		display: none;
	}
}

@media (max-width: 1080px) {
	.layout-50-50 {
		display: block;		
	}	
	.layout-50-50 > div {
		width: 100%;
		margin-bottom: 40px;
	}
	/* grid sizes */	
	.layout-grid.grid-lg li {
		flex: 0 0;
		flex-basis: calc(50% - var(--grid-spacing));
		margin-bottom: 60px;
	}
	.layout-grid.grid-md li {
		flex: 0 0;
		flex-basis: calc(50% - var(--grid-spacing));
		margin-bottom: 60px;
	}
	.layout-grid.grid-sm li {
		flex: 0 0;
		flex-basis: calc(33.33% - var(--grid-spacing));
		margin-bottom: 60px;
	}
	.layout-grid li video {
		display: none;
	}
	/* scroll limits */
	.layout-grid.grid-lg li:nth-child(3) {
		display: none;
	}
	.layout-grid.grid-sm.scroll li:nth-child(4) {
		display: none;
	}
}

@media (max-width: 710px) {
	/* grid sizes */	
	.layout-grid.grid-lg li {
		flex: 0 0;
		flex-basis: calc(100% - var(--grid-spacing));
		margin-bottom: 60px;
	}
	.layout-grid.grid-md li {
		flex: 0 0;
		flex-basis: calc(100% - var(--grid-spacing));
		margin-bottom: 60px;
	}
	.layout-grid.grid-sm li {
		flex: 0 0;
		flex-basis: calc(50% - var(--grid-spacing));
		margin-bottom: 30px;
	}
	.layout-grid.grid-lg .title, .layout-grid.grid-md .title, .layout-grid.grid-sm .title {
		-webkit-line-clamp: initial !important;
	}
	.layout-grid.grid-sm .desc {
		display: none;
	}
	/* scroll limits */
	.layout-grid.grid-lg li:nth-child(3) {
		display: block;
	}
	.layout-grid.grid-sm.scroll li:nth-child(4), .layout-grid.grid-sm.scroll li:nth-child(5) {
		display: block;
	}
}


/* Layout overrides for Contextual Related Posts */
.crp_related ul li a{
	text-decoration: none;
    display: flex;
    flex-direction: column;
    height: 100%;
	justify-content: space-between;
}
.crp_related figure{
	margin: 0;
}
.crp_title{
	font-size: 18px;
    font-family: var(--font-sans);
    font-weight: 600;
    color: #000000;
	padding-bottom: 1em;
}
.crp_excerpt{
	margin-top: 1em;
}

/* holds images and video */
.media-holder {
	margin-bottom: 13px;
}
	.grid-sm .media-holder {
		/*margin-bottom: 11px;*/
	}
	.media {
		/* forces image to certain size */
		position: relative;
		width: 100%;
		height: auto;
		background: #000000;
		aspect-ratio: 4/3;
		overflow: hidden;
	}
		.media-holder .overlay {
			position: absolute;
			width: 100%;
			height: 100%;
			background: rgba(0,0,0,0.2);
			opacity: 0;
			/*transition: all var(--fade-speed);*/
			z-index: 5;
		}
		.media-holder img  {
			position: absolute;
			top: -2%;
			left: -2%;
			width: 105%;
			height: 105%;
			object-fit: cover;
			z-index: 1;	/* sets image behind video */
		}
	

/* grid list for blog and events ****************************************************** */

.grid-list .title {
	font-size: 21px;
	padding-right: 20px;
	margin-bottom: 6px;
	-webkit-line-clamp: initial !important;
}
.grid-list .desc {
	font-size: 16px;
	margin-bottom: 5px;
}
.grid-list.no-border li {
	border: 0 !important;
	padding-bottom: 0;
}
.grid-list li > a, .grid-list li > div {
	display: flex;
	justify-content: flex-start;
	gap: 0 30px;
}
.grid-list .media-holder {
	width: 240px;
	height: auto;
	margin: 0;
	flex-shrink: 0;
}
	.grid-list .text-holder {
		width: 100%;
		margin-top: -5px;
	}

/* full width list */

.grid-full ul {
	margin: 0;
	margin-top: calc(var(--section-spacing) * -1); /* offsets default top margin */
	margin-bottom: var(--section-spacing);
}
	.grid-full li {
		width: 100%;
		margin: 0;
		padding-top: var(--section-spacing);
		padding-bottom: var(--section-spacing);
		border-bottom: var(--base-border);
	}

/* half / half list */
.grid-50-50.no-border li {
	border: 0 !important;
}
.grid-50-50 ul {
	margin: 0;
	flex-wrap: wrap;
	margin-top: calc(var(--section-spacing) * -1);
	margin-bottom: var(--section-spacing);
}
	.grid-50-50 li {
		margin: 0;
		width: 50%;
		padding-top: var(--section-spacing);
		padding-bottom: var(--section-spacing);
		border-bottom: var(--base-border);
		padding-right: calc(var(--center-spacing)/2);
	}
		.grid-50-50 li:nth-child(even) {
			padding-left: calc(var(--center-spacing)/2);
			padding-right: 0;;
		}
		.grid-50-50 li > a, .grid-50-50 li > div {
			display: flex;
			justify-content: flex-start;
			gap: 0 30px;
		}
			
@media (max-width: 1200px) {
	.grid-50-50 ul {
		display: block;
	}
		.grid-50-50 li {
			width: 100%;
			padding-left: 0 !important;
			padding-right: 0 !important;
	}

}
@media (max-width: 710px) {
	.grid-list ul {
		margin-top: var(--section-spacing);
	}
	.grid-list li {
		border: 0;
		padding: 0;
		margin-bottom: 60px;
	}
	.grid-list .media-holder {
		width: 100%;
		margin-bottom: 13px;
	}
	.grid-list .text-holder {
		margin: 0;
	}
	.grid-list li > a, .grid-list li > div {
		display: block;
	}
	.grid-list .title {
		font-size: 18px;
	}
	.grid-list .desc {
		font-size: 15px;
	}
}
	
/* page header ********************************************************** */

.page-header {
	/*margin-bottom: var(--section-spacing);
	border-bottom: var(--base-border);
	*/
	padding-bottom: var(--header-spacing);
	margin-top: var(--header-spacing);
}
	.page-header h1 {
		margin: 0;
	}
	.page-header h1 a {
		display: inline-block;
		margin-left: 5px;
	}
		.page-header h1 a svg {
			width: 24px;
			height: 24px;
			fill: #000000;
		}
			.page-header h1 a:hover svg {
				opacity: 0.6;
			}
	.page-header p.large {
		margin: 0;
		margin-top: 20px;
	}
.sub-header {
	margin-bottom: 11px;
	margin-top: -0px;
	color: var(--color-gray-2);
	text-decoration: none;
	font-size: 16px;
	letter-spacing: .03em;
}
	.sub-header a, .sub-header span {
		text-decoration: none;
		opacity: 1;
	}
	.sub-header a:hover {
		color: #000000;
		/*--underline-width: 100%;*/
	}
.sub-info {
	margin-bottom: -5px;
	margin-top: 18px;
}
.sub-info svg {
	width: 20px;
	height: 20px;
	fill: #000000;
}
	.sub-info span {
		display: inline-block;
		position: relative;
		top: 1px;
	}
.sub-date, .sub-location {
	display: flex;
	justify-content: flex-start;
	width: auto;
	margin-bottom: 15px;
}
	.sub-date div, .sub-location div {
		width: calc(100% - 30px);
	}
	.sub-date span, .sub-location span {
		display: block;
		margin-right: 8px;
		width: 24px;
	}
.section-header {
	margin-bottom: 36px;
	padding-top: 36px;
	/*border-top: var(--base-border);*/
}
.section-header > div {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
}
	.section-header .tags {
		margin-top: 28px;
	}
.section-header .scroll-arrows {
	display: flex;
	flex-wrap: nowrap;
}
	.section-header .scroll-arrows > a {
		display: block;
		margin-left: 15px;
	}
.section-header h2, .section-header h3 {
	margin: 0;
	margin-top: -5px;
}

/* pages with big background hero ******************************************* */

#hero {
	position: relative;
	width: 100%;
	height: var(--hero-height);
	z-index: 0;
	background: #000000;	
}
	#hero .loader {
		position: absolute;
		z-index: 2;
		background: url('img/static-loop.gif') top center no-repeat;
		background-size: cover;
		width: 100%;
		height: 100%;
	}
		body.show-page #hero .loader {
			display: none;
		}
	#hero .background {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: var(--hero-height);
	}
		#hero .fade {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background: #000000;
			z-index: 5;
			opacity: 0.3;
		}
			#hero .video {
				position: absolute;
				width: 100%;
				height: var(--hero-height);
				top: 0;
				left: 0;
			}
				#hero .video iframe {
					width: 100vw;
					height: 56.25vw; /* 16:9 aspect ratio */
					min-height: var(--hero-height);
					min-width: 177.77vh; /* inverse 16:9 aspect ratio */
					position: absolute;
					top: 50%;
					left: 50%;
					transform: translate(-50%, -50%);
				}
			#hero .image {
				position: absolute;
				width: 100%;
				height: 100%;
				top: 0;
				left: 0;
				background-position: center center;
				background-size: cover;
			}
			
		#hero .intro {
			position: absolute;
			width: 100%;
			bottom: calc(var(--header-spacing) + 5px);
			padding-left: var(--base-margin);
			padding-right: var(--base-margin);
			z-index: 10;
		}
			#hero .intro h1, #hero .intro p {
				color: #ffffff;
			}
			#hero .intro h1 {
				margin: 0;
			}
			#hero .intro .sub-header a {
				color: #ffffff;
				opacity: var(--fade-opacity);
			}
				#hero .intro .sub-header a:hover {
					opacity: 1;
				}
	#hero .sub-info {
		margin: 15px 0 0 0;
		color: #ffffff;
	}
		#hero .sub-info p {
			margin: 0;
		}

/*=====================================================================
UI ELEMENTS
======================================================================*/

/* tags ***************************************************************** */

.tags, .tags li {
	margin: 0;
	padding: 0;
	list-style: none;
}
.tags {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: -10px; /* offset bottom margin of tag */
}
.tags li {
	margin-right: 12px;
	margin-bottom: 12px;
}
.tags a {
	display: block;
	position: relative;
	padding: 10px 16px 10px;
	/*border: 1px solid var(--color-gray-2);*/
	border-radius: var(--base-corner-radius);
	color: var(--color-gray-1);
	text-decoration: none;
	font-size: 15px;
	opacity: 1;
	background: var(--color-gray-5);
}
.tags a.tag-selected, .tags a.tag-selected:hover {
	background: #000000;
	border-color: #000000;
	color: #ffffff;
}
.tags span {
	position: relative;
	display: inline-block;
	width: 16px;
	height: 16px;
	top: 3px;
}
	.tags span svg {
		fill: var(--color-gray-2);
		width: 16px;
		height: 16px;
	}
		.tags a:hover {
			/*border: 1px solid var(--color-gray-1);*/
			color: #000000 !important;
			background: #dddddd;
		}
		.tags a:hover svg {
			fill: var(--color-gray-1);
		}
.front-icon {
	margin-right: 10px;
}
.back-icon {
	margin-left: 10px;
}
.clear a {
	color: var(--color-orange);
	background: none;
	padding-left: 0;
	padding-right: 0;
}	
	.clear a:hover {
		color: #000000;
		background: none;
	}

/* tabs ***************************************************************** */

.tab-holder {
	margin-bottom: var(--section-spacing);
	border-bottom: var(--base-border);
}
.tabs, .tabs li {
	margin: 0;
	padding: 0;
	list-style: none;
}
.tabs {
	display: flex;
	flex-wrap: nowrap;
	
	overflow-x: scroll;
	-ms-overflow-style: none;
	scrollbar-width: none;
	margin-bottom: -1px;
	padding-left: var(--base-margin);
	margin-left: calc(var(--base-margin) * -1);			
	width: calc(100% + var(--base-margin)*2)
}
	.tabs::-webkit-scrollbar {
		display: none;
	}
	.tabs:last-child:after {
		content: '';
		flex: none;
		width: calc(var(--base-margin) * 2);
	}
.tabs li {
	flex: 0 0 auto;
	align-items: flex-start;
	margin-right: 25px;
}
.tabs a {
	display: block;
	position: relative;
	padding: 10px 0 20px;
	color: var(--color-gray-1);
	text-decoration: none;
	opacity: 1;
	border-bottom: 3px solid transparent;
	margin-bottom: 0px;
	z-index: 5;
}
.tabs a.tab-selected, .tabs a.tab-selected:hover {
	border-color: var(--color-orange);
	color: #000000;
}
	.tabs a:hover {
		color: #000000;
	}
	
/* combo box ***************************************************************** */

.combo-box {
	display: flex;
	position: relative;
	flex-grow: 1;
	font-size: 16px;
}
	a.combo-title {
		display: flex;
		flex-grow: 1;
		justify-content: space-between;
		padding: 10px 13px;
		border: 1px solid var(--color-gray-3);
		text-decoration: none;
		opacity: 1;
		background: url('/wp-content/uploads//icon-chevron-down.svg') no-repeat right 15px center;
		background-size: 16px 16px;
	}
		a.combo-title:hover, .combo-box.open .combo-title {
			border-color: var(--color-gray-2);
			color: #000000;
		}	
	.combo-content {
		display: block;
		visibility: hidden;
		opacity: 0;
		position: absolute;
		top: 44px;
		width: 100%;
		background: #ffffff;
		border: 1px solid var(--color-gray-2);
		border-top-color: #d8d8d8;
		z-index: 500;
		/*transition: top 0.2s cubic-bezier(0, 0.8, 0.4, 1), opacity 0.2s cubic-bezier(0, 0.8, 0.4, 1);*/
		max-height: 200px;
		overflow-y: scroll
	}
		.combo-content ul, .combo-content li {
			margin: 0;
			padding: 0;
			list-style: none;
		}		
		.combo-content .inner {
			padding: 7px 0;
		}
		.combo-content label {
			margin: 0;
			display: block;
			width: 100%;
			padding: 5px 13px;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
		}
			.combo-content input {
				margin: 0;
			}
			.combo-content label:hover {
				background: #eeeeee;
			}
.combo-content .combo-search {
padding: 12px 13px 2px;
}
.combo-content .combo-search input {
padding: 8px;
font-size: 15px;
margin-bottom: 0;
}

.combo-box.open .combo-content {
	opacity: 1;
	visibility: visible;
}


/*========================================================================
  HOME 
=======================================================================*/

.home-intro h1 {
	margin-bottom: 30px !important;
	max-width: 700px;
	font-size: 56px;
}
.home-intro p {
	margin-bottom: 10px;
}
.home-intro .layout-50-50 > div {
	margin-bottom: 0 !important;
}
	
/* home search ************************************** */
#home-search {
	margin-bottom: 50px;
}
#home-search form {
	position: relative;
	margin-bottom: 20px;
}	
	#home-search input { 
		margin: 0;
		padding: 0;
		position: relative;
		appearance: none;
		border: 0;
		
		font-size: 21px;
		font-family: var(--font-tech);
		color: #000000;
		font-weight: 600;
		width: 100%;
		padding: 12px 12px;
		border: 1px solid var(--color-gray-3);
		padding-left: 52px;
	}
	#home-search input:focus {
		
	}
	#home-search input::placeholder {
		color: var(--color-gray-3);
	}
		#home-search input:focus::placeholder {
			color: transparent;
		}
	#home-search .search-icon {
		position: absolute;
		top: 16px;
		left: 18px;
		z-index: 10;
	}
		#home-search .search-icon svg {
			width: 22px;
			height: 22px;
			fill: var(--color-gray-2);
		}
	#home-search form:focus-within svg {
		fill: #000000;
	}
#home-search .tags {
	margin: 0;
}

@media (max-width: 1450px) {
	.home-intro h1 {
		font-size: 48px;
	}
	#home-search {
		margin-bottom: 40px;
	}
}

@media (max-width: 710px) {
	.home-intro h1 {
		font-size: 36px;
	}
}

/*========================================================================
  SEARCH RESULTS
=======================================================================*/


#filter-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: -15px;
	margin-bottom: 20px;
	font-size: 15px;
}
	#filter-header h3 {
		margin: 0;
	}
#filter-options {
  display: flex;
  flex-wrap: wrap;
  gap: 0 20px;
  margin-bottom: 40px;
}
#filters-selected {
	margin-top: -15px;
	margin-bottom: 50px;
}

#filter-header .has-tooltip{
	position: relative;
	display: flex;
	flex-wrap: nowrap;
}


.tooltip-icon {
  display: inline-block;
  margin-left: 6px;
  color: #000;
  width: 18px;
  height: 18px;
  font-size: 15px;
  text-align: center;
  cursor: help;
  line-height: 18px;
  position: relative;
}


.tooltip-text {
  visibility: hidden;
  opacity: 0;
  background: #333;
  color: #fff;
  text-align: left;
  padding: 6px 10px;
  border-radius: 4px;
  position: absolute;
  top: 28px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 999;
  white-space: normal;
  font-size: 12px;
  transition: opacity 0.2s;
  max-width: 270px;
  width: 270px;
  box-shadow: 0 0 6px rgba(0,0,0,0.2);
}

.tooltip-icon:hover + .tooltip-text,
.tooltip-icon:focus + .tooltip-text {
  visibility: visible;
  opacity: 1;
}

/* date slider ************************************ */

#filter-date .combo-content {
	overflow: hidden;
}
.date-holder {
	position: relative;
	padding: 27px 20px 18px 22px;
}
.date-values {
	display: flex;
	justify-content: space-between;
	font-size: 14px;
	font-weight: 500;
	margin-top: 16px;	
	color: var(--color-gray-2);
}
	.date-values > div {
		width: 100px;
	}
		.date-values > div:nth-child(1) {
			text-align: left;
		}
		.date-values > div:nth-child(2) {
			text-align: center;
		}
		.date-values > div:nth-child(3) {
			text-align: right;
		}
.ui-slider-horizontal {
	height: 3px !important;
	border: 0 !important;
	position: relative;
	z-index: 3;
	margin: 0 8px;
}
.ui-slider .ui-slider-range {
	background: var(--color-orange) !important;
}
.ui-slider .ui-slider-handle {
	border: 3px solid var(--color-orange) !important;
	border-radius: 40px !important;
	background: #ffffff !important;
	margin-top: -3px;
	width: 18px!important;
	height: 18px !important;
	margin-left: -10px !important;
}
.ui-slider-horizontal.ui-widget-content {
	background: transparent !important;	
}
.date-slider-bg {
	background: #dddddd;
	height: 3px;
	width: calc(100% - 45px);
	position: absolute;
	top: 27px;
}

@media (max-width: 1080px) {
	#filter-options {
		gap: 15px 20px;
	}
		#filter-options .combo-box {
			flex-basis: 40%;
		}
	#filter-header {
		margin-top: -5px;
	}
}

@media (max-width: 710px) {
	#filter-options {
	  display: block;
	  margin-bottom: 40px;
	}
		#filter-options .combo-box {
			width: 100%;
			margin-bottom: 15px;
		}
}

/*========================================================================
  COLLECTIONS 
=======================================================================*/



/*========================================================================
  VIDEO DETAIL
=======================================================================*/

#video-layout {
	position: relative;
	display: flex;
	justify-content: flex-start;
	gap: 0 50px;
	margin-top: var(--header-spacing);
	margin-bottom: 55px;
}
.video-holder {
	width: 50%;
	min-width: 50%;
	max-width: 960px;
}
	.video-offset {
		padding-top: 5px;
	}
.video-info {
	width: 100%;
}
.video-transcript p {
	/* 
	 * this causes issues with text that has formatting, such as <em> or <i> elements.
	 * You end up with each formatting dom creating a new column in the row
	display: flex;
	justify-content: flex-start;
	gap: 0 10px;
	*/
	
	display: table;
}
.video-transcript p > a {
	/*
	 * this is part of the flexbox code that is no longer needed
	width: 60px;
	flex-shrink: 0; 
	*/
	
	/* this allows the a (timestamp) be a table cell
	 * and the rest of the html defaults to be its own table cell as well*/
	display: table-cell;
	width: 70px;
}
.video-title {
	margin-bottom: 40px;
}
	.video-title h1 {
		margin: 0;
		margin-bottom: 25px;
	}
	
@media (max-width: 1080px) {
	#video-layout {
		display: block;
		margin-top: var(--base-margin)
	}
		.video-holder {
			max-width: initial;
			width: 100%;
			margin-bottom: var(--base-margin);
		}

}

/*============================================================================
 EXHIBITIONS / BLOG
=============================================================================*/

.main-story {
	padding-bottom: 100px;
}
	.main-story iframe {
		background: #000000;
	}
	.post-tags {
		margin-top: 50px;
	}

/*============================================================
  PRESERVATION
============================================================*/

.preservation-intro figure {
	margin-top: 0;
}
.testimonial-holder {
	margin-bottom: 80px !important;
}
.testimonial {
	font-size: 24px;
	font-weight: 600;
	color: #000000;
	line-height: 1.35;
	
}
	.testimonial:before {
		content: '“';
		font-size: 100px;
		display: block;
		margin-bottom: -50px;
		margin-top: -20px;
	}
	.testimonial .quote {
		display: block;
		font-size: 100px;
		font-family: 'Georgia';
	}
.cite {
	margin-top: -10px;
	margin-bottom: 40px;
}

.preservation-features {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin-top: 45px;
}
	.preservation-features .feature {
		width: calc(50% - calc(var(--section-spacing)));
		flex-shrink: 0;
		margin-bottom: 40px;
	}
	.preservation-features .icon {
		margin-bottom: 15px;
	}
	.preservation-features svg {
		width: 48px;
		height: 48px;
		fill: #000000;
	}
.video-formats {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	padding-bottom: 20px;
}
	.video-formats > ul {
		max-height: 280px;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
	}
	
@media (max-width: 1080px) {
	.preservation-intro figure {
		margin-top: 60px;
	}
	.preservation-features {
		display: block;
	}
	.preservation-features .feature {
		width: 100%;
		margin-bottom: 50px;
	}

}

/*============================================================
  ABOUT
============================================================*/

.logo-grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	margin-top: -10px;
	margin-bottom: 50px;
}
	.logo-grid > div {
		width: 9.66%;
		margin: 40px 3.5%;
		flex-shrink: 0;
		height: 100px;
		text-align: center;
	}
	.logo-grid img {
		position: relative;
		top: 50%;
		transform: translateY(-50%);
		margin: 0 auto;
		width: auto;
		max-width: 100%;
		max-height: 110px;		
	}
	.logo-grid:after {
		content: ' ';
	  	flex: 1;
	}

.staff-bios .desc {
	font-size: 16px;
	-webkit-line-clamp: initial !important;
}
.staff-bios .title {
	margin-top: 20px;
	margin-bottom: 10px;
	font-size: 21px;
}

.staff-bios .text-holder a{
	display: inline !important;
	text-decoration: underline;
}

@media (max-width: 1450px) {
	.logo-grid > div {
		width: 15%;
		margin: 40px 5%;	/* percent doubled for spacing */
	}
}

@media (max-width: 1080px) {
	.logo-grid > div {
		width: 19%;
		margin: 40px 7%;	/* percent doubled for spacing */
	}
}

@media (max-width: 710px) {
	.logo-grid > div {
		width: 32%;
		margin: 40px 9%;	/* percent doubled for spacing */
	}
}
	
	
/*============================================================
  DONATE
============================================================*/

.donate-widget {
	margin: 40px 0 40px;
}
		
/*========================================================================
  EVENTS 
=======================================================================*/


/*============================================================================
SAVED LISTS
=============================================================================*/
.warning {
	padding: 15px;
	/*border: 1px solid var(--color-gray-4);*/
	background: #eeeeee;
	margin-bottom: var(--section-spacing);
}

/*============================================================
  FOOTER
============================================================*/

#footer {
	position: relative;
	z-index: 600;
	box-sizing: border-box;
	background: #000000;
	font-size: 14px;
	color: var(--color-gray-2);
}
	#footer a {
		text-decoration: none !important;
		color: var(--color-gray-2);
		opacity: 1 !important;
	}
		#footer a:hover {
			color: var(--color-gray-4);
		}
	.footer-content {
		padding: 35px var(--base-margin) 30px;
		display: flex;
		justify-content: space-between;
	}
	.footer-copyright {
		margin: auto var(--base-margin);
		border-top: 1px dotted rgba(255,255,255,0.3);
		padding: 35px 0;
	}
	.footer-links {
		display: flex;
		justify-content: flex-end;
		gap: 0 30px;
	}
	.footer-social {
		margin-top: 30px;
		text-align: center;
		display: flex;
		justify-content: flex-end;
		gap: 20px;
	}
		.footer-social a {
			opacity: 1 !important;
		}
		.footer-social svg {
			fill: var(--color-gray-2);
		}
			.footer-social a:hover svg {
				fill: var(--color-gray-4);
			}

@media (max-width: 1080px) {

}

@media (max-width: 710px) {
	.footer-content {
		display: block;
	}
	.footer-links {
		display: block;
		margin-top: 30px;
	}
	.footer-social {
		justify-content: flex-start;
	}

}

/*============================================================
  FORMS
============================================================*/

label {
	display: block;
	font-size: 15px;
	color: var(--color-gray-2);
	margin-bottom: 7px;
}
label:hover {
	cursor: pointer;
}
label:has(input[type=checkbox]), label:has(input[type=radio]) {
	color: inherit;
	margin: 0;
}
input[type=text], input[type=password], textarea, input[type=email] {
	appearance: none;
	width: 100%;
	padding: 12px 14px;
	border: 1px solid #bbbbbb;
	font-size: var(--base-font-size);
	font-family: var(--font-tech);
	margin-bottom: 25px;
}
input[type=text]::placeholder, input[type=password]::placeholder, textarea::placeholder {
	color: var(--color-gray-3);
}
textarea {
	min-height: 200px;
}

/* checkbox *********************************************** */

input[type=checkbox] {
	appearance: none;
	display: inline-block;
	margin-right: 10px;
	width: 18px;
	height: 18px;
	border: 1px solid var(--color-gray-1);
	vertical-align: middle; 
	position: relative; 
	bottom: 1px; 
	border-radius: 0;
	
	box-sizing: border-box;
	background-color: transparent;
}
input[type=checkbox]:checked {
	background-size: cover;
	background-color: var(--color-orange);
	border-color: var(--color-orange);
	background-image: url('data:image/svg+xml,<svg width="32" height="32" viewBox="0 0 32 32" fill="%23ffffff" xmlns="http://www.w3.org/2000/svg"><path d="M24 6H28V10H24V6Z" /><path d="M20 14V10H24V14H20Z" /><path d="M16 18V14H20V18H16Z" /><path d="M12 22V18H16V22H12Z" /><path d="M8 22H12V26H8V22Z" /><path d="M4 18V22H8V18H4Z" /></svg>')
}
input[type=checkbox]:disabled {
	border-color: #eeeeee;
	background-color: #eeeeee;
	border-color: var(--color-gray-3);
}
input[type=checkbox]:disabled:checked {
	 background-image: url('data:image/svg+xml,<svg width="32" height="32" viewBox="0 0 32 32" fill="%23aaaaaa" xmlns="http://www.w3.org/2000/svg"><path d="M24 6H28V10H24V6Z" /><path d="M20 14V10H24V14H20Z" /><path d="M16 18V14H20V18H16Z" /><path d="M12 22V18H16V22H12Z" /><path d="M8 22H12V26H8V22Z" /><path d="M4 18V22H8V18H4Z" /></svg>')
}

/* radio *********************************************** */

input[type=radio] {
	appearance: none;
	background-color: #fff;
	margin: 0;
	
	width: 18px;
	height: 18px;
	border: 1px solid var(--color-gray-1);
	border-radius: 50%;
	vertical-align: middle; 
	position: relative; 
	bottom: 1px; 
	margin-right: 10px;
	
	box-sizing: border-box;
	background: transparent center center no-repeat;
}
input[type=radio]:not(:disabled):checked {
	background-size: 12px;
	background-image: url('data:image/svg+xml,<svg height="100" width="100" xmlns="http://www.w3.org/2000/svg"><circle r="45" cx="50" cy="50" fill="%23E26100" /></svg>');
	border-color: var(--color-orange);
}
input[type=radio]:disabled {
	border-color: #eeeeee;
	background-color: #eeeeee;
	border-color: var(--color-gray-3);
}

input[type="radio"]:disabled:checked {
	background-color: #eeeeee;
	background-size: 12px;
	background-image: url('data:image/svg+xml,<svg height="100" width="100" xmlns="http://www.w3.org/2000/svg"><circle r="45" cx="50" cy="50" fill="%23aaaaaa" /></svg>');
	
}

/* button *********************************************** */

button, .button, a.button {
	display: inline-block;
	margin: 0;
	padding: 0;
	appearance: none;
	border-radius: 0;
	border: 0;
	text-decoration: none !important;
	
	font-size: var(--base-font-size);
	font-familY: var(--font-tech);
	background-color: #000000;
	padding: 12px 16px;
	color: #FFFFFF;
}
	button:hover, .button:hover, a.button:hover {
		opacity: 0.7;
		cursor: pointer;
		color: #ffffff;
	}
button.outline, .button.outline, a.button.outline:hover {
	background-color: transparent;
	border: 1px solid var(--color-gray-1);
	color: var(--color-gray-1);
	opacity: 1;
}
button svg, .button svg, a.button svg {
	width: 16px;
	height: 16px;
	fill: var(--color-gray-2);
	position: relative;
	top: 3px;
	margin-right: 6px;
}	
button svg, .button svg, a.button svg {
	fill: #ffffff;
}
button.outline svg, .button.outline svg, a.button.outline svg {
	fill: var(--color-gray-2);
}
	button.outline:hover, .button.outline:hover, a.button.outline:hover {
		cursor: pointer;
		border: 1px solid #000000;
		color: #000000;
	}
	button.outline:hover svg, .button.outline:hover svg, a.button.outline:hover svg {
		fill: #000000
	}
button.outline.orange, .button.outline.orange, a.button.outline.orange {
	border: 1px solid var(--color-orange);
	color: var(--color-orange);
}
	
/*============================================================
  PLUGINS
============================================================*/
.ui-accordion {
	border-bottom: var(--base-border) !important;
	margin-bottom: var(--section-spacing) !important;
}
.ui-accordion .ui-widget-content a {
	color: inherit;
}
	.ui-accordion .ui-widget-content a:hover {
		color: var(--color-orange);
	}
.ui-accordion .ui-accordion-header {
	position: relative;
	padding: 0!important;
	margin: 0!important;
	border-radius: 0!important;
	padding: 15px 0 !important;
	padding-right: 40px !important;
	font-size: 18px !important;
	font-weight: 600 !important;
	color: var(--color-gray-2) !important;
}
	.ui-accordion .ui-state-hover {
		color: #000000 !important;
	}
.ui-accordion .ui-state-default {
	border: none !important;
	border-top: var(--base-border) !important;
	background: transparent !important;
}
.ui-accordion .ui-state-default::before {
	position: absolute;
	top: 19px;
	right: 5px;
	content: '';
    z-index: 50;
	width: 16px;
	height: 16px;
	background: url('img/icon-chevron-down.svg') no-repeat;
	background-size: 100%;
}
.ui-accordion .ui-state-active {
	color: #000000 !important;
}
	.ui-accordion .ui-state-active::before {
		transform: rotate(180deg);
	}
.ui-accordion .ui-accordion-content {
	border: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	
	padding-right: 20px !important;
	font-family: var(--font-tech) !important;
	font-size: var(--base-font-size) !important;
	color: var(--color-gray-1) !important;
	line-height: 1.45 !important;
}
	.ui-accordion .ui-accordion-content .inner {
		padding: 15px 0 0;
		margin-bottom: 40px;
	}
.ui-accordion-header-icon {
	display: none !important;
}


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

#video-results {
	display:flex;
	flex-wrap: wrap;
}

.wp-caption {
    width: auto !important;
	padding:0 !important;
}


.wp-caption-text { 
    display: block;
    padding: 13px 15px;
    /* background: #eeeeee; */
    font-size: 15px;
    color: var(--color-gray-2);
    margin-bottom: -10px;
    text-align: center;
}



.current-lists .inner li a span.saved {
  opacity: 1 !important;
  visibility: visible !important;
  color: gray !important;

}


.current-lists .inner li a span {
  opacity: 1 !important;
  visibility: visible !important;
}


#filters-selected > ul > a:hover {
	
	color:#000 !important;
}

.main-story img {
	max-width: 100%;
	margin: 0 auto;
	width: auto;
}