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

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


            .intro__about-content {
                grid-template-columns: 1fr;
                width: 80%;
            }
            .bullets {
                display: block;
                width: 90%;
                grid-template-columns: 1fr;
                /* margin: 0 auto 4rem; */
            }
            .bullets__title {
                text-align: center;
            }

            .container__benefits--benefits-wrapper {
                grid-template-columns: 1fr;
            }
            .reviews__desc-wrapper {
                grid-template-columns: 1fr;
            }
            .masthead__video {
                height: auto;
                overflow: hidden;
            }
            .masthead__caption-container {
                display: none;
            }
            .cards {
                grid-template-columns: 1fr;
            }
            .intro__contact-content {
                grid-template-columns: 1fr;
                width: 80%;
                padding: 2rem ;
                margin: 0 auto 0;
                justify-items: left;
            }


            /* ====================== 
	Container
	===================== mast */
	.container__contact--form-wrapper {
        background-image: none!important;
		background: var(--black-200);
	}
    .container__about--right {
        grid-column: 1;
        margin-bottom: 2rem
    }
    .container__social-housing--100 {
        display: block;
        padding: 2rem;
        grid-column: span 2;
        text-align: center;
    }
    .container__grant {
        padding: 2rem 0;
        grid-template-columns: 1fr;
    }
    .container__grant--blurb {

        padding: 0 2rem 2rem 2rem;
    }
    .container__grant--right {
        padding: 0 2rem;
        grid-column: 1;
    }


    #pjWrapperStivaBlogSidebar .pjSbContainer .recent-widget .post {
        width: 100%!important;
        display: inline-block;
        margin: 0 10px;
        background: rgba(255, 255, 255, 0.2);
    }


    .container__social-housing {
        padding: 2rem 0;
        grid-template-columns: 1fr;
    }
    .container__social-housing--blurb {
        padding-bottom: 2rem;
    }
    .container__social-housing--right {
        padding: 0 2rem;
        grid-column: 1;
    }
    
    .container__privacy--blurb {
        padding: 2rem;
    }
	.container__mast--about {
		height: 30vh;
	}
	.container__mast--services {
		height: 30vh;
	}
	.container__mast--social-housing {
		height: 30vh;
	}
    .container__mast--grant {
        height: 30vh;
    }
	.container__mast--cav-wall-in {
		height: 30vh;
	}
	.container__mast--internal-wall-in {
		height: 30vh;
	}
	.container__mast--cav-wall-ex {
		height: 20vh;
	}
	.container__mast--caption-container#cwe {
		height: 28%;
	}
	.container__mast--retrofit {
		height: 30vh;
	}
	.container__mast--loft-insulation {
		height: 30vh;
	}

	.container__mast--caption-container {
		height: 36%;
	}


            .footer-container {
                grid-template-columns: 1fr;
            }
            .footer-container__links {
                font-size: clamp(.9rem, .9vw, 3rem);
            }
            .footer-container__list {
                display: block;
            }
    
            .card-container {
                grid-template-columns: 1fr;
                padding: 1rem!important;
            }
            .container__form-wrapper {
                background-image: url(/assets/imgs/jpgs/banner4.jpg);
                background-size: 100%;
                background-repeat: repeat-y;
                background-position-x: center;
                z-index: 1;
                position: relative;
                padding: 1rem;
                display: grid;
                grid-template-columns: 1fr;
                gap: 5%;
            }
            .container__intro {
                padding: 2rem 1rem 0;
                position: relative;
                background-color: var(--white-100);
                display: grid;
            }
            .carousel-caption {
                margin: 0 0 1rem!important;
                width: 72%;
             }
             .container__contactAlt--form-wrapper {
                z-index: 1;
                position: relative;
                padding: 2rem;
                display: grid;
                grid-template-columns: 1fr;
                gap: 5%;
            }
            .container__about {
                padding: 2rem 0rem 0;
                grid-template-columns:1fr;
            }
            
            .container__about--title {
                font-size: clamp(2.0rem, 2vw, 6rem);
            }
            .container__about--title:after {
                width: 100%;
            }
            .container__services {
                padding: 2rem 0;
                position: relative;
                background-color: var(--white-100);
                display: grid;
            }
            .container__services--blurb {
                display: grid;
                grid-column: 1;
                text-align: center;
                padding: 0 1rem;
            }
            .container__loft-insulation--blurb {
                display: grid;
                grid-column: span 2;
                text-align: center;
                padding: 2rem;
            }
            .container__loft-insulation {
                padding: 2rem 0;
                position: relative;
                background-color: var(--white-100);
                display: grid;
                grid-template-columns: 1fr;
                background-image: url(../imgs/pngs/bgAlt.png);
            }
            .container__loft-insulation--left {
                padding: 0 2rem;
                display: grid;
                grid-column: span 2;
            }
            .container__loft-insulation--right {
                padding: 0;
                grid-column: span 2;
            }
            .container__retro {
                padding: 2rem 0 0;
                position: relative;
                background-color: var(--white-100);
                display: grid;
                grid-template-columns: 1fr;
                background-image: url(../imgs/pngs/bgAlt.png);
            }
            .container__retro--right {
                padding: 0 2rem;
                grid-column: 1;
            }
            .container__home {
                padding: 2rem 0rem 0;
            }
            .container__strap {
                background-color: var(--green-200);
                display: grid;
                padding: 1rem 3rem;
                justify-content: center;
                margin-top: 2rem;
            }

            .container__testimonial--right {
                grid-column: 1;
            }
            .container__contact--form-wrapper {
                background-image: url(/assets/imgs/jpgs/banner4.jpg);
                background-size: 100%;
                background-repeat: repeat-y;
                background-position-x: center;
                z-index: 1;
                position: relative;
                padding: 4rem 0;
                display: grid;
                grid-template-columns: 1fr;
                gap: 5%;
            }
            #pjWrapper .pjBlArticle .pjBlArticleHead .pjBlArticleTitle {
                font-family: var(--headings-font-fam)!important;
                font-size: var(--font-size-400)!important;
                font-weight: var(--font-weight-700)!important;
            }
            .container__eligibility--form-wrapper {
                width: 90%;
                margin: auto;
            }
            .container__retro {
                padding: 2rem 0rem 0;
            }
            .container__internal-wall-in {
                padding: 2rem 0rem 0;
                position: relative;
                background-color: var(--white-100);
                display: grid;
                grid-template-columns: 1fr 1fr;
                background-image: url(../imgs/pngs/bgAlt.png);
            }
            .container__internal-wall-in--left {
                padding: 0 2rem;
                display: grid;
                grid-column: span 2;
            }
            .container__internal-wall-in--right {
                padding: 0 2rem;
                grid-column: span 2;
            }
            .container__cav-wall-ex {
                padding: 2rem 0;
                grid-template-columns: 1fr;
            }
            .container__cav-wall-ex--blurb {
                padding: 0 2rem 2rem;
            }
            .container__cav-wall-ex--right {
                padding: 0 2rem;
                grid-column: 1;
            }
            .container__cav-wall-ex--title {
                font-size: clamp(1.6rem, 2vw, 6rem);
            }
            .container__cav-wall-ex--subtitle {
                font-size: clamp(1.4rem, 2vw, 6rem);
            }
            .container__cav-wall-in {
                padding: 2rem 0 0;
                grid-template-columns: 1fr;
            }
            .container__cav-wall-in--title {
                font-size: clamp(1.6rem, 2vw, 6rem);
            }
            .container__cav-wall-in--subtitle {
                font-size: clamp(1.4rem, 2vw, 6rem);
            }
            .container__cav-wall-in--right {
                padding: 0 2rem 2rem;
                grid-column: 1;
            }
            .container__cav-wall-in--right img {
                width: 100%;
                margin: 0 auto 0;
            }
            .container__cav-wall-in--blurb {
                padding: 0 2rem 2rem;
            }
            .container__GBIS {
                padding: 2rem 2rem 0;
            }
            .container__mast--GBIS {
                background: url(../imgs/jpgs/banner16.jpg);
                background-size: cover;
                height: 30vh;
                background-repeat: no-repeat;
            }
            .container__GBIS--right {
                grid-column: 1;
            }
            .menu {
                background: #fff;
                position: relative!important;
                padding: 1rem;
                width: auto;
            }
            .menu__logo {
                width: 70%;
                max-width: 300px;
                padding: 1rem 0 1rem 1rem;
            }
            .menu__logo-container {
                justify-items: start;
            }
            .menu__top-links {
                display: none;
            }
            nav a {
                color:var(--black-200)!important;
            }   
            .nav-toggle-label span, .nav-toggle-label span::before, .nav-toggle-label span::after {
                background: var(--black-100);
            } 
            nav ul {
                background: rgba(255, 255, 255, 1.95)!important;
                margin: 0;
                padding: 0 0 1rem;
                list-style: none;
                text-align: center;
            }
            nav ul li {
                margin: 0;
               padding: 2rem 0;
            }
            .spacer {
                min-height: 6rem;
                display: block;
            }
        }

        @media screen and (min-width: 800px) {
          
            .menu {
                background: rgba(255, 255, 255, 1.9);
                display: grid;
                grid-template-columns: 2% 30% 68% 0;
                position: relative;
                z-index: 100;
            }
            .menu__logo {
                width: 100%;
                max-width: 300px
            } 
            .menu__icon {
                display: inline-block;
            }
            .menu__logo-container {
                grid-column: 2 / 2;
                display: grid;
                justify-items: center;
                align-items: center;
            }
            .menu__top-links {
                display: flex;
                justify-content: flex-end;
                align-items: center;
                background: transparent;
                padding: 0 0 2rem 0;
            }
            .menu__top-links ul {
                display: flex;
                align-items: center;
                padding: 0
            }
            .menu__top-links ul li {
                display: flex;
                align-items: center;
            }
            .menu__top-links img {
                width: 20px;
                margin: 0 6px;
            }
            .menu__top-links a:hover {
                text-decoration: none;
              }

                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;
                padding: 48px 0;
            }
            nav li a::after {
                content: '';
                display: block;
                height: 360%;
                background: var(--blue-100);
                position: relative;
                transform: scale(0, 1);
                transition: transform ease-in-out 100ms;
                top: -66px;
                width: 100%;
                text-align: center;
                z-index: -1;
            }            
            nav li a:hover::after {
              transform: scale(1,1);              
            }
            nav li a::before {
                content: '';
                display: block;
                height: 5px;
                background: var(--red-200);
                position: relative;
                transform: scale(0, 1);
                transition: transform ease-in-out 100ms;
                top: 61px;
                width: 100%;
                text-align: center;
            }            
            nav li a:hover::before {
              transform: scale(1,1);
              
            }
     
            .nav-toggle-label {
              display: none;
            }
            nav ul {
                display: grid;
                background: transparent;
                grid-template-columns: repeat(6, 130px);
                height: 3rem;
                justify-content: end;
                align-content: space-evenly;
                height: 100%;
            }
            nav ul li {
                border-left: 1px solid #ccc;
                margin-bottom: 0;
                padding: 38px 0;
            }

          }

