
[data-js-expandable].-logged-in .js-submenu,[data-js-expandable].-quick-select .js-submenu{
    overflow:hidden;
    visibility:hidden;
    position:absolute;
    background:var(--white);
    margin:0;
    top:var(--40pt);
    list-style:none;
    border:solid 1px var(--neutralgrey);
    min-width:max-content;
}


@media (min-width:48rem) and (max-width:64rem){
    [data-js-expandable].-logged-in .js-submenu{
        min-width:6.75rem
    }
   
    [data-js-expandable].-quick-select .js-submenu{
        width:max-content;
        padding-right:var(--8pt)
    }
}

#main-page-content-root > div > div.container {
    background-color: var(--white);
}

[data-js-expandable].-logged-in [aria-expanded=true]+.js-submenu,[data-js-expandable].-quick-select [aria-expanded=true]+.js-submenu{
    visibility:visible
}
[data-js-expandable].-quick-select.js-submenu-expanded .js-submenu-expand,[data-js-expandable].-quick-select:hover .js-submenu-expand{
    height:calc(100% + 1px);
    z-index:101
}
@media screen and (-ms-high-contrast:active),(-ms-high-contrast:none){
    [data-js-expandable].-quick-select{
        align-items:inherit;
        flex-direction:column;
        justify-content:center;
        position:relative
    }
    [data-js-expandable].-quick-select.js-submenu-expanded,[data-js-expandable].-quick-select:hover{
        height:calc(100% + 1px)
    }
    [data-js-expandable].-quick-select.js-submenu-expanded .js-submenu-expand,[data-js-expandable].-quick-select:hover .js-submenu-expand{
        height:calc(100% + 1px);
        z-index:1000
    }
}
[data-js-expandable].-quick-select .js-submenu{
    transform:translateX(-1px);
    z-index:100;
}


@media (max-width:595px){
    body.fby-on .page-scrollable{
        overflow:hidden
    }
}
@media (max-width:595px){
    body{
        top:0!important
    }
    body .skiptranslate,body div#goog-gt-tt{
        display:none
    }
}
.-link-quick,.quick-links, #main-page-content-root > div > div.quick-links > div {
    background-color:var(--white);
    border-bottom: 1px solid var(--neutralgrey); 
}

@media screen and (max-width: 595px) {
    .-link-quick,.quick-links, #main-page-content-root > div > div.quick-links > div {
        border-bottom: none; 
    }
}

.quick-links > .container {
    border-bottom: none !important;
}

.quick-links .container > div {
    display: flex;
    flex-direction: column;
}
#main-page-content-root > div > div.quick-links > div {
    /* padding-top: var(--24pt);
    padding-bottom: var(--24pt); */
    
}

.quick-links .container{
    display:flex;
    flex-direction:column;
    padding:0
}
@media (max-width:594px){
    .quick-links .container{
        flex-direction:row;
        padding:0 var(--30pt);
        flex-wrap: wrap;
    }
}
@media (min-width:595px){
    .quick-links .container{
        flex-direction:row;
        padding:0 var(--30pt)
    }
}
.-link-quick{
    font-family:HelveticaNeueBold, Helvetica Neue,Helvetica,Arial Nova,Arial,sans-serif;
    font-weight:700;
    font-size:var(--20pt);
    border:0;
    border-bottom:1px solid var(--neutralgrey);
    display:flex;
    height:100%;
    justify-content:center;
    letter-spacing:.36px;
    line-height:var(--20pt);
    min-height:5rem;
    padding:var(--30pt) var(--20pt);
    text-decoration:none;
    color: var(--quicklink-grey);
}
.-link-quick .button__text{
    color: var(--linktext);
    display:block;
    max-width:100%
}
.-link-quick:focus,.-link-quick:hover{
    background-color: var(--white);
}




div.content-block__content > div > div > a {
    font-family:HelveticaNeueBold, Helvetica Neue,Helvetica,Arial Nova,Arial,sans-serif;
}

div.content-block-wrapper span.button__text {
    font-family:HelveticaNeueBold, Helvetica Neue,Helvetica,Arial Nova,Arial,sans-serif;
} 
@media (max-width:594px){
    .quick-links .container {
        display: flex;
        flex-direction: row;
        padding: 0;
    }
    .quick-links .container>div {
        width: 100% !important;
        margin-bottom: 12px;
    }
    .-link-quick{
        align-items:center;
        flex-direction:row;
        font-size:var(--13pt);
        line-height:var(--18pt);
        min-height:5rem;
        padding:var(--10pt);
        width: 100vw;
        background-color: var(--white);
        /* margin-bottom: 6px;
        margin-top: 6px; */
        border-radius: 0 !important;
        font-size: var(--18pt);
        color: var(--quicklink-grey) !important;
    }
    .-link-quick:last-of-type{
        /* border-right:1px solid var(--lightgrey); */
        /* border-bottom: none; */
    }
}
@media (min-width:595px){
    .-link-quick{
        align-items:center;
        /* border-bottom-width:3px;
        border-bottom-color:currentColor;
        border-left:1px solid var(--lightgrey); */
        /* flex-direction:row; */
        font-size:var(--13pt);
        line-height:var(--18pt);
        min-height:5.625rem;
        padding:var(--10pt);
        /* width:calc(100% - 8px); */
        background-color: var(--white);
        display: flex;
        flex-direction: column;
        border-left: 1px solid var(--neutralgrey);
        border-bottom: 0;
        border-radius: 0;
    }
    .-link-quick:last-of-type{
        /* border-right:1px solid var(--neutralgrey) !important; */
    }
}
@media (min-width:900px){
    div.quick-links > div > div:nth-child(1) > a, div.quick-links > div > div:nth-child(2) > a, div.quick-links > div > div:nth-child(3) > a {
        /* border-right: 0 !important; */
    }
    .-link-quick{
        /* border-bottom-width:4px; */
        font-size:var(--18pt);
        min-height:133px;
        padding:var(--25pt) var(--10pt);
        /* border-right:1px solid var(--white); */
        transition:all 300ms ease;
        background: var(--white);
        border-radius: 0;
        border: 1px solid var(--neutralgrey);
        border-right: 0;
        border-bottom: 3px solid currentColor;
        border-top: 0;
        box-shadow: none;
        position: relative;
        left: -1px;
    }
    .-link-quick:last-child {
        /* border-right: 1px solid var(--neutralgrey) !important; */
    }
    .-link-quick:focus,.-link-quick:hover{
        transform:scale(1.05);
        z-index:1;
        /* color: var(--NGBtnHover500) !important; */
        border: 1px solid var(--neutralgrey);
        border-bottom: 3px solid currentColor;
        border-right: 1px solid var(--neutralgrey) !important;
        stroke: var(--NGBtnHover500) !important;
        fill: var(--NGBtnHover500) !important;
    }
    /* div.quick-links > div > div:nth-child(1) > a:focus, div.quick-links > div > div:nth-child(2) > a:focus, div.quick-links > div > div:nth-child(3) > a:focus, div.quick-links > div > div:nth-child(1) > a:hover, div.quick-links > div > div:nth-child(2) > a:hover, div.quick-links > div > div:nth-child(3) > a:hover  {
        border-right: 1px solid var(--neutralgrey) !important;
    } */
    .-link-quick:focus > span,.-link-quick:hover > span{
        color: var(--NGBtnHover500) !important;
    }
    .-link-quick:focus img,.-link-quick:hover img {
        /* filter: invert(31%) sepia(95%) saturate(4183%) hue-rotate(192deg) brightness(93%) contrast(101%); */
    }
}
.-link-quick+.-link-quick{
    margin-top:0
}
.-link-quick .icon{
    margin-right:var(--10pt);
    max-height:var(--20pt);
    max-width:var(--24pt);
    height:auto;
    width:auto
}

.quick-links div:not(.container):has(a.button.-link-quick):last-of-type {
    border-right: 1px solid var(--neutralgrey);
  }

@media screen and (max-width: 47.938rem) {
    .-link-quick .button__text{
        font-size: -var(--18pt);
    }
    .-link-quick .icon{
        margin-right:0;
        max-height: var(--30pt);
        max-width: var(--26pt);
    }
}

@media (min-width:595px){
    .-link-quick .icon{
        margin-bottom:var(--8pt);
        margin-right:0;
        max-height:2rem;
        max-width:var(--30pt)
    }
}
@media (min-width:900px){
    .-link-quick .icon{
        max-height:2rem;
        max-width:2rem;
        margin-right: 1rem;
    }
}

/* new colours for icons */ 

/* .quick-links .container > div:nth-of-type(1) .button.-link-quick img.icon {
    filter: brightness(0) saturate(100%) invert(31%) sepia(95%) saturate(908%) hue-rotate(75deg) brightness(102%) contrast(95%);

    -webkit-filter: brightness(0) saturate(100%) invert(31%) sepia(95%) saturate(908%) hue-rotate(75deg) brightness(102%) contrast(95%);
}

.quick-links .container > div:nth-of-type(2) .button.-link-quick img.icon {
    filter: brightness(0) saturate(100%) invert(75%) sepia(13%) saturate(1892%) hue-rotate(340deg) brightness(100%) contrast(103%);

    -webkit-filter: brightness(0) saturate(100%) invert(75%) sepia(13%) saturate(1892%) hue-rotate(340deg) brightness(100%) contrast(103%);

}
.quick-links .container > div:nth-of-type(3) .button.-link-quick img.icon {
    filter: brightness(0) saturate(100%) invert(62%) sepia(22%) saturate(7086%) hue-rotate(136deg) brightness(95%) contrast(101%);

    -webkit-filter:  brightness(0) saturate(100%) invert(62%) sepia(22%) saturate(7086%) hue-rotate(136deg) brightness(95%) contrast(101%);
}

.quick-links .container > div:nth-of-type(4) .button.-link-quick img.icon {
    filter: brightness(0) saturate(100%) invert(51%) sepia(13%) saturate(4798%) hue-rotate(160deg) brightness(99%) contrast(104%);

    -webkit-filter: brightness(0) saturate(100%) invert(51%) sepia(13%) saturate(4798%) hue-rotate(160deg) brightness(99%) contrast(104%);
}

.quick-links .container > div:nth-of-type(1) .button.-link-quick[href*="Report-a-Gas-Emergency"] img.icon {
    filter: none !important;
    -webkit-filter: none !important;
}
  
.quick-links .container > div:nth-of-type(2) .button.-link-quick[href*="Ways-to-Pay"] img.icon {
     filter: none !important;
     -webkit-filter: none !important;
} */

/* storm mode stuff */

/* .quick-links .container > div:nth-of-type(1) .button.-link-quick[href*="/outages"] img.icon, .quick-links .container > div:nth-of-type(2) .button.-link-quick[href*="gas-emergency"] img.icon {
    filter: none !important;
}

.quick-links .container > div:nth-of-type(2) .button.-link-quick[href*="gas-emergency"] img.icon {
    filter: none !important;
}

.quick-links .container > div:nth-of-type(3) .button.-link-quick[href*="/outages"] img.icon {
    filter: none !important;
}

.quick-links .container > div .button.-link-quick[href*="/project-c/"] img.icon {
    filter: none !important;
}

.quick-links .container > div .button.-link-quick[href*="/ProNet/"] img.icon {
    filter: none !important;
}

.quick-links .container > div .button.-link-quick[href*="/solar-hub/"] img.icon {
    filter: none !important;
} */

