/*
   
   Theme Name: Delaware Humanities 2022
   Text Domain: dh2022
   Author: Zero Defect Design LLC
   Author URI: https://zerodefectdesign.com
      
	*/
	
	/* fonts */
	
	@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400&family=Zilla+Slab:ital,wght@0,400;0,700;1,400;1,700&display=swap');
	
   /* resets */

   *, *::before, *::after { box-sizing: border-box; }
	* { margin: 0; }
   html, body { height: 100%; }
   body { line-height: 1.5; }   
	body > footer { position: sticky; top: 100vh; }
   table { border-collapse: collapse; }
	picture, video, canvas, svg { max-width: 100%; }
	img { display: block; width: 100%; max-width: 100%; height: auto; }
   sup, sub { vertical-align: baseline; position: relative; top: -0.4em; }
   sub { top: 0.4em; }
	p, h1, h2, h3, h4, h5, h6 { overflow-wrap: break-word; }
   input, button, textarea, select { font: inherit; }
	textarea { white-space: revert; }
	
	/* type */
	
	body { font: 400 17px/1.5 'Open Sans', sans-serif; padding-top: 100px; color: #000000; background-color: #F9F9FA; }
	b, strong { font-weight: 700; }
	h1, h2 { font: 700 36px/1.1 'Zilla Slab', serif; margin-bottom: 0.5em; }
	h1.indicator { display: none; }
	h3 { font: 600 22px/1.1 'Open Sans', sans-serif; margin-bottom: 0.75em; color: #EC7B4C; }
	h3 .light, h3.light { font-weight: 400; color: #000000; }
	h3.expanded { line-height: 1.5; }
	h4 { font: 700 24px/1.1 'Zilla Slab', serif; margin-bottom: 0.5em; }
	h5, .moar { font: 600 16px/1.2 'Open Sans', sans-serif; letter-spacing: 1px; margin-top: 0; margin-bottom: 0.5em; text-transform: uppercase; }
	h5 { color: #9dad29; margin: 1.5em 0; }
	p, ol, ul { margin: 1rem 0; color: #444444; }
	ol li, ul li { padding: 2px 0; }
	.cols { clear: right; columns: 3; }
	section { margin: 2em 0 2em 0; }
	body .category { text-transform: uppercase; font-weight: 700; margin-bottom: 1em; }
	.cat-stories { color: #6EC9C3; }
	.date { margin-bottom: 1em; font-weight: 700; }
	.alert, .urgent { color: #FF4D45; }
	.post-list a { font-weight: 700; }
	.post-list .date { font-weight: 400; }
	.post-list .dot { opacity: 0.5; margin: 0.25rem 0; }
	.past-event { display: inline-block; color: #000000; border: 1px solid #000000; padding: 5px 10px; font-weight: bold; }
	.divided { padding-top: 25px; margin-top: 25px; border-top: 2px dotted #999999; }
	
	/* date display */
	
	.datebox { background-color: #000000; color: #FFFFFF; text-align: center; }
	.datebox .weekday, .datebox .month 
	{ 
		font-size: 14px; line-height: 1; text-transform: uppercase; letter-spacing: 1px; padding: 4px 3px 2px 3px; background-color: #8f9d23;
	}
	.datebox .day { font-family: 'Zilla Slab', serif; font-size: 24px; font-weight: 400; line-height: 1; padding: 2px;  }

	/* header */
	
	#hd { position: fixed; top: 0; left: 0; right: 0; background-color: #FFFFFF; box-shadow: 0px 0px 15px rgba(0,0,0,0.2); z-index: 500; }
	#hd .frame { display: flex; gap: 25px; justify-content: space-between; align-items: center; padding-top: 12px; padding-bottom: 8px; }
	#dh img { height: 82px; width: auto; }
	#hd .quicklinks { margin-bottom: 10px; }
	#nav { text-align: right; }
	#hd .social { width: 24px; height: 24px; margin-bottom: 0; opacity: 0.8; }
	#hd .social:hover { opacity: 1; }
	#hd .donate 
	{ 
		display: inline-block; text-decoration: none; text-transform: uppercase; line-height: 24px; letter-spacing: 1px;
		height: 24px; overflow: hidden; border-radius: 12px; padding: 0px 14px; color: #FFFFFF; background-color: #6ec9c3; 
	}
	#hd .donate:hover { color: #FFFFFF; background-color: #255293; }
	
	/* main menu */
	
	#menu, #menu li { list-style-type: none; margin: 0; padding: 0; display: inline-block; position: relative; }
	#menu li a { text-decoration: none; display: inline-block; padding: 8px 15px 8px 0px; font: 700 20px/1 'Zilla Slab', serif; }

	#menu a.searchbtn { padding-right: 0; }
	#menu a.searchbtn svg { height: 20px; width: auto; display: inline-block; position: relative; top: 2px; }
	
	#menu a.navbtn { margin-left: 12px; padding-right: 0; }
	#menu a.navbtn svg { height: 22px; width: auto; display: inline-block; position: relative; top: 3px; }
	
	#menu a.navbtn span, #menu a.searchbtn span { display: none; }
	
   #menu li ul { display: none; position: absolute; z-index: 220; margin: 0px; padding: 0px; list-style-type: none; }
   #menu li:hover ul { display: block; text-align: left; padding-top: 9px; }
	#menu > li.has-submenu:hover::before 
	{ 
		position: absolute; display: block; content: ""; width: 0; height: 0; top: 32px; left: 10px; 
		border-bottom: 15px solid #255293; border-right: 10px solid transparent;
	}
   #menu li ul li { margin: 0px; padding: 0px; list-style-type: none; text-transform: none; display: block; float: none; }
   #menu li ul li a 
   { 
      color: #FFFFFF; display: block; font: 400 15px/1.2 'Open Sans', sans-serif; padding: 7px 10px; 
      background-color: #255293; background-image: none; letter-spacing: 0; margin: -1px 0px; 
		white-space: nowrap;
   }
   #menu li ul li:first-child { border-top: 6px solid #255293; }
   #menu li ul li:last-child { border-bottom: 6px solid #255293; }
   #menu li ul li a:hover { color: #FFFFFF; background-color: #AEC02D; }
	#menu a.post-stories-038-histories { border-bottom: 2px dashed rgba(255,255,255,0.5); }
	
	
	/* quotes */
	
	blockquote { margin: 1.5em 0; }
	blockquote p { margin: 0; background-color: #d4ebe8; padding: 20px; font: italic 400 24px/1.3 'Zilla Slab', sans-serif; color: #0d2724; border-radius: 5px; }
	blockquote cite { width: 100%; text-align: right; display: block; position: relative; padding-top: 20px; font-style: normal; font-weight: 600; }
	blockquote cite::before 
	{ 
		content: ""; width: 0; height: 0; display: block; border-top: 20px solid transparent; border-bottom: 20px solid transparent; 
		border-right: 15px solid #d4ebe8; position: absolute; right: 50px; top: -20px;
	}

	/* links + controls */
	
	a { color: #255293; }
	a.alert { color: #FF4D45; }
	a:hover, a.alert:hover { color: #AEC02D; }
	a.moar 
	{ 
		display: inline-block; float: right; white-space: nowrap; padding-right: 16px; 
		background: transparent url('images/icon-arrow-right.svg') right 55% no-repeat; background-size: 10px auto; 
	}
	footer a { white-space: nowrap; }
	button, select { cursor: pointer; }
	.wp-block-buttons { margin-bottom: 1em; }
	.btn, a.wp-block-button__link, .zdd button.wpforms-submit
	{ 
		text-decoration: none; display: inline-block; white-space: nowrap; font-weight: 400; font-size: 17px; line-height: 1;
		padding: 7px 10px; color: #FFFFFF; background-color: #1C3D6E; text-transform: uppercase; 
		border: 0; cursor: pointer; margin-bottom: 3px; border-radius: 0;
	}
	.zdd button.wpforms-submit
	{
		padding: 7px 10px !important; color: #FFFFFF !important; background-color: #1C3D6E !important; text-transform: uppercase !important; 
		border: 0 !important; border-radius: 0 !important;
	}
	
	
	.btn.ghostbtn { background-color: #FFFFFF; color: #1C3D6E; border: 1px solid #1C3D6E; padding: 6px 9px; }
	.btn:hover, a.wp-block-button__link:hover, .btn.ghostbtn:hover { color: #FFFFFF; background-color: #AEC02D; border-color: #AEC02D; }
	.zdd button.wpforms-submit:hover { background-color: #AEC02D !important; border-color: #AEC02D !important; }
	.secondary .btn { display: block; text-align: center; margin: 1em 0; }	
	a.social 
	{ 
		display: inline-block; width: 30px; height: 30px; margin: 0 4px 8px 0; background-position: center center; 
		background-repeat: no-repeat;	background-size: auto 50%; background-color: #FFFFFF; border-radius: 50%;
	}
	a.social-facebook { background-image: url('images/icon-facebook.svg'); background-color: #4267b2; }
	a.social-instagram { background-image: url('images/icon-instagram.svg'); background-color: #de4472; }
	a.social-linkedin { background-image: url('images/icon-linkedin.svg'); background-color: #058cd7; }
	a.social-soundcloud { background-image: url('images/icon-soundcloud.svg'); background-color: #f25010; background-position: center 45%; }
	a.social-twitter { background-image: url('images/icon-twitter.svg'); background-color: #55acee; }
	a.social-youtube { background-image: url('images/icon-youtube.svg'); background-color: #fa0001; background-size: auto 40%; background-position: 55% center; }
	a.social:hover { background-color: #FF8552; }
	a.social:last-child { margin-right: 0; }
	a.icon-foundant 
	{ 
		display: inline-block; width: 24px; height: 24px; background: transparent url('images/icon-foundant.png') center center no-repeat;
		background-size: 24px 24px; margin: 0px 6px 0px 4px;
	}
	a.icon-foundant:hover { opacity: 0.7; }
	
	/* structure */
	
	body { text-align: center; }
	.frame { padding: 50px; margin: 0 auto; text-align: left; max-width: 1400px; }
	.content { display: flex; gap: 50px; }
	.primary { width: calc(66.667% - 68px); order: 2; }
	.secondary { flex-basis: calc(33.333% - 34px); order: 1; }
	.socials { white-space: nowrap; }
	.content.grantee .primary { order: 1; }
	.content.grantee .secondary { order: 2; }
	.content.grantee .secondary b { color: #EC7B4C; }
	.right, .alignright { float: right; max-width: 33.333%; margin: 0 0 20px 20px; }
	
	/* announcement */
	
	.announce, a.announce { background-color: #FF4D45; color: #FFFFFF; text-decoration: none; display: block; }
	.announce .frame { padding-top: 10px; padding-bottom: 10px; text-align: center; font-weight: 600;  }
	a.announce:hover { background-color: #AEC02D; color: #FFFFFF; }
	a.announce .frame::after 
	{ 
		display: inline-block; width: 18px; height: 16px; background: transparent url('images/icon-arrow-right-reversed.svg') center bottom no-repeat;
		background-size: contain; margin-left: 10px; content: ""; position: relative; top: 2px;
	}
	
	.hero { width: 100%; height: 33.333vw; background-position: center center; background-repeat: no-repeat; background-size: cover; }
	.breadcrumb { margin-bottom: 1em; text-transform: uppercase; font-weight: 400; letter-spacing: 0.1em; }
	.breadcrumb a { text-decoration: none; }
	
	/* mtiles */
	
	.mtiles { display: flex; align-items: flex-start; margin: 30px -10px; }
	.mtiles .mcol { padding: 0 10px; flex-basis: 50%; flex-shrink: 1; flex-grow: 1; }
	.mtile { display: block; width: 100%; opacity: 1; transition: opacity 0.2s; }
	.mtile.inactive { opacity: 0; transition: opacity 0.2s; }
	
   /* calendar */
   
	h1 a, h2 a { text-decoration: none; }
   .controls { float: right; }
   .controls a, .controls span { margin: 0 0 10px 10px; text-decoration: none; }
   .controls svg { height: 24px; width: auto; }
   div.calendar-box { margin: 0px -10px; }
   table.calendar { width: 100%; border-spacing: 10px; border-collapse: separate; }
   table.calendar tr { vertical-align: top;  }
   table.calendar th, table.calendar td { width: 14.286%; }
   table.calendar th { font-size: 125%; text-align: left; border-bottom: 3px solid #000000; }
   table.calendar td { padding: 0; height: 6em; }
   table.calendar td.blank {  }
   table.calendar td h4 { font-weight: 400; padding-top: 10px; border-top: 1px solid #000000; }
   table.calendar td.past h4, table.calendar td.empty h4 { border-color: #CCCCCC; }
   table.calendar td.past h4 { color: #CCCCCC; }
   table.calendar td.today h4 { color: #ff4d45; border-top: 3px solid #ff4d45; padding-top: 8px; font-weight: 700; }
   table.calendar tr:nth-child(1) td h4 { border-top: 0; padding-top: 0px; }
   table.calendar .item { position: relative; margin: 0 0 1em 0; font-size: 90%; font-weight: 400; line-height: 1.2; display: block; }
   table.calendar .item .img { width: 100%; height: 0; padding-top: 56.25%; margin-bottom: 0.5em; background-position: center center; background-repeat: no-repeat; background-size: cover; }
   table.calendar .item .info { font-size: 80%; color: #000000; text-transform: uppercase; margin-top: 0.4em; }
	table.calendar a { text-decoration: none; }
   .label 
   { 
      position: absolute; top: 0; right: 0; display: inline-block; font-size: 90%; color: #FFFFFF; 
      background-color: #000000; padding: 0.1em 0.3em 0.1em 0.3em; font-weight: 400;
   }
   .label.label-stories-histories { background-color: #6EC9C3; }
   .label.label-culture-community, .label.label-culture-diversity { background-color: #AA9EB5; }
	.label.label-health-environment { background-color: #B2C42F; }
	.label.label-media-democracy { background-color: #E0BE2A; }
   .label.label-art-literature { background-color: #1C3D6E; }
   table.calendar .item.no-image { padding-top: 2em; }
   table.calendar .item.no-image .label { left: 0; text-align: right; }
   .listing { display: flex; }
   .listing h4.day { width: 50px; font-weight: 300; }
   .listing a { font-weight: 600; text-decoration: none; }
   table.calendar a.urgent { padding: 5px; color: #FFFFFF; background-color: #ff4d45; }
   table.calendar a.urgent:hover { background-color: #AEC02D; }
	table.event-list h5 { color: #000000; font-weight: 400; padding-bottom: 6px; border-bottom: 1px dotted #000000; }
	table.event-list td { padding-right: 25px; line-height: 1.2; padding-bottom: 6px; }
	table.event-list td:last-child { padding-right: 0px; }
	table.event-list .info { font-size: 90%; opacity: 0.8; margin-top: 6px; }
	table.event-list td a { text-decoration: none; font-weight: 600; }
   .listing .date { font-weight: 300; }
   .listing .label { position: relative; padding: 0.2em; font-size: 75%; line-height: 1; margin: 0px 4px; top: -1px; }
	
	/* landing page */
	
	.cat-health-environment { color: #b2c42f; }
	.cat-culture-diversity, .cat-culture-community { color: #aa9eb5; }
	.cat-stories-histories { color: #6ec9c3; }
	.cat-media-democracy { color: #e0be2a; }
	.cat-art-literature { color: #1C3D6E; }
	
	.cat-icon 
	{ 
		display: block; width: 40px; height: 40px; border-radius: 50%; 
		background-color: #000000; background-position: center center; background-repeat: no-repeat; background-size: auto 60%; 
	}
	
	/* ordinary tiles */
	
	.tiles { display: flex; align-items: flex-start; gap: 50px; flex-wrap: wrap; }
	.tile, a.tile { width: calc(33.333% - 34px); flex-grow: 0; flex-shrink: 0; text-decoration: none; }
	.tile .name { font-size: 20px; line-height: 1.2; font-weight: 600; }
   .tile .info { font-size: 80%; margin-top: 0.75em; color: rgba(0,0,0,0.5);  }
   .tile .img 
	{ 
		width: 100%; height: 0; padding-top: 56.25%; margin-bottom: 0.75em; background-position: center center; background-repeat: no-repeat; background-size: cover; 
		position: relative;
	}
	
	/* upcoming events */
	
	.zone.upcoming-events { background-color: #e3ecf0; }
   .events .tile { position: relative; margin: 0 0 1em 0; font-weight: 600; line-height: 1.2; display: block; }

	.events .tile .img .datebox { position: absolute; bottom: 0; left: 0; background-color: #000000; color: #FFFFFF; text-align: center; }
	.datebox .weekday, .datebox .month 
	{ 
		font-size: 14px; line-height: 1; text-transform: uppercase; letter-spacing: 1px; padding: 4px 3px 2px 3px; background-color: #8f9d23;
		
	}
	.datebox .day { font-family: 'Zilla Slab', serif; font-size: 24px; font-weight: 400; line-height: 1; padding: 2px;  }
   .events .tile .info { text-transform: uppercase; color: #5ba8a3; }
	.events.no-images .tile .img { padding: 0; height: auto; width: 50px; float: left; margin-right: 25px; background-image: none; background-color: transparent; }
	.events.no-images .tile .img .datebox { position: relative; }
	.events.no-images .tile .name { padding-top: 0; }
	
	/* misc home page */
	
	body.home #primary-content { padding: 0; }

	body.home .tiles { margin-top: 35px; }
	body.home .img.slug { background: transparent url('images/slug-event.jpg') center center no-repeat; background-size: cover; }
	
	/* news */
	
	.zone.news .tiles a { font-weight: 600; }
	
	/* program tiles and browser */
	
	.tile-program, .tile-speaker
	{ 
		background-color: #FFFFFF; text-align: center;
		border-right: 1px solid rgba(0,0,0,0.15); border-bottom: 1px solid rgba(0,0,0,0.15);
	}
	.tile .img, .tile-program .img, .tile-speaker .img
	{ 
		width: 100%; height: 0; padding-top: 56.25%; margin-bottom: 0.5em; 
		background: transparent url('images/slug.png') center center no-repeat; background-size: cover; 
	}
	.tile-program .cat-icon, .tile-speaker .portrait, a.item .cat-icon, .events .tile .cat-icon
	{ 
		display: inline-block; position: relative; top: -40px; margin-bottom: -30px; 
		border-right: 1px solid rgba(0,0,0,0.25); border-bottom: 1px solid rgba(0,0,0,0.25); 
	}
	a.item .cat-icon { top: -40px; width: 30px; height: 30px; margin-bottom: -35px; }
	.events .tile .cat-icon { top: -25px; margin-bottom: -4px; }
	.events .tile .name { padding-top: 10px;  }
	
	.tile .portraits { width: 100%; text-align: center; margin-top: -40px; margin-bottom: -15px; }
	.tile .portrait
	{ 
		display: inline-block; width: 120px; height: 120px; border-radius: 50%; 
		background-color: #000000; background-position: center center; background-repeat: no-repeat; background-size: cover; 
	}
	
	.tile-program .cat-icons, a.item .cat-icons, .events .tile .cat-icons { text-align: center; }
	.tile-program .cat-icons .cat-icon, .tile-speaker .portraits .portrait, a.item .cat-icons .cat-icon, .events .tile .cat-icon { margin-left: 2px; margin-right: 2px; }
	.tile h4, .tile-program h4 { margin-top: 0.5em; color: #000000; }
	.tile-program h5 { margin: 0 0 0.2em 0; }
	.tile-program .info { padding: 0 20px 20px 20px; font-size: 15px; }
	.tile a, .tile-program a { text-decoration: none; color: inherit; }
	.tile a:hover .img, .tile-program a:hover .img { opacity: 0.8; }
	
	.icon-health-environment { background-color: #bdd031; background-image: url('images/icon-leaf.svg'); }
	.icon-culture-diversity, .icon-culture-community { background-color: #b39cc7; background-image: url('images/icon-handshake.svg'); }
	.icon-stories-histories { background-color: #6ec9c3; background-image: url('images/icon-book.svg'); }
	.icon-media-democracy { background-color: #e0be2a; background-image: url('images/icon-tv.svg'); }
	.icon-art-literature { background-color: #1C3D6E; background-image: url('#'); }
	.icon-btn { background-position: 5px center; background-size: 20px auto; background-repeat: no-repeat; padding-left: 30px; }
	.icon-btn.icon-culture-diversity, .icon-btn.icon-culture-community { background-color: #aa9eb5; }
	.btn.icon-btn:hover { background-color: #1c3d6e; }
	.browsebar { margin-top: 1em; }

	/* footer */
	
	footer { background-color: #153E6F; color: rgba(255,255,255,0.85); font-size: 90%; clear: right; }
	footer a { text-decoration: none; color: #73A8F9; }
	footer a:hover { color: #FFFFFF; }
	footer .frame { display: flex; gap: 75px; justify-content: space-between; }
	footer .socials { text-align: right; }
	footer .socials span { display: block; }
	footer a.foundant { display: inline-block; text-align: right; margin-top: 5px; }
	footer a.foundant img { width: 120px; height: auto; }
	
	/* masonry tiles */
	
	.mtiles { display: flex; align-items; flex-start; }
	.mtiles .mcol { padding: 0 10px; flex-basis: 50%; flex-shrink: 1; flex-grow: 1; }
	.mtile { display: block; width: 100%; opacity: 1; transition: opacity 0.2s; }
	.mtile.inactive { opacity: 0; transition: opacity 0.2s; }

   
   /* mobile navigation + search modal */
   
   #mobilemenu, #searchmodal { position: fixed; top: 0; right: 0; left: 0; z-index: 99; overflow: scroll; height: 0px; opacity: 0; transition-duration: 0.3s; }
   #mobilemenu { background-color: #1C3D6E; }
	#searchmodal { background-color: #FFFFFF; }
	#mobilemenu .frame, #searchmodal .frame { padding-top: 0px; padding-bottom: 0px; }
   #mobilemenu.active, #searchmodal.active { height: 100vh; opacity: 1; }
   #mobilemenu.active .frame, #searchmodal.active .frame { padding-top: 100px; padding-bottom: 25px; }

   #mobilemenu a { color: #FFFFFF; display: block; font-size: 20px; line-height: 20px; padding: 10px 25px 10px 0; font-weight: 300; text-decoration: none; }
   #mobile-menu { list-style-type: none; margin: 0px; padding: 0px; color: #FFFFFF; }
   #mobile-menu > li { border-bottom: 1px solid rgba(255,255,255,0.33); padding-right: 50px; }
   #mobile-menu > li.menu-item-has-children 
   { 
      background: transparent url('images/icon-down.svg') right 9px no-repeat; background-size: 13px auto; 
      cursor: pointer;
   }
   #mobile-menu > li.menu-item-has-children.expanded { background-image: url('images/icon-up.svg'); }
   #mobile-menu > li > ul { display: none; }   
   #mobile-menu > li.expanded > ul { display: block; list-style-type: disc; margin-bottom: 15px; }
   #mobile-menu > li > ul > li a { font-size: 16px; line-height: 1; padding: 7px 0px; }  
	#menu-item-96 { border-bottom: 1px dashed rgba(255,255,255,0.5); padding-bottom: 10px; margin-bottom: 8px; }
   
   #searchmodal form { white-space: nowrap; display: flex; align-items: flex-end; gap: 10px; margin-top: 25px; margin-bottom: 25px; }
   #searchmodal input:focus { outline: none; }
   #searchmodal input#s 
	{ 
		width: 100%;  background-color: transparent; border: none; border-bottom: 1px solid #666666; 
		color: #000000; font-weight: 400; -webkit-appearance: none; border-radius: 0; -webkit-border-radius: 0px;	
	}
   #searchmodal.active::after 
   { 
      position: fixed; left: 0px; bottom: 0px; right: 0px; height: 100px; z-index: 501;
      content: " "; display: block; background: linear-gradient(to top, rgba(255,255,255,1), rgba(255,255,255,0));
   }

   #autoresults h3 { margin-bottom: 20px; }
	.searchresult { text-decoration: none; display: flex; align-items: center; gap: 15px; margin-bottom: 15px; }
	.searchresult .rthumb 
	{ 
		width: 60px; height: 45px; background: transparent url('images/slug.png') center center no-repeat; background-size: cover; 
		flex-grow: 0; flex-shrink: 0; align-self: flex-start;
	}
	.searchresult .rtitle { font-weight: 600; line-height: 1.2; }
	.searchresult .rtype { font-size: 80%; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; color: #9EAD30; margin-bottom: 2px; }
	.searchresult .rinfo { color: rgba(0,0,0,0.6); }

   /* embedded video player */
   
   .video-container { overflow: hidden; height: 0; padding-bottom: 56.25%; position: relative; margin-bottom: 30px; }
   .video-container iframe { position:absolute; left: 0; top: 0; height: 100%; width: 100%; }

	/* home page zones */

	body.home a { text-decoration: none; }
	body.home a h2, body.home a h1 { color: #000000; }
	.zone .col { flex-basis: 50%; flex-grow: 1; flex-shrink: 1; }
	
	.zones { display: flex; flex-wrap: wrap; }
	.subzone, .subzone-full { width: 100%; min-height: 25vw; background-position: center center; background-repeat: no-repeat; background-size: cover; }
	.subzone-half { width: 50%; }
	.subzone-half .frame { max-width: 700px; }
	@media screen and (min-width: 1401px)
	{
		.subzone-half:nth-child(odd) .frame { margin-left: calc(50vw - 700px); }
		.subzone-half:nth-child(even) .frame { margin-right: calc(50vw - 700px); }
	}
	@media screen and (max-width: 800px)
	{ 
		.subzone .frame { margin: 0; }
		.subzone-half { width: 100%; }
		.subzone-text { font-size: 90%; }
	}	
	
	/* slider */
	
	.slide-container { position: relative; }
	.slider, .slide { width: 100%; display: block; }
	.slide 
	{ 
		position: relative; background-position: center center; background-repeat: no-repeat; background-size: cover; 
		height: 0; padding-top: 50%;
	}
	.slide .caption
	{ 
		position: absolute; bottom: 0; left: 0; right: 0; padding-top: 50px; text-align: center;
		background: linear-gradient(to bottom, rgba(0,0,0,0) 0px, rgba(0,0,0,0.5) 100px, rgba(0,0,0,0.8) 100%); color: #FFFFFF;
	}
	.slide .caption .frame { text-align: center; }
	.slide .title { font: 700 36px/1.1 'Zilla Slab', serif; margin-bottom: 0.25em; }
	.slide .subtitle { font-weight: 600; color: #bdd031; }
	
	/* adaptations for large screens */
	
	 @media screen and (min-width: 1500px)
	 {
		.slide .caption { padding-bottom: 4vw; }
		.slide .title { font-size: 3vw; }
		.slide .subtitle { font-size: 1.5vw; }
	 }

	/* mission + vision */
	
	.mission-vision { background-color: #FFFFFF; position: relative; min-height: 25vw; }
	.mission-vision .frame { display: flex; align-items: flex-start; gap: 0px; z-index: 10; padding-top: 0; padding-bottom: 0; }
	.mission-vision h2 { font-size: 40px; line-height: 32px; }
	.mission-vision h2 small { font-size: 24px; font-weight: 400; }
	.mission-vision p { font-style: italic; font-size: 105%; color: rgba(0,0,0,0.75); }
	
	.mission-vision .col { z-index: 20; }
	.col-mission { padding: 50px 100px 50px 0; color: #FFFFFF; text-shadow: 0 0 15px #764233; }
	.col-mission p { color: #FFFFFF; }
	.col-vision { padding: 50px 0 50px 50px; text-shadow: 0 0 8px #FFFFFF; }
	.bg-vision, .bg-mission { position: absolute; top: 0; bottom: 0; width: 50%; z-index: 5; }
	.bg-mission 
	{ 
		left: 0; right: 50%; background: #f1a35c url('images/bg-speakers.jpg') left top no-repeat; background-size: cover;
	}
	.bg-vision 
	{ 
		left: 50%; right: 0; background: #FFFFFF url('images/bg-voted.jpg') center center no-repeat; background-size: cover; opacity: 0.8;
	}
	body.home a.col-mission h2 { color: #FFFFFF; }
	
	/* tables + sorting */
	
	table.sort th, table.sort td, .wp-block-table td, .wp-block-table th { text-align: left; padding: 5px 12px 5px 5px; }
   table.sort th, .wp-block-table th { color: #FFFFFF; background-color: rgba(21,62,111,0.4); font-weight: 700; text-align: left; cursor: pointer; white-space: nowrap; }
   table.sort tr:nth-child(even) td { background-color: rgba(21,62,111,0.1); }
   .wp-block-table tr:nth-child(odd) td { background-color: rgba(21,62,111,0.1); }
   table.sort tr:last-child td, .wp-block-table tr:last-child td { border-bottom: 1px solid rgba(21,62,111,0.4); }
	.wp-block-table tr:first-child td { border-top: 1px solid rgba(21,62,111,0.4); }
   th.sorting-asc:after { content: " \25BC"; }
   th.sorting-desc:after { content: " \25B2"; }
   th.sorting-asc:after, th.sorting-desc:after { color: #000000; font-size: 16px; line-height: 10px; }
	
	table.grantees { width: 100%; }
	
	/* maps */
   
   #map, #map-single { width: 100%; height: 50vh; }
	.zone.map { margin-bottom: 2em; }
   
   /* map: leaflet */
  
	.map { width: 100%; height: 50vh; }
   .leaflet-container a { color: inherit; }
   .leaflet-popup-content { margin: 0px; padding: 10px 23px 10px 10px; }
   .leaflet-popup-content-wrapper, .leaflet-popup-tip { background-color: #255293; color: #fbd42d; border-radius: 0px; }
	.leaflet-popup-content b { color: #FFFFFF; }
   .leaflet-container a.leaflet-popup-close-button { padding: 0 1px 4px 1px; width: 21px;	height: 17px; color: #FFFFFF; opacity: 0.5; background-color: transparent; }
   .leaflet-container a.leaflet-popup-close-button:hover { color: #FFFFFF; opacity: 1; }
   .leaflet-top, .leaflet-bottom { z-index: 401; }
   .reversed .leaflet-control-zoom a { background-color: #000000; }
   .leaflet-control-zoom a:hover { background-color: #999999; }
   .leaflet-container .leaflet-control-attribution, .leaflet-container .leaflet-control-scale { font-size: 10px; }

   .map-marker { text-align: center; color: #FFFFFF; font-size: 14px; line-height: 15px; }
   .map-marker::before
   { 
      display: block; content: ''; background-color: #ff4d45; width: 29px; height: 29px; position: relative; top: 2px; left: -1px; z-index: -2; 
      margin-bottom: -20px; border: 1px solid #FFFFFF;
      border-top-left-radius: 50%;  border-top-right-radius: 50% 100%; border-bottom-left-radius: 100% 50%; border-bottom-right-radius: 0%; 
      -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg);
   }
   .map-marker.lit::before { background-color: #ff4d45; }
   .infowindow 
   { 
      width: 200px; height: 150px; position: relative; display: block; color: #FFFFFF; 
   }
   .infowindow span 
   { 
      position: absolute; bottom: 0px; left: 0px; display: inline-block; font: 400 14px/16px 'Libre Franklin', serif;
      padding: 8px 8px 5px 8px; background-color: rgba(255,255,255,0.9); 
   }
   .infowindow a, .reversed .infowindow a { font-weight: 700; color: #678884; text-decoration: none; border: 0; }
   .infowindow a:hover, .reversed .infowindow a:hover { color: #ff4d45; }
	
	/* media + text */
	
	.frame .wp-block-media-text { grid-template-columns: 300px 1fr; margin: 1rem 0; }
   @media screen and (max-width: 600px) { .frame .wp-block-media-text .wp-block-media-text__content { padding: 25px 0 15px 0; } }
	
	/* expanding lists using details + summary */
	
	details { border-bottom: 1px dotted #000000; }
	details:first-of-type { border-top: 1px dotted #000000; }
	details:last-of-type { margin-bottom: 2rem; }
	details summary 
	{ 
		list-style-type: none; padding: 10px 30px 10px 0; font-size: 115%; font-weight: 600; color: #255293; display: block; 
		background: transparent url('images/icon-down-green.svg') right center no-repeat; background-size: auto 22px;
		cursor: pointer;
	}
	details[open] summary { background-image: url('images/icon-up-green.svg'); }
	details summary:hover { color: #AEC02D; }
	details p { margin-left: 2rem; }
	details h5 { margin-top: 0; }
	
	/* graphic header */
	
	.graphic-hd { position: relative; width: 100%; height: 25vw; margin-bottom: 25px; }
	.graphic-hd-bg 
	{
		position: absolute; top: 0; left: 0; right: 0; bottom: 0;
		background-position: center center; background-repeat: no-repeat; background-size: cover; 
	}
	.graphic-hd-overlay { position: absolute; bottom: -25px; left: 0; right: 0; padding-top: 0; padding-bottom: 0; }
	.graphic-hd-overlay h2 
	{ 
		display: inline-block; margin: 0; color: #FFFFFF; padding: 10px 25px; font-weight: 600; font-size: 66px;
		line-height: 1.2; 
	}
	.graphic-hd-overlay p 
	{ 
		margin: 20px 0 0 0; color: #FFFFFF; padding: 25px; font-size: 22px; line-height: 1.3; 
		display: block; max-width: 50%; 
	}
	.graphic-hd-accent 
	{ 
		position: absolute; top: 0px; left: 0px; height: 50px; width: calc(50vw - 660px); 
	}
	@media screen and (max-width: 1420px) 
	{ 
		.graphic-hd-accent { width: 50px; } 
		.graphic-hd-overlay h2  { font-size: 56px; }
		.graphic-hd-overlay p { font-size: 20px; }
	}
	@media screen and (max-width: 1100px) 
	{ 
		.graphic-hd-accent { height: 25px; } 
		.graphic-hd-overlay h2  { font-size: 46px; padding: 5px 18px; }
		.graphic-hd-overlay p  { max-width: 100%; font-size: 18px; padding: 18px; }
	}
	@media screen and (max-width: 800px) 
	{
		.graphic-hd { height: auto; margin-bottom: -25px; }
		.graphic-hd-bg { position: relative; width: 100%; height: 25vw; }
		.graphic-hd-accent { display: none; }
		.graphic-hd-overlay { position: relative; top: -25px; }
	}
		
	
   /* wp admin bar */
   
   body.admin-bar #hd { top: 32px; }
	body.admin-bar #mobilemenu.active .frame, body.admin-bar #searchmodal.active .frame { padding-top: 150px; }
		
   @media screen and (max-width: 781px) { body.admin-bar #hd { top: 46px; } }
	
   /* responsive breakpoints */

   @media screen and (max-width: 1500px)
   {
		.col-mission { padding-right: 50px; padding-top: 25px; }
		.col-vision { padding-left: 50px; padding-top: 25px; }
		.bg-vision { opacity: 0.5; }
	}
	
   @media screen and (max-width: 1000px)
   {
		.content { gap: 50px; }
		footer .frame { flex-wrap: wrap; gap: 20px; }
		footer .socials { text-align: left; order: 1; width: 100%; }
		footer .info { order: 2; width: 100%; }
		#dh { display: block; width: 82px; height: 82px; background: transparent url('images/dh-alt.svg') left center no-repeat; background-size: contain; }
		#dh img { display: none; }
		#mainmenu a { padding-right: 8px; }
		.mission-vision p { font-size: 90%; color: #000000; }
		.col-mission p { color: #FFFFFF; }
		.bg-mission { background-position: top right; }
		.cols { columns: 2; }
   }  
	
   @media screen and (min-width: 801px) { .mobileonly { display: none !important; } }
   @media screen and (max-width: 800px)
   {
		.nomobile { display: none !important; }
		body { padding-top: 60px; }
		
		.frame { padding-left: 25px; padding-right: 25px; }
		.content { flex-wrap: wrap; gap: 25px; }
		.primary, .secondary { flex-basis: 100%; }
		
		.right, .alignright { float: none; max-width: 100%; margin-left: 0; }
		
		#hd .frame { padding-top: 6px; padding-bottom: 4px; }
		#dh { height: 50px; width: 50px; }
		#hd .quicklinks { display: none; }
		#hd #menu li { display: none; }
		#hd #menu li.search, #hd #menu li.mobilenav { display: inline-block; }
		
		.tile, a.tile, body.home .tile { width: calc(50% - 50px); }
		body.home .tile:last-child { display: none; }
		body.home a.moar { display: none; }
		
		.mission-vision .frame { flex-wrap: wrap; padding-left: 0; padding-right: 0; }
		.mission-vision .frame .col { flex-basis: 100%; padding: 25px; }
		.mission-vision .col-mission { background: #f1a35c url('images/bg-speakers.jpg') center center no-repeat; background-size: cover; }
		.mission-vision .col-vision { background: #FFFFFF url('images/bg-voted.jpg') center 35% no-repeat; background-size: cover; }
		.bg-mission, .bg-vision { display: none; }
		
		table.calendar .item { font-size: 75%; }
		
		.frame .wp-block-media-text { grid-template-columns: 150px 1fr; }
   }  
   
   @media screen and (max-width: 550px)
   {
		.tiles { gap: 25px; }
		.tile, a.tile, body.home .tile { width: 100%; }
		h1, h2, .mission-vision h2 { font-size: 30px; line-height: 1; }
		footer { font-size: 75%; }
	
		.slide .caption { padding-top: 0; }
		.slide .caption .frame { padding-top: 25px; padding-bottom: 25px; }
		.slide .title { font-size: 30px; line-height: 1; }
		.slide .subtitle { font-weight: 600; color: #bdd031; }
		h1, h2, .mission-vision h2 { font-size: 30px; line-height: 1; }
		
		.lSSlideOuter .lSPager.lSpg { display: none; }	
		
		.cols { columns: 1; }
	}
	
	/* access */
	
	.screenreader-text {  position: absolute; left: -999px; width: 1px; height: 1px; top: auto; }
	.screenreader-text:focus { color: black; display: inline-block; height: auto; width: auto; position: static; margin: auto; }
	
   /* print */

   @media print
   {
		body { font-size: 11pt; padding-top: 0; }
		body::before 
		{ 
			display: block; content: "DELAWARE HUMANITIES"; margin: 0 0 0.5em 0; padding: 0 0 0.5em 0; border-bottom: 1px dotted #000000; 
			text-align: left; font-weight: 300; 
		}
		#hd, .hero, footer .socials, div.img, div.cat-icon , .tile .label { display: none; }
		footer { background-color: transparent; color: #000000; border-top: 1px dotted #000000; }
		.frame { padding-left: 0; padding-right: 0; }
		
		.col-mission, .col-mission p { color: #000000; text-shadow: none; }
	
   }