#menu-toggle {display: none; width: 32px; padding: 0; margin: 0; background: none; border: 0; cursor: pointer;}
	#menu-toggle img {display: block; width: 32px; height: auto; margin: 0 auto;}

#menu-close {display: none;}

#menu-container {display: none;}
	#menu-container-top {padding: 15px 20px; display: flex; align-items: center; justify-content: space-between;}


@media only screen and (max-width: 1399px) { 

	.container { width: calc(100% - 40px); margin-left:20px; margin-right:20px; }
	
	/* home */
	#home-hero .home-hero-slider-wrap .goal-badge {right: -12px; bottom: 12px;}
	#funding-progress-bottom {flex-wrap: wrap; margin-top: 30px;}
		ul#funding-progress-goals {width: 100%;}
		#funding-progress-bottom .button {margin-top: 25px;}
	
}

	
@media only screen and (max-width: 1023px) {

	h1 { font-size: 64px;}
	
	.view-desktop { display:none; }
	.view-mobile { display:block; }
	.flex-container {display:block;}
	
	#header .container > nav {display: none;}
	
	#menu-toggle {display: flex; align-items: center; justify-content: center;}
		#menu-toggle:hover {opacity: 0.5;}

	#menu-container {
		display: block;
		position: fixed;
		top: 0;
		right: -100%;
		width: 100%;
		max-width: 480px;
		height: 100vh;
		background: #fff;
		z-index: 99999;
		border-left: 1px solid #00000014;
		box-shadow: -8px 0 20px #00000014;
		transition: right 0.3s ease;
		overflow-y: auto;
	}
		#menu-container.open {right: 0;}

		#menu-close {
			border: 0; cursor: pointer; z-index: 2; display: block; width: 24px; height: 24px; padding: 0; margin: 0;
			background: url(../images/icon-close.svg) no-repeat center center; background-size: 24px auto;
		}
			#menu-close:hover {opacity: 0.5;}

		#menu-container nav {margin-top: 30px;}
			#menu-container nav ul {display: block; padding: 0; margin: 0; list-style: none;}
				#menu-container nav ul li {display: block; position: relative; padding: 0 20px; margin: 0; border-bottom: 1px solid #C5C5C5;}
					#menu-container nav ul li a {display: block; padding: 24px 0; color: #000; font-weight: 600; line-height: 26px; text-decoration: none;}
					#menu-container nav ul li a:hover,
					#menu-container nav ul li.current-menu-item > a,
					#menu-container nav ul li.current-page-ancestor > a {color: #4CAAD5;}

				#menu-container nav ul li.menu-item-has-children > a {position: relative; padding-right: 34px;}
					#menu-container nav ul li.menu-item-has-children > a:after {
						content: "";
						position: absolute;
						top: 50%;
						right: 0;
						width: 18px;
						height: 18px;
						background: url(../images/icon-dropdown.svg) no-repeat center center;
						transform: translateY(-50%);
						transition: transform 0.25s ease;
					}

					#menu-container nav ul li.menu-item-has-children.open > a:after {
						transform: translateY(-50%) rotate(180deg);
					}

				#menu-container nav ul li ul {display: none; padding: 0 0 12px 0; margin: -16px 0 0 0;}
					#menu-container nav ul li.open > ul {display: block;}
						#menu-container nav ul li ul li {border-bottom: 0; padding: 0;}
							#menu-container nav ul li ul li a {padding: 8px 0; line-height: 22px; font-weight: 400;}
	
		#menu-container	.button-holder {padding: 20px;}
			#menu-container .button {
				min-width: 132px; padding-left: 20px; padding-right: 20px; text-align: left; font-size: 16px;
				background: #000 url(../images/icon-arrow-right-white.svg) no-repeat calc(100% - 20px) center / 17px 12px;
			}
				#menu-container .button:hover {background-color:#4CAAD5;}
	
	.grid-holder ul.grid {grid-template-columns: repeat(2, minmax(0, 1fr));}
	
	#main-nav {width: 100%;}
	#main-content {width: 100%; padding-top: 50px;}
	
	/* home */
	#home-hero .home-hero-text, #secondary-hero-text {width: 100%; padding: 0; margin-bottom: 30px;}
	#home-hero .home-hero-slider-wrap, #secondary-hero-photo {width: 100%;}
	#home-hero .home-hero-slider-wrap .goal-badge {right: -10px; bottom: -20px;}
	
	ul#funding-progress-goals {flex-wrap: wrap;}
		ul#funding-progress-goals li {width: 100%; margin-top: 10px;}
	
	#home-mid-about .photo-holder {width: 100%; order: 1;}
	#home-mid-about .text-holder {width: 100%; padding: 0; order: 2;}
	
	#home-mid-banner .text-holder, #home-mid-banner .photo-holder {width: 100%;}
	
	#secondary-hero-text {width: calc(100% - 50px); padding: 0}
	#secondary-hero-photo {width: 100%;}
	
}


@media only screen and (max-width: 900px) {
	
	#header .button {display: none;}
	
	.gallery {grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 35px;}
	
	#funding-progress-top {flex-wrap: wrap; gap: 30px;}
	.progress-top-item:first-child {padding-right: 30px; margin-right: 0;}
	.progress-top-item:last-child {width: 100%; margin-left: 0; text-align: left;}
		.progress-top-item:last-child .progress-number,
		.progress-top-item:last-child .progress-subtitle {text-align: left;}

	#funding-progress-bar {margin-top: 35px;}

	/* switch to 3 ticks on tablet and phone */
	#funding-progress-ticks {display: none;}
	#funding-progress-ticks-mobile {display: flex; justify-content: space-between; list-style: none; margin: 12px 0 35px 0; padding: 0;}
		#funding-progress-ticks-mobile li {position: relative; width: 1px; text-align: center;}
			#funding-progress-ticks-mobile .tick-line {display: block; width: 1px; height: 6px; margin: 0 auto 6px auto; background: #C5C5C5;}
			#funding-progress-ticks-mobile .tick-label {display: block; white-space: nowrap; color: #565656; font-size: 11px; transform: translateX(-50%);}
			#funding-progress-ticks-mobile li:first-child .tick-label {transform: translateX(0); text-align: left;}
			#funding-progress-ticks-mobile li:last-child .tick-label {width: 60px; transform: translateX(-100%); text-align: right;}

}


@media only screen and (max-width: 639px) { 

	h1 { font-size: 48px;}
	
	.button {margin: 0 10px 10px 0;}
	#header .button-holder {display:none;}

	.gallery {grid-template-columns: 1fr; gap: 30px;}
	
	.border-box {margin: 30px auto 60px auto; padding: 25px;}
	
	.grid-holder ul.grid {grid-template-columns: repeat(1, minmax(0, 1fr));}
	
	/* home */
	#funding-progress .border-box {margin-bottom: 40px;}

	#funding-progress-top {display: block;}
		.progress-top-item {padding: 0 0 20px 0; margin: 0 0 20px 0; border-bottom: 1px solid #C5C5C5;}
			.progress-number {font-size: 36px;}
			.progress-subtitle {font-size: 11px; letter-spacing: 1px;}
		.progress-top-item:first-child {padding-right: 0; margin-right: 0; border-right: 0; border-bottom: 1px solid #C5C5C5;}
		.progress-top-item:last-child {padding-bottom: 0; margin-bottom: 0; border-bottom: 0;}

	#funding-progress-ticks-mobile {margin: 12px 0 30px 0;}
		#funding-progress-ticks-mobile .tick-label {font-size: 10px;}
		#funding-progress-ticks-mobile li:last-child .tick-label {width: 60px;}

	#funding-progress-bottom {display: block;}
		ul#funding-progress-goals {display: block; margin: 0 0 25px 0; padding: 0;}
			ul#funding-progress-goals li {margin: 0 0 12px 0;}
		#funding-progress-bottom .button {display: inline-block;}
	
	#home-social h2, 	
	#home-mid-about h2 {font-size: 28px;}
	
	.faq-list h3.faq-question {font-size: 18px;}
	
	#bottom-cta-inner h2 {font-size: 42px;}
	
	#funding-progress .border-box {padding: 25px;}
	#funding-progress-ticks-mobile .tick-label {font-size: 10px;}
	#funding-progress-ticks-mobile li:last-child .tick-label {width: 55px;}
	
}