html{--12px:0.75rem;--14px:0.875rem;--15px:0.9375rem;--16px:1.0rem;--17px:1.0625rem;--18px:1.125rem;--20px:1.25rem;--24px:1.5rem;--28px:1.75rem;--32px:min(2rem,42px);} a{position:relative} .ccpaNotice i{letter-spacing:0;} .visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0} a:has(.visually-hidden){position:relative} a:has(.visually-hidden)::after{content:none} /* fallback for links without a hard-coded span:screen-reader-only text,revealed as a tooltip on keyboard focus */ a[target="_blank"]:not(:has(.visually-hidden))::after,a[href^="tel:"]:not(:has(.visually-hidden))::after,a[href^="mailto:"]:not(:has(.visually-hidden))::after,a[href$=".pdf"]:not(:has(.visually-hidden))::after{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0} a[target="_blank"]:not(:has(.visually-hidden))::after{content:" (Opens in new window)"} a[href^="tel:"]:not(:has(.visually-hidden))::after{content:" (Dials this phone call)"} a[href^="mailto:"]:not(:has(.visually-hidden))::after{content:" (Opens email client)"} a[href$=".pdf"]:not(:has(.visually-hidden))::after{content:" (PDF opens in new window)"} a:focus-visible .visually-hidden,a[target="_blank"]:not(:has(.visually-hidden)):focus-visible::after,a[href^="tel:"]:not(:has(.visually-hidden)):focus-visible::after,a[href^="mailto:"]:not(:has(.visually-hidden)):focus-visible::after,a[href$=".pdf"]:not(:has(.visually-hidden)):focus-visible::after{clip:auto;clip-path:none;width:max-content;height:auto;margin:0;overflow:visible;position:absolute;left:50%;bottom:calc(100% + 6px);transform:translateX(-50%);white-space:nowrap;background:#fff;color:#000;font-size:0.75rem;font-weight:400;font-family:sans-serif;text-align:center;text-transform:none;letter-spacing:0;padding:4px 8px;border-radius:4px;border:1px solid #000;z-index:999} .a8bmark a:focus-visible .visually-hidden,.a8bmark a:not(:has(.visually-hidden)):focus-visible::after{left:auto;right:0;transform:none} .jump{position:absolute;top:0;left:150px;padding:10px 20px;border-width:1px;border-color:#ff9a1f;border-style:none solid solid;transform:translateY(-200%);font-weight:bold;font-size:var(--16px);border-radius:0 0 5px 5px;margin:0 !important;z-index:999;background-color:#fff} :is(.jump,.jumpside,.jumpfoot):focus-visible{transform:translateY(0%)} :is(a,input[type=submit],.wrap,button):focus-visible{outline-style:solid;outline-width:2px;outline-color:#000;outline-offset:4px;border-radius:3px;transition:all .3s linear .01s;} :is(.hero .wrap,footer .wrap,.hero a,footer a,nav a,footer button):focus-visible{outline-color:#fff} :is(footer .alt,.a8bmark,.hero .grid>div:last-of-type) a:focus-visible{outline-color:#000 !important} :is(nav a,footer .wrap):focus-visible{outline-offset:-5px !important;border-radius:12px !important} main:focus-visible{outline-offset:-4px;outline-style:inset;outline-width:4px;outline-color:#666} .jumpside,.jumpfoot{position:absolute;background-color:#fff;padding:6px 10px;margin:5px;transform:translateY(-150%)} .jumpside{left:10px;top:10px;padding:5px 10px;margin:5px;} .jumpfoot{right:8px;} footer .wrap{outline-offset:-5px} html{scroll-padding-top:150px;scroll-padding-bottom:100px;} *{scroll-behavior:smooth} body{font-family:'Red Hat Display',Arial,Helvetica,sans-serif;line-height:1.5;text-align:center;min-width:320px;} body,.hero .grid>div:last-of-type h2,.hero .grid>div:last-of-type p,aside a,.report a{color:#403d39;} body,header ul,.hero h1{padding:0;margin:0;} .hero p{margin:0;padding:15px 0} h1,h2,h3,h4,h5,h6,p,th,td,dd,dt,li,blockquote{text-align:left;} h1,.home h2,h2.important,header a,header button,aside h2{color:#246c4f;} img,iframe{max-width:100%;height:auto;display:block;margin:0 auto} iframe{display:block;aspect-ratio:auto 16 / 9;width:100%;margin:1em auto;} .fullwidth{width:100%;} a img,iframe{border:none;} a:hover{transition:ease-in-out .3s;} header a:hover,.btn,.btn:hover{text-decoration:none;} header a:hover{color:#f47621;} main a,.jumpfoot,.embeds a span{color:#246c4f;text-decoration-color:#FFBB33;text-decoration-thickness:1px;font-weight:bold;} /* buttons carry their own colour (#403d39 on #FFBB33,6.38:1);the green link colour failed 1.4.3 at 3.72:1 on the amber fill */ .embeds a span{text-decoration-line:underline;display:block} a:hover,.embeds a:hover span{text-decoration:underline;text-decoration-thickness:1px;} a,a:hover,.embeds a:hover span{text-underline-offset:4px} .embeds h2{margin-top:0} hr{border-width:1px;border-color:#e7e7e7;border-style:none none solid;margin:40px 0;} .imgLeft,.imgRight{max-width:45%;} .imgLeft{float:left;margin:10px 4% 2% 0;} .imgCenter{display:block;margin:0 auto;} .imgRight{float:right;margin:10px 0 2% 4%;} .imgRight>img{margin:0 auto} .clear{clear:both;} .nowrap,a[href^=tel]{white-space:nowrap;} .hide{display:none;} sup{line-height:0;} .center,.ccpaNotice,.hero p,.hero .grid>div:last-of-type h2,.cta h2,.cta li,.smarthub .features p,.smarthub .start h2,.smarthub .start h3,.smarthub .start p,.smarthub .support h2,.smarthub .support h3,.smarthub .support p,.smarthub .support li{text-align:center;} .wrap{display:block;max-width:1100px;margin:0 auto;position:relative;} .pad{padding:0 10px} .mid{align-items:center;align-self:center;} .grid,.content{display:grid;grid-gap:10px 40px;} .grid.half{grid-template-columns:repeat(2,1fr);} .grid.third{grid-template-columns:repeat(3,1fr);} .grid.fourth{grid-template-columns:repeat(4,1fr);} .bgimg{position:relative} .bgimg>img:first-of-type{position:absolute;width:100%;height:100%;inset:0;object-fit:cover;z-index:0} img.fillbg{max-width:calc(100% + 20px);margin:0 -10px} header .wrap{padding:10px;} header .grid{grid-template-columns:350px 1fr;} header .grid,.subfoot .grid>div:last-of-type{text-align:right;} header .grid{font-size:24px;font-weight:700;} header .phone{display:inline-block;padding:4px} header a{text-decoration:none} header #logo{margin:0 auto} nav{position:relative;z-index:999} nav .wrap{padding:0;} nav a,nav a:hover,footer h2,footer .grid.fourth,footer .grid.fourth a,footer .grid.fourth a:visited,.hero h1,.hero h2,.hero p{color:#fff;} .nav-wrap,footer{background-color:#246c4f;} nav{border-color:#246c4f;border-width:1px;border-style:solid none} footer,.subfoot,.ccpaNotice{border-top:1px solid #246c4f} nav li{display:inline-block;} nav a{display:block;padding:10px 20px;} nav a:hover,footer button:hover{background-color:#f47621;} .curragenda span{display:none} .hero,.featured{position:relative;} .hero{z-index:2;padding:20px} .hero h1,.home .cta h2{font-size:36px;} .hero h1,.hero .grid>div:first-of-type h2,.hero>.wrap>p{text-shadow:1px 1px 1px #000,-1px -1px 1px #000} .hero{height:400px;} .hero:before{content:"";width:100%;height:100%;background-color:rgba(0,0,0,.5);position:absolute;top:0;left:0;} .hero:before,.hero>.wrap{z-index:1} .hero>.wrap,.smarthub .support .wrap{top:50%;transform:translateY(-50%);} .hero strong{display:block;font-size:32px;} .hero .grid.resources{grid-gap:10px} body .hero .grid>div:first-of-type p{text-align:left;margin:0;} body .hero .grid.resources{margin:40px 0} .grid.resources p{padding:0} .hero .grid>div:last-of-type{background-color:rgba(255,255,255,.7);padding:40px 40px 50px;} .hero .grid>div:last-of-type .btn{margin-top:40px;} .home .grid.half.pad a img{transition:transform 0.2s ease,box-shadow 0.2s ease;border-radius:3px;} .home .grid.half.pad a:hover img{transform:scale(1.02);box-shadow:0 4px 12px rgba(0,0,0,0.15);outline:2px solid #FFBB33;outline-offset:2px;} .service{padding:40px 10px 0;} .featured{padding:80px 10px;margin:50px 0;} .featured:before{content:"";width:100%;height:100%;background-image:linear-gradient(#fff,transparent,transparent,#fff);position:absolute;top:0;left:0;} .featured svg{vertical-align:middle;margin-left:10px;} .featured .grid{grid-gap:0;} .featured .grid>div:nth-of-type(1){padding-right:max(4vw,10px);} .featured .grid>div:nth-of-type(2){border-left:1px solid #ccc;border-right:1px solid #ccc;padding-left:max(4vw,10px);padding-right:max(4vw,10px);} .featured .grid>div:nth-of-type(3){padding-left:max(4vw,10px);} .featured .btn,.featured p:last-of-type{margin:0} .featured .grid>div{padding-bottom:80px} .featured p:last-of-type{position:absolute;bottom:30px} .latest{padding:0 10px 40px;} .latest h3{margin-top:40px;} .media{padding:40px 10px;overflow:hidden} .media img{transform:rotate(-5deg);box-shadow:-3px 3px 6px rgba(0,0,0,.2);} .vision{padding:0 10px 80px;} .vision img{transform:rotate(5deg);box-shadow:3px 3px 6px rgba(0,0,0,.2);} .vision figure{margin:0} .vision blockquote{font-size:18px;font-weight:400;padding:0;margin:1em 0;border:none;} .cta{padding:80px 10px 100px;} .cta.bgimg>img:first-of-type{object-position:50% 30%;} fieldset{border:none;margin:0;padding:0} legend{text-align:left;font-weight:bold;font-size:var(--20px);color:#246c4f} form{text-align:left;margin:20px 0;} form .grid{grid-gap:0 10px;} form label{display:block;} input,select,textarea,.btn,button{font-family:'Red Hat Display',sans-serif;font-size:16px;} input,select,textarea{background-color:#fff;margin-bottom:10px;padding:0 10px;border:1px solid #eee;box-sizing:border-box;height:50px;width:100%} input[type=file]{margin-left:10px;border-radius:0;} textarea{height:150px;padding:15px 10px;} input[type=submit],.btn,button{display:inline-block;min-width:110px;font-weight:700;text-align:center;line-height:1.6;background-color:#FFBB33;color:#403d39;padding:10px 40px;border:none;transition:ease-out .3s;border:1px solid #ff9a1f;border-radius:3px} input[type=submit],.btn{margin:10px 0;} button{margin:5px 0} input[type=submit]{min-width:250px;margin:0;} input[type=submit]:hover,.btn:hover,button:hover{cursor:pointer;background-color:#246c4f;color:#fff;border-color:#00F0A5} input[type=checkbox]{height:auto;width:auto;display:inline-block;margin:0 auto} .btn.flip{background-color:#246c4f;color:#fff;border-color:#00F0A5} .btn.flip:hover{background-color:#FFBB33;border-color:#ff9a1f;color:#403d39} footer .wrap{padding:20px 10px;} footer a{display:block;text-decoration:none} footer .grid>div:first-of-type,.subfoot{background-color:#fff;} footer .grid>div:first-of-type,footer .grid>div:first-of-type h2,footer .grid>div:first-of-type a{color:#403d39;} footer .grid .alt{padding:0 20px;border-radius:10px;} .a8bmark{text-align:right;position:relative} .a8bmark a{display:inline-block} footer p.center a{color:#fff} .invis,.specific.invis{display:none;} .error{color:red;} .dtable{display:table;width:100%;text-align:left;} .dtable>div{display:table-row;padding:5px;} .dtable .header{font-weight:bold;} .dtable>div>div{display:table-cell;border-bottom:1px solid #ccc;padding:5px 10px;} .dtable .header>div:first-of-type{width:154px;padding:10px} .dtable>div:nth-last-of-type(n+2):hover{background-color:#f0f0f0} .dir{text-transform:capitalize;} blockquote,.highvis{border-left:10px solid #00F0A5;margin:0;padding:20px 40px;font-size:130%;font-weight:bold} h1 + img,.full{width:100%} #lists h2{margin-top:80px;padding-bottom:0;} .hero,main,nav,footer{font-size:1.125em} .content{padding:40px 10px 50px;} aside{background-color:#f5f5f5;padding:10px 10px 0;margin:20px 0;border-radius:10px;position:relative;overflow:hidden} aside h2{padding:0 10px} aside h2:last-of-type{margin-top:40px;} aside li{border-bottom:1px solid #ddd;} aside li:last-of-type{border:none;} aside li a{display:block;padding:5px 10px;text-decoration:none} aside li a:hover,aside li a:focus{background-color:#FFBB33;text-decoration:none} main{background-size:contain;background-position-y:60%;background-repeat:no-repeat;} main h1,.home h2,h2.important,.hero h2,.cta,.report h2{font-size:24px;} main h2,aside h2,.home h3,.hero .grid>div:last-of-type p,.report{font-size:20px;} main h3,footer h2,.join p{font-size:18px;} main h4{font-size:16px;} main ul,main ol{padding-left:25px;} main li,aside li,footer li{margin:10px 0;} .nolist,aside ul,footer ul{list-style:none;padding-left:0;} .nolist li{margin:5px 0;} .alpha{list-style-type:lower-alpha;} .alpha ul{list-style-type:disc;} .board img{object-fit:cover;width:250px;height:320px;} ul.meetings{padding:0;margin:0 0 2em;column-count:2;column-gap:20px;column-span:none;} h3.meetings{margin:1em 0 0} div[id^=details] ul.meetings{column-count:unset} .meetings li{list-style:none;column-span:none} .meetings a{display:block} .smarthub .wrap{padding:30px 10px 40px;} .smarthub .grey{background-color:#f5f5f5;} .smarthub .features .wrap{padding:20px 10px;} .smarthub .features p{font-weight:bold;margin-top:0;} .smarthub .features p span{text-transform:uppercase;} .smarthub .features .grid{grid-gap:10px} .smarthub .start .wrap{padding:50px 10px 40px;} .smarthub .start .grid>div{background-color:rgba(255,255,255,.8);padding:40px 20px 20px;margin-top:50px;} .smarthub .start h3{position:relative;} .smarthub .start h3 span{display:inline-block;width:48px;font-size:32px;background-color:#246c4f;color:#fff;padding:15px;border-radius:50px;position:absolute;top:-95px;left:50%;transform:translateX(-50%);} .smarthub .start .btn{margin:20px 0;} .smarthub .support{height:400px;} .bill table{width:100%;border-collapse:collapse;padding:0;margin:20px 0;} .bill table tr:nth-of-type(odd){background-color:#eee;} .bill table tr:nth-of-type(even){background-color:#fafafa;} .bill table td,.bill table th{padding:10px 20px;} .docframe{display:inline-block;width:100%;border:1px solid #eee} .docframe embed{display:block;width:100%;height:250px;overflow:hidden;} .docframe{text-align:left;margin-top:0;} .docframe span{display:block;padding:10px;border-top:1px solid #eee} .report{margin:30px auto 50px;} .grid.report{grid-template-columns:200px 1fr} .community img{max-height:190px;display:inline-block;} .carbon-free{width:100px;margin:0 auto 0 0;padding:20px 0} .rebate-doubled{text-align:center;font-size:var(--20px);color:#403d39;background-color:#FFBB33;padding:15px 10px;border:2px solid #ff9a1f;border-radius:3px;margin-bottom:20px;} .rebate-doubled strong{color:inherit;} @media(prefers-reduced-motion){*{transition:all 0s !important;scroll-behavior:unset;animation:none}} @media(forced-colors:active){.hero:before{background-color:unset} /* the mark is black artwork on a white subfoot;forced colors drops that white to Canvas,which is black under HC Black,so paint the shape in CanvasText instead. Mask the wrapper,never the img — its own artwork paints over the system colour and nothing is fixed. */ .a8bmark a{display:inline-block;forced-color-adjust:none;background-color:CanvasText;-webkit-mask:url(https://code.a8b.co/images/a8bmark.svg) center/contain no-repeat;mask:url(https://code.a8b.co/images/a8bmark.svg) center/contain no-repeat} .a8bmark a img{opacity:0} /* the mask above needs forced-color-adjust:none,which also freezes the focus ring at the author colour;against Canvas in one of the two themes that ring disappears. Highlight is guaranteed to contrast with Canvas in both. */ :is(footer .alt,.a8bmark,.hero .grid>div:last-of-type) a:focus-visible{outline-color:Highlight !important}} @media(max-width:500px){.jump{left:unset;right:0}} @media(max-width:62.5rem){.back,.smarthub .grid p span{display:block} footer .grid.fourth{grid-template-columns:1fr 1fr}} @media(max-width:47.99rem){body .content,.featured .grid{grid-template-columns:1fr} footer .grid.fourth{grid-template-columns:1fr} footer .grid.fourth .alt :is(h2,li,p){text-align:center} .carbon-free{margin:0 auto} footer .grid div:nth-of-type(n+2) ul{display:flex;flex-wrap:wrap;margin:1em -5px} footer .grid div:nth-of-type(n+2) li{flex:1 0 100px;margin:0} footer .grid div:nth-of-type(n+2) a{white-space:nowrap;padding:5px 10px;margin:5px;background-color:#FFBB33;border-radius:3px;color:#403d39;font-size:var(--15px);text-align:center;font-weight:bold} .featured{padding:20px 10px} .featured .grid>div{padding:0 !important;border:none !important} .featured p:last-of-type{position:relative;margin:1em auto;bottom:unset} .featured h2,.featured p{text-align:center;max-width:500px;margin-left:auto;margin-right:auto}} @media(max-width:43.75rem){header .grid,main .grid.half,.hero .grid.half,.start .grid.third{grid-template-columns:1fr} .smarthub .grid.fourth{grid-template-columns:1fr 1fr} header .grid,body .hero .grid>div:first-of-type p,.hero h1{text-align:center} nav a{margin:5px;padding:5px 15px} .media img,.vision img{transform:none} .media .grid>div{order:2} body main{background-image:none} body .home .hero{height:auto;} .hero .grid>div:last-of-type{padding:20px 10px} .latest + .wrap{display:none} .hero h2{text-align:center} .hero{padding:20px 15px 30px}} @media(max-width:37.5rem){} @media(max-width:31.25rem){nav >.wrap>ul{display:grid;grid-template-columns:1fr 1fr} nav>.wrap>ul>li:last-of-type:nth-of-type(odd){grid-column:1 / -1} nav a{text-align:center} .subfoot .grid.half{grid-template-columns:1fr} .subfoot p,.a8bmark{text-align:center;margin:.5em 0} footer .wrap{padding:20px 10px} .hero{height:300px} ul.meetings{column-count:unset}} @media(max-width:25rem){nav a,header .wrap{padding:5px} .imgRight{float:none;margin:0 auto;max-width:100%}}