/*
	(c)2021 - visuallizard.com

	Mobile styles using Media Queries
	*/
	/* Color declarations */
	:root {
	--gold: #ffbc0d;
	--red: #db0007;
	--lavender: #d0c9ff;
	--aqua: #8ee7f8;
	--blue: #1b43b2;
	--lime: #9cd83e;
	--softwht: #fffde9;
	--white: #ffffff;
	--black: #000000;
	}

	/* !Media Queries ============================== */

	/* greater than 1600 (devices and browsers) */
	@media only screen and (min-width: 1601px) {
	}

	/* Smaller than 1600 (devices and browsers) */
	@media only screen and (max-width: 1600px) {
	}

	/* Smaller than 1440 (devices and browsers) */
	@media only screen and (max-width: 1440px) {
	}

	/* Smaller than 1200 (devices and browsers) */
	@media only screen and (max-width: 1200px) {
	body:before { content: 'desktop'; visibility: hidden; }
	}

	/* Smaller than standard 1024 (devices and browsers) */
	@media only screen and (max-width: 1000px) {
	body:before { content: 'large'; visibility: hidden; }
	}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 800px) {
	body:before { content: 'medium'; visibility: hidden; }
	h2, .h2 { font-size: 2.25rem; letter-spacing: normal; }

	/* MOBILE nav */
	.js nav.main-nav {
		max-height: 100vh;
		display: block;
		position: absolute;
		left: -100%;
		left: -100vw;
		top: -1rem;
		width: 100%;
		height: auto;
		min-height: 100vh;
		padding: 4rem 0 0 0;
		margin: 0;
		overflow: hidden;
		transition: transform .2s ease-in;
		z-index: 1000; }
	.js .nav-on nav.main-nav {
		max-height: none;
		transform: translateX(100%);
	}

	.nav-toggle {
		position: absolute;
		top: 0; right: 1rem;
		width: 32px; height: 32px;
		min-width: 0; margin: 1rem 0;
		color: #000; padding: 0;
		border: none; z-index: 1001;
		background: transparent; transition: color .2s;
		flex-shrink: 0;
	}
	.js .nav-on .nav-toggle,
	.js .nav-on .nav-toggle:hover { color: #fff; }

	.js .nav-on main,
	.js .nav-on .site-footer { max-height: 0; overflow: hidden; /* hide content when navigation is open */ }
	nav.main-nav {
		display: block;
		flex: 0 0 100%;
		max-width: 100%;
		z-index: 200;
		font-size: 1rem;
		box-shadow: none;
		background: var(--black);
		color: var(--softwht);
	}
	nav.main-nav .nav-1 { flex: 0 0 100%; max-width: 100%; flex-wrap: wrap; }
	nav.main-nav .nav-1 li { display: block; flex: 0 0 100%; max-width: 100%; }
	nav.main-nav .nav-1 > li > a { text-align: left; color: var(--softwht); }
	/* .main-nav .nav-list,
	.main-nav li > .sub-list { width: 100%; max-height: 9999px; transform: scale(1); transition: max-height .2s ease-in; background: transparent; margin: 0 0 1rem; padding: 0; position: relative; top: auto; left: auto; opacity: 1; visibility: visible; border: none; box-shadow: none; }
	.main-nav .nav-item { border-top: 1px solid rgba(255,255,255,.1); display: flex; flex-wrap: wrap; overflow: hidden; }
	.main-nav .nav-link, .main-nav .nav-1 > .nav-item > .nav-link { -webkit-tap-highlight-color: transparent; width: 100%; border: none; padding-right: 0; } */

	.main-nav .nav-1 > .nav-item[data-nav-status="has-active"] > .nav-link,
	.main-nav .nav-1 > .nav-item[data-nav-status="active"] > .nav-link { color: var(--softwht); }

	.main-nav .has-sub > .nav-link::after { content: none; }

	nav.main-nav .sub-list,
	nav.main-nav li > .sub-list {
		display: none;
		top: auto;
		position: relative;
		width: 100%;
		color: var(--black);
		visibility: visible;
		opacity: 1;
	}
	nav.main-nav li[data-nav-status="has-active"] > .sub-list,
	nav.main-nav li > .sub-list.on {
		display: block;
	}

	.main-nav li > .nav-3 > li { padding-left: 1.5em; }
	.main-nav li > .nav-4 > li { padding-left: 2.5em; }
	.main-nav li > .nav-5 {  }


	.site-title, .org-title { width: 35%; }
	header.site-header ul#snav {
		flex: 0 0 40%; max-width: 40%;
		margin: 0;
		align-self: center;
	}

	main .container { padding: 0 1rem; }
	.sidebar { display: none; }
	.primary { flex-basis: 100%; max-width: 100%; padding: 0; }

	div.announcement-set { flex-wrap: wrap; }
	div.announcement-set div.announcement,
	div.signature-set div.announcement { flex-basis: 100%; max-width: 100%; margin: 0 0 1em 0; }

	.featured-set article { width: 100%; margin: 0 0 1em 0; }

	div.event-set.upcoming div.event-listing { flex-basis: 100%; max-width: 100%; margin: 0 0 1em 0; }

	.feed-set { flex-wrap: wrap; }
	.feed-set .feed { flex-basis: 100%; max-width: 100%; margin: 0 0 1em 0; }

	.cke > .c2,
	.cke > .c3 { width: 100%; margin: 0; }

	.form-block .input-check-option,
	.form-block .input-radio-option { padding: 0; }
	.form-block .input-text label,
	.form-block .input-textarea label,
	.form-block .input-email label,
	.form-block .input-currency label,
	.form-block .input-select label,
	.form-block .input-radio label,
	.form-block .input-checkbox label { margin: 0 0 0.5em 0; font-size: 1rem; line-height: 1.1; }

	footer.site-footer .container.wide { width: 100%; padding: 0 1rem; }
	footer section.footer:nth-child(2) { flex-grow: 1; max-width: 66%; }
	section.footer.navigation ul#navigation-2 { display: none; }
	section.footer.navigation > ul.nav-list > li { flex: 0 0 32%; max-width: 32%; text-align: center; }
	footer section.footer:nth-child(3),
	footer section.footer:nth-child(4) { flex: 0 0 100%; max-width: 100%; }
	footer section.footer:nth-child(4) > div.disclaimer { flex: 0 0 100%; max-width: 100%; }
	footer section.footer:nth-child(4) > p.copyright { flex: 0 0 100%; max-width: 100%; text-align: center; }

	}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 670px) {
	body:before { content: 'small'; visibility: hidden; }
	header.site-header { padding: 1rem 0; }
	.site-header .container { column-gap: 2%; row-gap: 1rem; }
	.site-title { width: 58%; max-height: 200px; background-position: left center; }
	.site-header ul#snav { position: relative; max-width: 40%; }

	.banner-title { font-size: 1.8rem; }
	.banner-subtitle { font-size: 1.4rem; font-weight: 300; }

	.w5, .w10, .w15, .w20, .w25, .w30, .w35, .w40, .w45, .w50,
	.w55, .w60, .w65, .w70, .w75, .w80, .w85, .w90, .w95, .w100 { width: 100%; }

	.sponsor-set#presenting .sponsor { max-width: 60%; padding: 20px; }
	.sponsor-set#gold .sponsor { max-width: 49%; padding: 10px; }
	.sponsor-set#silver .sponsor { max-width: 49%; padding: 10px; }
	.sponsor-set#bronze .sponsor { max-width: 49%; padding: 10px; }
	.sponsor-set#gift .sponsor, .sponsor-set#reception .sponsor, .sponsor-set#wine .sponsor, .sponsor-set#auction .sponsor, .sponsor-set#cart .sponsor, .sponsor-set#print .sponsor { max-width: 49%; padding: 10px; }
	.sponsor-set#forever .sponsor, .sponsor-set#national-lead .sponsor, .sponsor-set#national-mission .sponsor, .sponsor-set#founder .sponsor, .sponsor-set#local .sponsor { max-width: 49%; padding: 10px; }
	.sponsor-set#ten-thousand .sponsor, .sponsor-set#seven-thousand .sponsor, .sponsor-set#five-thousand .sponsor { max-width: 49%; padding: 10px; }

	div.charity-event { padding: 0; }
	div.goal-progress span { width: 100%; }
	div.goal-progress:before { display: none; }
	div.controls a.button { margin: 0 0 10px 0; }

	.form-block { padding: 15px; }
	.form-block .input-text,
	.form-block .input-email,
	.form-block .input-textarea,
	.form-block .input-wysiwyg,
	.form-block .input-currency,
	.form-block .input-select,
	.form-block .input-radio,
	.form-block .input-checkbox { padding: 0.5rem }
	.form-block .input-check-option input[type="checkbox"],
	.form-block .input-checkbox input[type="checkbox"],
	.form-block .input-radio-option input[type="radio"] { transform: none; }
	.form-block form .address-fields { padding: 0; }
	.form-block form .address-fields .input-text,
	.form-block form .address-fields .input-email,
	.form-block form .address-fields .input-select { width: 100%; padding: 0.5rem; }
	.form-block form .g-recaptcha { padding: 0; }

	.site-footer { padding: 1em; }

	}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 520px) {

	.site-header ul#snav { font-size: 0.75rem; }

	.featured-set article h3 { width: 100%; }
	.featured-set article div.article-date { width: 100%; padding: 0.5em 0; border-bottom: 1px solid #999; }
	.featured-set article div.article-date p { text-align: left; }
	.featured-set article div.article-body { padding: 0.5em 0; }

	.feed.video-feature iframe { max-height: 180px; }

	main { padding-top: 0; }
	body.home main { padding: 3rem 0; }

	div.staff { flex-wrap: wrap; flex: 0 0 100%; max-width: 100%; }
	div.staff img { order: 1; flex-basis: 100%; max-width: 100%; margin: 0 0 1em 0; }
	div.staff div.staff-copy { order: 2; flex-basis: 100%; max-width: 100%; padding: 0; }
	div.staff-copy h3 span { display: block; padding: 0.5rem 0 0 0; }

	div.schedule p.calendar-note { display: block; }
	div.schedule div.calendar-widget { display: none; }

	.form-block .input-text,
	.form-block .input-email,
	.form-block .input-textarea,
	.form-block .input-wysiwyg,
	.form-block .input-currency,
	.form-block .input-select,
	.form-block .input-radio,
	.form-block .input-checkbox,
	.form-block .input-check-option,
	.form-block .input-radio-option { width: 100%; }
	.form-block button[type="submit"] { margin: 0; }
	.form-block .input-radio label,
	.form-block .input-checkbox label,
	.form-block .input-check-option > label { width: 100%; line-height: 1.625; }
	.form-block .input-radio > label { line-height: 1.1; margin: 0 0 0.5em 0; }
	.form-block p.input-plaintext-label,
	.form-block .input-select.fm-checkbox-group > label { padding: 0; margin: 0 0 0.5em 0; font-size: 1.25rem; }
	.form-block p.input-plaintext-value { padding: 0; }

	.subscribe .form-block .input-text,
	.subscribe .form-block .input-email { width: 100%; }

	footer section.footer,
	footer section.footer:nth-child(2) { flex: 0 0 100%; max-width: 100%; }
	section.footer.navigation > ul.nav-list > li { text-align: left; }
	ul#fnav { flex-wrap: wrap; flex-basis: 100%; max-width: 100%; padding: 0; }
	ul#fnav li,
	ul#fnav li:first-child { flex-basis: 100%; max-width: 100%; border: none; }

}