/* Admin Responsive styles */
body::before { left: -100px; position: fixed; font-size: 10px; z-index: -1; }
body.debug::before { left: 0; }

@media (min-width: 1200px) {
	body::before { content: 'x-large'; }

	.colour-banners .banner-text { padding: 2rem; }
	.colour-banners .banner-title { margin: 1rem 0; font-size: 40px; }
}

@media (max-width: 1500px) {
	body::before { content: 'large'; }

}

@media (max-width: 1350px) {
	body::before { content: 'large'; }


	.site-header .social { position: absolute; top: .5rem; right: 2.5rem; }

}

@media (min-width: 900px) and (max-width: 1300px) {

	.main-nav .nav-1 > li { margin-right: 1%; }
	.main-nav .nav-1 > li > a { font-size: 16px; }
	.main-nav #navigation-1-3 > a, .main-nav #navigation-1-4 > a, .main-nav #navigation-1-5 > a { font-size: 18px; }

	.main-nav #navigation-1-10 { position: absolute; right: 1rem; top: 2.5rem; }
	.main-nav #navigation-1-11 { position: relative; top: 1.5rem; }
	.main-nav #navigation-1-11 { min-width: 127px; }
	.main-nav #navigation-1-11 .sub-list { right: 0; }

	.main-nav .mega-thumbs { display: none; }

	.mega .banner { display: none; }

/* 	.site-header:hover { z-index: 100; } */
}

@media (max-width: 900px) {
	body::before { content: 'medium'; }

	.container,
	.site-header-container,
	.featured-banners .banner-container { padding-left: 1rem; padding-right: 1rem; }

	.site-header.site-header { border-bottom: none; background-color: #fff !important; }
	.site-header-container { padding-top: 0; padding-bottom: 0; flex-wrap: wrap; }
	.site-title { max-width: 80%; }


	.mega .banner { display: none; }

	.nav-toggle { width: 48px; height: 48px; min-width: 24px; min-height: initial; margin: 0 0 0 auto; color: #64bbbd; padding: 5px; border: none; z-index: 1001; background: transparent; border-radius: 4px; transition: all .1s; -webkit-tap-highlight-color: transparent; }
	.nav-on .nav-toggle { color: #fff; transform: rotate(90deg); }
	.mobile-nav-toggle { width: 32px; height: 32px; min-width: 0;  margin: 8px 0 0; color: #fff; padding: 2px; border: none; background: transparent; transition: all .2s; -webkit-tap-highlight-color: transparent; }
	.mobile-nav-toggle.blank { height: 26px; }

	.site-title { max-height: none; z-index: 12; }
	.site-title > a,
	.site-title:hover > a,
	.in-area .site-title > a,
	.t-boozoo .site-title > a,
	.t-festival .site-title > a { background-image: url(../img/logo-apc-full.svg); transform: scale(1); transition: none; }
	.nav-on .site-title > a { background-image: url(../img/logo-apc-full-white.svg); transform: scale(1); }
	.site-title img { width: 300px; height: 72px; max-height: 60px; }

	/* MOBILE nav */
	.main-nav { z-index: 100; order: 1; }
	.main-nav .nav-list,
	.main-nav .sub-list { width: 100%; max-height: 1999px; transition: max-height .2s ease-in; }
	.main-nav .nav-item { display: flex; flex-wrap: wrap; overflow: hidden; }
	.main-nav .nav-link { -webkit-tap-highlight-color: transparent; width: 100%; }
	.main-nav .nav-link:hover {  }
	.main-nav .nav-item:hover > .nav-link { opacity: .8; }
	.main-nav .nav-item[data-nav-status="active"] > .nav-link { color: rgba(255,255,255,.5); }

	.main-nav.main-nav .mobile-nav-toggle + .nav-link { width: calc(100% - 32px); -webkit-tap-highlight-color: transparent;  }
	.main-nav.main-nav .mobile-nav-toggle + .nav-link { margin-left: 0; }
/* 	.main-nav .type-node > .mobile-nav-toggle:after { display: block; content: ''; position: absolute; left: 0; top: 0; right: 0; bottom: 0; outline: 1px solid red; width: 100%; height: 100%; } */

	.main-nav .nav-1 { display: block; max-width: 350px; padding: 1rem .5rem 1rem; margin: auto; }
	.main-nav .nav-1 li a { font-size: 16px; color: #fff; padding: 10px 10px; }
	.main-nav .nav-1 > li > a { margin-top: 0; margin-left: 32px; font-size: 22px; font-weight:normal; color: #fff; text-align: left; text-transform: none; }

	.main-nav li > .mega { visibility: visible; opacity: 1; transform: scale(1); position: relative; top: auto; left: auto; background: transparent; box-shadow: none; min-height: 0; padding: 0;  }
	.main-nav .mega-container { padding: 0; }
	.main-nav .mega-figure { display: none; }
	.main-nav .mega-container > .sub-list { width: auto; float: none; margin-left: 2em; }

	.main-nav .sub-list .sub-list { left: auto; display: block; visibility: visible; opacity: 1; transform: scale(1); left: auto; position: static; top: auto; margin: 0; padding: 0; }

	.main-nav .nav-2 > li { padding: 0; /* padding-left: 1.5em; */ position: relative; }
	.main-nav .nav-2 > li a { margin-left: 1rem; font-size: 17px; border-bottom: none; }

	.main-nav .nav-3 > li { padding-left: 1em; }
	.main-nav .nav-3 > li a { padding: 5px 10px; }

	.main-nav .nav-4 > li { padding-left: 2em; }
	.main-nav .nav-5 {  }

	.main-nav .mega-thumbs { display: none; }

	.js         .main-nav { display: block;  width: 100vw; margin: 0 -1rem; height: auto; padding: 0 1rem; border-top: 1px solid rgba(255,255,255,.9); overflow: hidden; transition: all .2s ease-in-out;  z-index: 10; max-height: 0; background-color: transparent; }
	.js .nav-on .main-nav { max-height: 200vh; opacity: 1; padding: 0 0 4rem 0; margin: 1rem -1rem 0; box-shadow: 0 0 50vh 50vh #64bbbd; background-color: #64bbbd; }
	.js .nav-on .main-nav .nav-1 {  margin: auto; }
	.js .nav-on { background-color: #64bbbd; transition: all .2s ease-in-out; }


	.js .nav-on .infobar,
	.js .nav-on main,
	.js .nav-on .site-footer { max-height: 0; padding: 0; overflow: hidden; /* hide content when navigation is open */ }

	.main-nav .toggle-off > .sub-list,
	.main-nav .toggle-off > .nav-list { max-height: 0; transition-timing-function: linear; transition-duration: .1s; }

	.main-nav.main-nav .toggle-on > .sub-list,
	.main-nav.main-nav .toggle-on > .nav-list,
	.home .main-nav .mega-container > .sub-list { transition: max-height .2s ease-in; position: relative; top: auto; left: auto; padding: 0 0 .5rem; visibility: visible; opacity: 1;  background-color: transparent; width: 100%; min-height: 0; float: none; transform: none; }

	.home .main-nav #navigation-1-1 { display: block; } /* Display Home page link */

	.main-nav .toggle-on > .mobile-nav-toggle svg { transition: all .2s; transform: rotate(90deg); }


	.main-nav #navigation-1-3,
	.main-nav #navigation-1-4,
	.main-nav #navigation-1-5 { border-bottom: 1px solid rgba(255,255,255,.9); margin-left: 42px; }

	.main-nav #navigation-1-5 { margin-bottom: 1rem; }

	.main-nav #navigation-1-3 > a,
	.main-nav #navigation-1-4 > a,
	.main-nav #navigation-1-5 > a { font-size: 30px; font-weight: bold; letter-spacing: 0.02em; text-transform: uppercase; }

	.main-nav #navigation-1-3 > .mobile-nav-toggle,
	.main-nav #navigation-1-4 > .mobile-nav-toggle,
	.main-nav #navigation-1-5 > .mobile-nav-toggle { order: 2; margin-top: 5px; width: 50px; height: 50px; padding: 0; transform: scaleX(-1); }

	.main-nav #navigation-1-3 > .mobile-nav-toggle + .nav-link,
	.main-nav #navigation-1-4 > .mobile-nav-toggle + .nav-link,
	.main-nav #navigation-1-5 > .mobile-nav-toggle + .nav-link { width: calc(100% - 50px); }

	.main-nav #navigation-1-3 > .mobile-nav-toggle ~ .nav-link,
	.main-nav #navigation-1-4 > .mobile-nav-toggle ~ .nav-link,
	.main-nav #navigation-1-5 > .mobile-nav-toggle ~ .nav-link { order: 1; }

	.main-nav #navigation-1-3 > .mobile-nav-toggle ~ .sub-list,
	.main-nav #navigation-1-4 > .mobile-nav-toggle ~ .sub-list,
	.main-nav #navigation-1-5 > .mobile-nav-toggle ~ .sub-list { order: 3; }

	.main-nav #navigation-1-3 .nav-2 > li > .mobile-nav-toggle,
	.main-nav #navigation-1-4 .nav-2 > li > .mobile-nav-toggle,
	.main-nav #navigation-1-5 .nav-2 > li > .mobile-nav-toggle { margin-top: 5px; }


	.main-nav #navigation-1-10 { margin-top: 0.5rem; }
	.main-nav #navigation-1-11 { margin-top: 1.5rem; }
	.main-nav #navigation-1-10 > a,
	.main-nav #navigation-1-11 > a { text-align: center; font-weight: bold; text-transform: uppercase; border-radius: 5px; }
	.main-nav #navigation-1-10 > a { color: #009cdc; background-color: #fff; }
	.main-nav #navigation-1-11 > a { color: #dca100; background-color: #fff; }




	.site-header .social { display: flex; flex-direction: column; margin: 2rem auto; max-width: 350px; position: relative; top: auto; right: auto;  }
	.site-header .social > li { margin: 0 .5rem; }
	.site-header .social > li > a { display: flex; align-items: center; column-gap: .25rem; margin-bottom: .5rem; color: #fff; }
	.site-header .social .icon { width: 2rem; height: 2rem; }
	.site-header .social-label { display: block; }


	.nav-on .badges { z-index: auto; }
	.mega .banner > a,
	.badges > .banner > a { right: .25rem; top: -1rem; }


	.infobar-container { padding: 0; }
	.infobar-current { display: none; }
    .infobar-hours { max-width: none; }


	.mapsbar-container { padding: 0;  }
	.mapsbar-title { flex-basis: 100%; padding: .5rem 0; text-align: center; }
	.mapsbar-link { flex-basis: 49.9%; padding: .65em 1em 0.5em; }
	.mapsbar-link .icon { font-size: 32px; }

	.nav-on .mapsbar { display: block; position: fixed; bottom: 0; left: 0; right: 0; transform: none; margin: 0; z-index: 1000;  }
	.nav-on .mapsbar .mapsbar-container { background-color: #fff; border-top: 1px solid transparent; }
	.nav-on .mapsbar .mapsbar-title { display: none; }
	.nav-on .mapsbar .mapsbar-link { background-color: #a9a9a9; }
	.nav-on .mapsbar .mapsbar-link b { color: #fff; }

	.site-footer { padding-top: 0; }
		.footer-logo { display: none; }
		.site-footer .social { display: none; }

	.site-footer .footer-nav-block { }
		.footer-nav { padding: 1rem 0; }
		.footer-nav .nav-1 > li > a { display: none; }
		.footer-nav #navigation-2-100,
		.footer-nav #navigation-2-101,
		.footer-nav #navigation-2-102,
		.footer-nav #navigation-2-114 { display: none; }
		.footer-nav .nav-link { font-size: 16px; }
		@supports ( display: contents ) {
			.footer-nav .nav-2,
			.footer-nav .nav-1 > li { display: contents; }
			.footer-nav .nav-1 { columns: 140px 2; text-align: center; }
			.footer-nav .nav-2 > li > a { padding: .5rem; display: inline-block; }
		}

	.site-footer .land-acknowledgement {  }
	.site-footer .social { width: 60%; top: 0; margin: 1rem auto; }
	.partners-block { padding: 1rem 0; }
/* 	.partners-container { padding: 0 .5rem; } */
	.partner-banners .banner { width: 16%; margin: .5rem 2%; }
	.partner-banners .banner-img { max-width: 100%; }


	/* 	News Articles */
	.article-item { width: 100%; flex-basis: 100%; }
	.article-controls > a { min-width: 20%; font-size: 16px; }

	/* Events */
	.m-events.drilled-in main { margin-top: 0; }
	.events-index > h2 { background: none; box-shadow: none; margin: 1rem 0 .5rem; }

	.events-items .event-item { display: block; margin: 0 0 2.5rem; flex-basis: 100%; }
	.event-figure { margin-right: 0; margin-bottom: 1rem; max-width: 100%; }

	.featured-events .container > h2 { margin-top: 0; padding-top: 1rem; }
	.featured-events .event-img { height: auto; }
	.featured-events .c1 .event-item { display: block; }
	.featured-events .c1 .event-figure { margin-right: 0; }
	.featured-events .cke > div:not(.c-first) { margin-left: 0; }
	/* make featured events look like index: */
	.featured-events  .event-img { object-fit: cover; object-position: center; position: absolute; left: 0; top: 0; transform: translateY(-12.5%); }
	.featured-events .event-figure > a,
	.featured-events .event-figure > .no-link { padding-top: 75%; overflow: hidden; }
	.featured-events .event-figure a:hover .event-img { transform: translateY(-12.5%) scale(1.02); }

	.events-items .pagination-links.see-more { margin-left: auto; }


	/* 	GLs */
	.list-item .cke > div { margin-bottom: 1rem; }

	/* 	Toggles */
	.toggle { width: 1rem; height: 1rem; top: 1.15rem; right: 1rem; }
	.toggle-unit { margin-bottom: .5rem; }
	.toggle-head { padding-left: 1rem; padding-right: 2.5rem; }
	.toggle-head > .toggle-title { font-size: 18px; }
	.is-toggle-on .toggle-details, .toggle-details { padding-left: 1rem; padding-right: 1rem; }
	.faq-toggles { margin-bottom: 1rem; }

	/* 	Docs */
	.document-title { line-height: 1.3; }
	.document-title a .doc-icon { width: 1.5rem; height: 1.5rem; align-self: flex-start; margin-right: .25rem; margin-top: .25rem; }

	/* 	Galleries */
	.galleries > li { width: calc( (100% / 2) - .5rem); }
	.galleries .gallery-title { font-size: 1rem; text-align: left; }
	.gallery-set { margin: 1rem 0; }
	.gallery-set > li { width: calc( (100% / 2) - .5rem); margin-bottom: 1rem; }
	.lightbox-nav { display: none; }
	.mfp-title h2 { font-size: 24px; }
	img.mfp-img { padding: 1.5rem 0; }


	/* Custom Stories */
	.custom-stories { margin-top: 1rem; }

	.featured-banners { margin-bottom: .5rem; }

	.colour-banners .banner-img { min-height: 350px; }
	.colour-banners .banner-text { padding: 1rem 1.5rem; }
	.colour-banners .banner-title { margin-top: 0; font-size: clamp(1.5rem, 3vw, 40px); }
	.colour-banners .banner-subtitle { font-size: clamp(1rem, 1.8vw, 20px); }
	.colour-banners .banner-link .banner-text::after { font-size: 80%; }

	.breadcrumbs { font-size: 16px; }
	.breadcrumbs .brcr-item { margin-bottom: .5rem; }

	main { padding-bottom: 1rem; }

	.content-banners { margin: 1.5rem 0 .5rem; }

	/* Membership */
	.packages-charts { display: none; }

	h1, .h1 { font-size: 34px; }
	h2, .h2 { font-size: 26px; }
	h3, .h3 { font-size: 22px; }
	h4, .h4 { font-size: 16px; }

	.button { font-size: 16px; padding: .5em 1em; }

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

	/* ! Content module columns */
	.cke > .c2,
	.cke > .c3,
	.cke > .c4,
	.cke > .c5,
	.cke > .c6 { float: none; margin-left: 0; }

	.cke > .c2,
	.cke > .c3,
	.cke > .c4,
	.cke > .c5,
	.cke > .c6 { width: auto; }

}

@media (max-width: 600px) {
	body::before { content: 'small'; }

	.colour-banners .banner-img { transform: translateX(0); min-height: 300px; }
	.colour-banners .banner-container { position: static; padding: 1rem 1rem; }
	.colour-banners .banner-text { padding: 0; width: auto; max-width: 400px; }
	.colour-banners .banner-subtitle { }

	.filter-form .row { flex-wrap: wrap; }
	.calendar-widget { flex-basis: 100%; }
	.filter-form { flex-basis: 100%; }
	.filter-form .col { flex-basis: 100%; }
}

@media (max-width: 400px) {
	body::before { content: 'x-small'; }

	.colour-banners .banner-img { min-height: 250px; }

	.featured-banners .banner-container { position: static; background: #64bbbd; padding: .5rem 1rem; }

}