/* =========== 
	Global Styles 
	========== */





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

            video {
                margin: 100px 0 0;
            }
            figure {
                margin: 100px 0 0;
            }
            .blog-container {
                grid-template-columns: 1fr;
            }
            .card-container {
                grid-template-columns: 1fr;
            }
            .card-container__sheets {
                padding: 2rem 0rem!important;
                grid-template-columns: 1fr;
            }
            .card-container__agm {
                padding: 2rem 2rem!important;
                grid-template-columns: 1fr;
            }
            .card-container__agm--main-title {
                grid-column: span 1;
            }
            .card-container__hover_img {
                margin: auto;
            }
            .cart-container__posts {
                padding: 0 0rem;
            }        
            .container0__blurb {
                display: grid;
                grid-template-columns: 1fr;
                gap: 0;
            }
            .container0__caption {
                grid-column: 2/4;
                margin-bottom: 2rem;
            }
            .container0__desc {
                grid-column: 1/3;
                margin: 0 0 2rem 0;
            }
            .container0__event {
                grid-template-columns: 1fr;
                margin-bottom: 2rem;
            }
            .container0__event-info {
                grid-column: span 3;
            }
            .container0__event-blurb {
                padding: 2rem 0;
                grid-template-columns: 1fr;
            }
            .container0__hex1 {
                grid-column: 1/1;
                grid-row: 1/1;
                margin: 1.5rem 0 0;
                max-width: 100px;
            }
            .container0__intro {
                padding: 1rem 1rem;
            }
            .container0__supplier-list {
                grid-template-columns: 1fr;
            }
            .container0__title {
                grid-row: 1/1;
                grid-column: 1/1;
            }
            .container0__welcome {
                display: grid;
                grid-template-columns: 6rem 1fr;
                grid-template-rows: 1fr;
                width: max(313px, 100%);
                gap: 1rem
            }
            .container1 {
                background-color: #FFFBF3;
                padding: 2rem 1rem;
                display: grid;
                grid-template-columns: 1fr;
            }
            .container1__blurb {
                padding: 0 1rem;
            }
            .container1__hex2 {
                grid-column: 1/1;
                grid-row: 1/1;
                margin: 0rem 0 0;
                max-width: 90px;
            }
            .card-container__member-area {
                padding: 2rem 2rem!important;
                grid-template-columns: 1fr;
            }
            .container1__register--member-login {
                grid-template-columns: 1fr;
                display: grid;
                padding-top: 2rem;
            }
            .container1__register--login-form {
                grid-column: 1;
            }
            .map-container2__table td {
                width: 100%;
                padding: .5rem;
                display: block;
            }
            .container1__login-form {
                grid-column: 1;
            }
            .container1__mob--btn {
                color: #fff!important;
                text-align: center;
                font-family: var(--primary-font-fam);
                font-weight: var(--font-weight-500);
                font-size: var(--font-size-200);
                transition-duration: 0.4s;
                cursor: pointer;
                background: var(--orange-600);
                width: 10rem;
                margin-top: 1rem;
                padding: 10px 0;
                border: 0;
                border-radius: 50px;
                margin: 1rem auto 0;
            }	
            .container1__mob--btn:hover {
                background-color: var(--orange-600);
                color: var(--white-100)!important;
            }
            .container1__mob--btn-link {
                color: var(--white-100)!important;
                display: inline-block;
                vertical-align: top;
                width: 100%;
            }      
            .container1__mob--buttons {
                display: grid;
                grid-template-columns: 1fr 1fr;
            } 
            .container1__hero {
                grid-column: 1/2;
                text-align: center;
            }
            .container1__questionaire {
                display: grid;
                grid-template-columns: 1fr;
                align-items: center;
            }
            .container1__questionaire--buttons {
                display: none
            }
            .container1__questionaire--list {
                padding: 0;
            }
            .container2__caption {
                grid-column: 1/3;
                display: grid;
                text-align: center;
                justify-content: center;
                justify-items: center;
                align-items: center;
                width:90%
            }
            .container2__desc {
                font-size: clamp(.9rem, 1vw, 3rem);
            }
            .container0__enquiry--left {
                display: inline-block;
                width:100%;
                vertical-align: top;
                padding-right: 0;
            }
            .container0__enquiry--right {
                display: inline-block;
                width: 100%;
                vertical-align: top;
            }
            .container2__btn {
                margin: 0rem auto 1rem;
            }
            .container2__caption-container {
                width: 100%;
                height: 100%;
                grid-template-columns: 100%;
                background: url(/assets/imgs/pngs/hex3.png);
                background-position: 0 50%;
                background-size: cover;
                align-items: center;
            }
            
            .container2__caption--title {
                padding-bottom: 0;
            }
            .container1__charity {
                display: grid;
                grid-template-columns: 6rem 1fr;
                grid-template-rows: 1fr;
                width: max(313px, 100%);
                gap: 1rem;
                align-items: center;
            }
            .container2__form-container {
                padding: 4rem 1rem;
                grid-template-columns: 1fr;
                gap: 0;
            }
            .container1__inner {
                display: grid;
                grid-template-columns: 100%;
            }

            .container2__join {
                z-index: 0;
                position: absolute;
                top: 0rem;
                width: 99%;
                height: 48vh;
                grid-template-columns: 1fr;
                display: grid;
                background: url(/assets/imgs/pngs/hex3.png);
                background-position: center 0;
                background-repeat: no-repeat;
                background-size: contain;
                margin: 0% 0 0 0;
                align-items: center;
            }
            .container2__join-inner {
                position: relative;
                grid-column: 2/3;
                display: grid;
                text-align: center;
            }
            .container2__join-inner--title {
                font-weight: var(--font-weight-800);
                color: var(--white-100);
                font-size: clamp(1.8rem, 4vw, 8rem);
                line-height: 1.0;
                padding-bottom: 16px;
            }
            .container1__subtitle {
                font-weight: var(--font-weight-500);
                color: var(--black-300);
                font-size: clamp(1.2rem, 3.4vh, 5.6rem);
                line-height: 1.2;
                margin: 0 0 1rem;
                grid-row: 1/1;
                grid-column: 2/2;
            }
            .footer-container {
                grid-template-columns: 1fr;
            }
            .footer-container__links {
                font-size: clamp(.9rem, .9vw, 3rem);
            }
            .footer-container__list {
                display: block;
            }
            .map-container2 iframe {
                width: 100%;
            }
            .spacer {
                min-height: 6rem;
                display: block;
            }
            .swarm-answer img {
                width: 100%;
            }
        }

        @media screen and (min-width: 800px) {
          
            .menu {
                background: rgba(255, 255, 255, .9);
                display: grid;
                grid-template-columns: 2% 30% 66% 2%;
                padding: 1rem 0 ;
            }
            .menu__btn {
                background: var(--orange-400);
            }
            .menu__btn a {
                color: var(--white-100)!important;
            }
            .menu__logo {
                width: 100%;
                max-width: 300px
            } 
            
            .menu__logo-container {
                grid-column: 2 / 2;
                display: grid;
                justify-items: center;
            }
            .menu__member-login {
                display: flex;
                justify-content: flex-end;
                align-items: center;
                background: transparent;
                padding: 0 0 1rem 0;
            }
                nav {
                all: unset;
                position: relative;
                text-align: left;
                transition: none;
                transform: scale(1,1);
                background: none;
                top: 0rem;
                left: initial;
                grid-column: 3 / 4;
                display: grid;
                margin: 0 0 0 0;
                justify-content: end;
                align-content: space-around;
            }
            .nav-toggle:checked ~ nav a {
                color: var(--black-200);
            }
            
            nav a {
              opacity: 1;
              position: relative;
              color: var(--black-200)!important;
            }
            
            nav li a::before {
              content: '';
              display: block;
              height: 2px;
              background: var(--orange-500);
              position: absolute;
              bottom: -.75em;
              left: 0;
              right: 0;
              transform: scale(0, 1);
              transition: transform ease-in-out 250ms;
            }
            
            nav li a:hover::before {
              transform: scale(1,1);
            }
            .nav-toggle-label {
              display: none;
            }
            nav ul {
              display: flex;                
              background: transparent;
            }
            
            nav ul li {
              margin-left: 2em;
              margin-bottom: 0;
            }

          }

