html{overflow-y: scroll;} body{margin:0px; color:#3e3f3e; font-size:16px; font-weight:normal; font-family:"Roboto", sans-serif; -webkit-font-smoothing: subpixel-antialiased;} .emcolor{color:#F9A134;} .bold{font-weight: bold;} .italic{font-style: italic;} .highlight{color:#3e3f3e; text-decoration: underline;} .txt{font-size:16px; margin-bottom:20px;} .txtsmall{font-size:14px;} .txtright{text-align:right;} .txtleft{text-align:left;} .txtyellow{color:#ffb500;} .txtwhite{color:#ffffff;} .txtgray{color:#808080;} .txtlightgray{color:#d1d1d1;} .txtlightblue{color:#99c7ea;} .txtblue{color:#183b65;} .txtdarkblue{color:#182954;} .center{text-align: center;} .nopadding{padding:0px;} .padding10{padding:10px;} .padding20{padding:20px;} .paddingleft20{padding-left:20px;} .paddingleft40{padding-left:40px;} .paddingbottom20{padding-bottom:20px;} .margincenter{margin: 0 auto;} .margintop20{margin-top:20px;} .margintop40{margin-top:40px;} .margintop50{margin-top:50px;} .margintop60{margin-top:60px;} .margintop70{margin-top:70px;} .marginbottom10{margin-bottom:10px;} .marginbottom20{margin-bottom:20px;} .marginbottom30{margin-bottom:30px;} .marginbottom40{margin-bottom:40px;} .marginbottom50{margin-bottom:50px;} .marginbottom60{margin-bottom:60px;} .marginleft40{margin-left:40px;} .verybigtitle{font-size: 48px; font-weight: 700; line-height: 50px} .bigtitle{font-size: 44px; line-height: 48px;} .bigtitlebold{font-size: 48px; line-height: 60px; font-weight:700;} .bigmidtitle{font-size: 40px; line-height: 44px;} .title{font-size: 38px; line-height: 38px;} .txttitle{font-size: 26px; font-weight: bold; line-height: 30px; color: #052739;} .txtheader{font-size: 34px; line-height: 40px; margin: 30px 0; padding: 10px 0; text-align: center; display: block; text-transform: capitalize;} .midsubtitle{font-size: 26px; line-height: 28px;} .subtitle{font-size: 20px; line-height: 28px;} .lighter{font-weight: lighter;} .verticaltop{vertical-align: top;} .dottedbottomborder{border-bottom: 2px dotted #b0b0b0;} .bgblue-transparent{background-color: rgba(54, 134, 210, 0.5);} .bgblack-transparent{background-color: rgba(0, 0, 0, 0.8);} .bgblue{background-color: #0F5EA3;} .greybg{background-color: #eaeaea;} .darkgreybg{background-color: #767676;} a {color: #F9A134;} a:hover{text-decoration:none; color:#337ab7;} .bannerFamilyPromoPhotograph, .bannerFamilyPhotograph, .bannerSolarPhotograph, .bannerGreenEnergyPhotograph, .bannerHomePhotograph {position: absolute; right: 10vw; top: 40px; z-index: 11; transform: rotate(2deg); box-shadow: 0 18px 35px rgba(0,0,0,.75);} .bannerFamilyPromoPhotograph {max-width: 400px; bottom:114px;} .bannerFamilyPhotograph{max-width: 450px; transform: rotate(-3deg); bottom:70px;} .bannerSolarPhotograph{max-width: 500px; transform: rotate(-0deg); box-shadow: none;} .bannerGreenEnergyPhotograph {max-width: 450px; transform: rotate(-6deg); bottom:70px;} .bannerHomePhotograph {max-width: 450px; transform: rotate(-6deg); bottom: 68px;} .bannerFamilyPhotograph img, .bannerSolarPhotograph img, .bannerFamilyPromoPhotograph img, .bannerGreenEnergyPhotograph img, .bannerHomePhotograph img {width: 100%; height: auto; display: block;} .bannerhome, .bannerhome_promo, .bannerhome2, .bannerhome3 {position: relative; height:500px; background: url(https://utilitynet.s3.amazonaws.com/northernnrg/images/header_home_blanc.png); background-repeat: no-repeat; background-size: cover; background-color: #ffffff; z-index:10;} .carousel-inner .darkgreybg{padding: 22px;} .banneraboutus{position: relative; margin-top:20px; height:400px; background: url(https://utilitynet.s3.amazonaws.com/northernnrg/images/aboutus.jpg); background-repeat: no-repeat;} .bannerbluebgcontainer{background-color: rgba(39, 111, 180, 0.7); color:#fff; position:absolute; left:0; right:0; top:55%; padding:20px;} .bannertextcenter{color:#fff; position:absolute; left:0; right:0; top:10%; padding:20px; margin-left: auto; margin-right: auto; max-width:85%;} .bannertextleft{color:#fff; position:absolute; top:15%; left:0; right:0; padding:20px; margin-left: auto; margin-right: auto; width:1000px; max-width:90%; z-index: 14;} .bannertextleft_solar{color:#fff; position:absolute; top:0%; left:0; right:0; padding:20px; margin-left: auto; margin-right: auto; width:1000px; max-width:90%;} .bannercontentleft_am{width: 80%;} .ambannertxt2{width: 100%;} .bannertextright{color:#fff; position:absolute; top:20%; left:0; right:0; padding:20px; margin-left: auto; margin-right: auto; width:1000px; max-width:90%;} .bannertextcontentcenter{padding-top: 10px; letter-spacing: 0.07em; width:90%; margin: 0 auto;} .bannertextcontentleft{font-size: 20px; letter-spacing: 0.07em; line-height: 24px; padding-top: 10px; width:51%;} .bannertextcontentright{font-size: 20px; letter-spacing: 0.07em; line-height: 24px; padding-top: 10px; width:450px; float:right;} .bannertexttitle{font-size: 40px; line-height: 48px; font-weight:bold;} .bannertextsubtitle{font-size: 34px; line-height: 40px; margin-bottom:60px;} .bannertextcontent{font-size: 20px; line-height: 28px;} .bannerbotton{clear: both;} .bannerbotton a{background: #F9A134!important; border: solid 1px transparent; border-radius: 8px; display: inline-block; font-size: 16px; font-weight: 900; line-height: 40px; padding: 0px 20px; text-transform: uppercase; transition: color 0.25s ease 0s, background-color 0.25s ease 0s; white-space: nowrap; color:#ffffff!important;} .bannerbotton a:hover{background:#0F5EA3!important; color:#ffffff!important; text-decoration: none!important;} .banner_about{position: relative; height:300px; background: url(https://utilitynet.s3.amazonaws.com/northernnrg/images/header-about.jpg); background-position: 50%; background-repeat: no-repeat; background-size: cover; z-index:10;} .super{position: relative; top: -1.4em; font-size:20px;} .smsuper{font-size: 14px; position: relative; top: -0.5em;} .bigthintxt{font-size: 34px; line-height: 44px; letter-spacing: 0.15em; transform: scale(1, 1.5); font-weight: bold;} .thintxt{font-size: 20px; font-weight: bold; line-height: 30px; font-weight: lighter; letter-spacing: 0.15em; transform: scale(1, 1.5);} @media (max-width: 1100px) {.bannerFamilyPromoPhotograph {max-width: 300px; transform: translateX(50%) rotate(2deg); right: 20vw; top: 100px; bottom: 200px;} .bannerSolarPhotograph {max-width: 350px; transform: translateX(50%) rotate(0deg); right: 20vw; top: 100px;} .bannerFamilyPhotograph {transform: translateX(50%) rotate(-3deg); max-width: 300px; right: 20vw; top: 100px; bottom: 175px;} .bannerGreenEnergyPhotograph {max-width: 300px; right: 20vw; transform: translateX(50%) rotate(-6deg); top: 100px; bottom: 175px;} .bannerHomePhotograph {max-width: 300px; transform: translateX(50%) rotate(-6deg); right: 29vw; top: 100px; bottom: 175px;}} @media (max-width: 900px) {.bannerSolarPhotograph {right: 25%; transform: translateX(50%); top: 100px; bottom: 200px; max-width: 290px;} .bannerFamilyPromoPhotograph {right: 25%; transform: translateX(50%) rotate(2deg); top: 100px; bottom: 145px; max-width: 290px;} .bannerFamilyPhotograph {right: 25%; transform: translateX(50%) rotate(-3deg); top: 100px; bottom: 145px; max-width: 290px;} .bannerGreenEnergyPhotograph {right: 25%; transform: translateX(50%) rotate(-6deg) ; top: 100px; bottom: 190px; max-width: 240px;} .bannerHomePhotograph {right: 25%; transform: translateX(50%) rotate(-6deg) ; top: 142px; bottom: 190px; max-width: 240px;}} @media (max-width: 600px) {.bannerSolarPhotograph{max-width: 240px; right: 22vw; top: 130px; bottom: 128px;} .bannerFamilyPromoPhotograph {max-width: 240px; transform: translateX(50%) rotate(2deg); right: 25vw; top: 100px; bottom: 195px;} .bannerFamilyPhotograph {max-width: 223px; transform: translateX(50%) rotate(-3deg) ; right: 22vw; top: 100px; bottom: 210px;} .bannerGreenEnergyPhotograph {max-width: 223px; transform: translateX(50%) rotate(-6deg) ; right: 22vw; top: 100px; bottom: 205px;} .bannerHomePhotograph {max-width: 223px; transform: translateX(50%) rotate(-6deg) ; right: 22vw; top: 125px; bottom: 185px;}} @media (max-width: 482px) {.bannerFamilyPhotograph, .bannerSolarPhotograph, .bannerFamilyPromoPhotograph, .bannerGreenEnergyPhotograph, .bannerHomePhotograph {display: none;}} @media (min-width: 481px) and (max-width: 992px) {.bannerhome, .bannerhome_promo, .bannerhome2, .bannerhome3 {position: relative; height:500px; background: url(https://utilitynet.s3.amazonaws.com/northernnrg/images/header_home_blanc.png); background-repeat: no-repeat; background-size: cover; background-color: #ffffff; z-index:10;} .bannerhome{background-position: 90%;} .bannerhome_promo {background-position: 85%;} .bannerhome2 {background-position: 80%;} .bannerhome3 {background-position: 80%;} .bannerbluebgcontainer{background-color: rgba(39, 111, 180, 0.7); color:#fff; position:absolute; left:0; right:0; top:40%; padding:10px;} .bannertextcenter{color:#fff; position:absolute; font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; -webkit-font-smoothing: subpixel-antialiased; left:0; right:0; top:5%; padding:10px; margin-left: auto; margin-right: auto; max-width:100%;} .bannertextleft{color:#fff; position:absolute; top:15%; left:0; right:0; padding:20px; margin-left: auto; margin-right: auto; max-width:85%; filter: drop-shadow(2px 2px 3px black); z-index:14;} .bannertextleft_solar{color:#fff; position:absolute; top:0%; left:0; right:0; padding:20px; margin-left: auto; margin-right: auto; max-width:85%;} .bannercontentleft_am{width: 95%;} .ambannertxt2{width: 130%;} .bannertextright{color:#fff; position:absolute; top:10%; left:0; right:0; padding:20px; margin-left: auto; margin-right: auto; max-width:85%;} .bannertextcontentcenter{padding-top: 10px; width:98%; margin: 0 auto; letter-spacing: 0.07em;} .bannertextcontentleft{font-size: 16px; letter-spacing: 0.07em; line-height: 24px; padding-top: 10px; min-width:300px; width:55%;} .bannerhome2 .bannertextcontentleft{min-width:257px;} .bannertextcontentright{font-size: 20px; font-weight: lighter; letter-spacing: 0.07em; line-height: 24px; padding-top: 10px; width:85%; float:right;} .bannertexttitle{font-size: 30px; font-weight: 700; line-height: 38px;} .bannertextsubtitle{font-size: 22px; line-height: 28px; margin-bottom:40px;} .bannertextcontent{font-size: 16px; line-height: 20px; width: 80%; margin: 0 auto;} .bannerbotton{clear: both;} .super{position: relative; top: -0.8em; font-size:20px;} .bigthintxt{font-size: 24px; line-height: 28px; padding-bottom:20px; letter-spacing: 0.15em; transform: scale(1, 1.5); font-weight: bold;} .thintxt{font-size: 16px; font-weight: bold; line-height: 20px; font-weight: lighter; letter-spacing: 0.15em; transform: scale(1, 1.5);}} @media (max-width: 480px) {.bannerhome, .bannerhome_promo, .bannerhome2, .bannerhome3 {position: relative; height:550px; background: url(https://utilitynet.s3.amazonaws.com/northernnrg/images/header_home_blanc.png); background-position: 25%; background-repeat: no-repeat; background-size: cover; background-color: #ffffff; z-index:10;} .bannerbluebgcontainer{background-color: rgba(39, 111, 180, 0.7); color:#fff; position:absolute; left:0; right:0; top:40%; padding:10px;} .bannertextleft{color:#fff; position:absolute; top:10%; left:0; right:0; padding:10px; margin-left: auto; margin-right: auto; max-width:85%; filter: drop-shadow(2px 2px 3px black);} .bannertextleft_solar{color:#fff; position:absolute; top:0%; left:0; right:0; padding:10px; margin-left: auto; margin-right: auto; max-width:85%;} .bannercontentleft_am{width: 100%;} .ambannertxt2{width: 100%; font-size: 14px;} .bannertextcenter{color:#fff; position:absolute; font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; -webkit-font-smoothing: subpixel-antialiased; left:0; right:0; top:5%; padding:10px; margin-left: auto; margin-right: auto; max-width:100%;} .bannertextcontentleft{font-size: 16px; letter-spacing: 0.07em; line-height: 24px; padding: 10px; width:90%; text-shadow: 1px 1px #565656;} .bannertextcontentcenter{padding-top: 10px; width:98%; margin: 0 auto;} .bannertexttitle{font-size: 22px; font-weight: 700; line-height: 26px;} .bannertextsubtitle{font-size: 18px; line-height: 24px; margin-bottom:30px;} .bannertextcontent{font-size: 16px; line-height: 20px; width: 85%; margin: 0 auto;} .super{position: relative; top: -0.8em; font-size:18px;} .bigthintxt{font-size: 18px; line-height: 22px; padding-bottom:20px; letter-spacing: 0.15em; transform: scale(1, 1.5); font-weight: bold; margin-top:10px;} .thintxt{font-size: 14px; font-weight: bold; line-height: 20px; font-weight: lighter; letter-spacing: 0.15em; transform: scale(1, 1.5);}} .carousel.carousel-fade .item {left: 0 !important; -webkit-transition: opacity 1s linear; -moz-transition: opacity 1s linear; -ms-transition: opacity 1s linear; -o-transition: opacity 1s linear; transition: opacity 1s linear; opacity: .5;} .carousel.carousel-fade .active.item {opacity: 1;} .carousel.carousel-fade .active.left, .carousel.carousel-fade .active.right {left: 0; z-index: 2; opacity: 0; filter: alpha(opacity=0);} .carousel-overlay {position: absolute; bottom: 100px; right: 0; left: 0; color: white; text-shadow: 1px 1px 1px rgba(0,0,0,.5); font-size: 5em;} .carousel-control.left {background-image: none!important; left: 10px;} .carousel-control.right {background-image: none!important; right: 10px;} .carousel-control{bottom: 0; color: #fff; font-size: 20px; opacity: 0.5; position: absolute; text-align: center; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6); top: 0; width: 30px;} .nextbtn, .prevbtn{position:absolute; font-size:30px; top: 70%; right: 10%; z-index: 10000; display: inline-block; margin-top: -10px; cursor:pointer; color: #565656; background: radial-gradient(white,transparent);} @media (max-width: 480px) {.prevbtn{position:absolute; font-size:30px; top: 78%; left:10%; z-index: 10000; display: inline-block; margin-top: -10px; cursor:pointer; color: #565656;} .nextbtn{position:absolute; font-size:30px; top: 78%; right: 10%; z-index: 10000; display: inline-block; margin-top: -10px; cursor:pointer; color: #565656;}} .col-md-3 {padding-right:10px; padding-left:10px;} .box-services{position: relative; max-width: 335px; margin: 37px auto 0; text-align: left;} .box-services-inner{border: 1px solid #d2d2d0; border-radius: 16px; padding: 15px 20px 25px; min-height:317px; background: #fff; transition: box-shadow 0.3s ease;} .box-services-inner:hover{box-shadow: 0px 15px 35px rgba(0,0,0, 0.12);} .box-services-icon{position: absolute; width: 50px; height: 50px; transition: transform 0.3s ease;} .box-services-inner:hover .box-services-icon {transform: scale(1.1);} .learn-more {display: inline-flex; align-items: center; font-weight: 600; text-decoration: none; color: #34C759; transition: color 0.3s ease;} .arrow {display: inline-block; margin-left: 6px; transition: transform 0.3s ease;} .learn-more:hover .arrow {transform: translateX(4px);} .about-us {background-color:#fff6f6; color: #545050; padding-top:20px;} .box-aboutUs {border: 1px solid #d2d2d0; border-radius: 16px; background:#fff;} .box-aboutUs-inner {height: 100px; margin-left: 20px;} .box-aboutUs-inner .bigtitle{color:#F9A134;} .box-content{min-height:100px;} @media(max-width:992px){.box-aboutUs {margin-bottom: 20px; max-width: 300px;}} .solarSection {background: linear-gradient( to right bottom, rgba(255,255,255, 0.9) 20%, rgba(255,255,255, 0.7) 45%, rgba(255,255,255, 0.2) 70%, rgba(255,255,255, 0) 100%), url(https://utilitynet.s3.amazonaws.com/northernnrg/images/solar.png); height: auto; max-width: 100%; background-position: bottom; background-repeat: no-repeat; background-size: cover; position: relative; border: 1px solid #d2d2d0; border-radius: 16px; transition: box-shadow 0.3s ease; cursor: pointer;} .solarSection:hover{box-shadow: 0px 15px 35px rgba(0,0,0, 0.3);} .solarclub-content {max-width: 1200px; margin: 0 auto;} .solarclub-left {margin: 100px 70px;} .solarclub-logo {width: 150px; margin-bottom: 20px;} .solarclub-title {color: #4b1869; max-width: 400px;} .solarclub-left .highlight {color: #00a2ad; text-decoration: none;} .solarclub-subtitle {font-size: 28px; color: #6b217c; font-weight: 500; line-height:28px;} .solarclub-description {color: #444; max-width: 575px; font-size: 18px; line-height: 1.6; margin-bottom: 28px;} @media (max-width: 480px) {.solarclub-left{margin: 40px;} .bigtitlebold {font-size: 30px; line-height: 40px;} .solarclub-subtitle {font-size: 24px;}} .visually-hidden{position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;} .accordion{max-width:920px; margin:auto; border-radius:16px; background:#fff; overflow:hidden;} .acc-item{border:1px solid #e6e7ea; border-radius: 16px; margin-bottom:10px;} .acc-item:last-of-type{border-bottom:none;} .about-icon .img-responsive {height:65px; width: auto;} .about-icon {display: flex; align-items: center; justify-content: center;} .acc-item > summary{list-style:none; display:flex; align-items:center; justify-content:space-between; gap:26px; padding:10px 22px; cursor:pointer; user-select:none; position:relative; outline:none; transition: background .32s cubic-bezier(.22,.7,.2,1), box-shadow .32s cubic-bezier(.22,.7,.2,1); border: 1px solid lightgray; border-radius: 16px; box-shadow: 0px 5px 5px rgba(0,0,0, 0.12)} .acc-item > summary::-webkit-details-marker{display:none;} .acc-item > summary:hover{background: #f9fafb;} .acc-item > summary:focus-visible{box-shadow: 0 0 0 3px color-mix(in oklab, #34C759 30%, white); border-radius: 8px;} .acc-title{color:#0b0b0c; flex-grow: 1;} .acc-caret{flex-shrink:0; color:#6b7280; transition: transform .32s cubic-bezier(.22,.7,.2,1), color .32s cubic-bezier(.22,.7,.2,1);} .acc-item[open] > summary{background: #fff; box-shadow: inset 4px 0 0 0 #34C759;} .acc-item[open] > summary .acc-caret{transform: rotate(180deg); color: #34C759; border-radius: 16px;} .acc-content{display:grid; grid-template-rows: 0fr; transition: grid-template-rows .32s cubic-bezier(.22,.7,.2,1); padding: 0 130px;} .acc-content > div{overflow:hidden;} .acc-item[open] .acc-content{grid-template-rows: 1fr;} .acc-content p{margin: 15px 0; color: #6b7280; line-height:1.6;} .aboutlist{position: relative; margin-bottom:10px; color:#ffffff; background-color:#0F5EA3; padding:20px; padding-left:40; min-height: 80px;} .aboutlist_electronicwithdrawal{position: absolute; top: 50%; transform: translateY(-50%); right: 15px;} .aboutlist_electronicwithdrawal img{width:60px; height:auto; opacity:0.5;} .aboutlist-triangle {width: 0; height: 0; border-top: 43px solid transparent; border-bottom: 45px solid transparent; border-right: 20px solid #0F5EA3; position: absolute; left: -20px; top: 0px;} @media(max-width:992px){.aboutlist-triangle {display: none;} .aboutlistcontent{max-width:300px;}} @media(max-width:440px){.aboutlist_electronicwithdrawal img{width:50px; height:auto;} .aboutlistcontent{max-width:200px;} .acc-content{padding: 0 30px;}} .ngrateChart > .head {background: #81be00 none repeat scroll 0 0; color: #ffffff; margin-bottom: 2px; padding: 10px; text-align: center; text-transform: uppercase; font-size:16px;} .ngrateChart > .bodytxt {background: #e5e5e5 none repeat scroll 0 0; display: block; min-height: 180px; padding:10px; text-align: center;} .ngrateChart .rate{font-size: 60px; font-weight: 400; line-height: 30px; padding: 30px;} .ngrateChart .rate span{font-size: 22px;} .Chart > .head{text-align:center; color:#fff; background:#525459; text-transform:uppercase; font-weight:900; padding:10px; margin-bottom:2px;} .Chart > .tabs{background:#eaeaea; text-align:center; overflow:hidden;} .Chart > .tabs label{cursor:pointer; background:#9e9fa2; color:#fff; font-weight:900; padding:10px 0; display:block; float:left; width:50%;} .Chart > .bodytxt{background:#e5e5e5; padding:50px; display:block;} @media(max-width:1400px){.Chart > .bodytxt{padding:30px;}} @media(max-width:992px){.Chart > .bodytxt{padding:15px;}} .footer{background-color: #253551; color:#ffffff; text-align: center; padding-bottom:20px;} .footer .row {padding-top: 10px;} .footer_title{font-size:20px; padding:5px;} .footer_subtitle{font-size:16px;} .footercontainer{position: relative; margin-bottom:20px;} .footertxt{position: relative; font-size:14px; line-height:18px; text-align: center; color: #ffffff;} .footerimg{margin-top:20px;} .footer a{color: #ffffff; text-decoration: none;} .footer a:hover{color: #ffffff; text-decoration: underline;} .footercontainer .logo{margin: 0 auto; width: 200px;} .footersocialcontainer{position:relative; top: 0px;} .footersocial{width:40px; height:40px; display:inline-block; padding:5px; margin-left: 5px;} .footersocial .icon {width: 40px; height: 40px; border: 3px solid #ffffff; text-align: center; line-height: 32px; display: inline-block; border-radius: 100%; vertical-align: middle; transition: border-color 0.25s;} .footersocial .icon svg{width:23px; height:23px; display:inline-block; vertical-align:middle; fill:#ffffff; transition:fill 0.25s;} .footersocial a:hover .icon{border-color:#e7e7e7;} .footersocial a:hover .icon svg{fill:#e7e7e7;} .container-whoweare{max-width: 1120px; margin-inline: auto; padding-inline: 24px;} .about-hero{background: linear-gradient(180deg, #34C759 0%, #F07F0F 100%); color:#fff; padding: clamp(56px, 10vw, 70px) 0 clamp(48px, 8vw, 80px); position: relative; overflow: hidden;} .banner_logo {position: absolute; right: 35vw; top: 20px; z-index: 11; max-width: 450px; transform: translateX(50%);} .banner_logo img {width: 550px;} @media (max-width: 1100px) {.banner_logo {display:none;}} .about-hero .container-whoweare{display:grid; gap: 18px; justify-items: start; max-width: 1120px; margin-inline: auto; padding-inline: 24px; filter: drop-shadow(2px 4px 6px darkgrey);} .about-hero p{color: rgba(255,255,255,.92); max-width: 720px; margin: 0 0 12px;} .container-whoweare .bannerbotton a{background: #FFFFFF!important; border: solid 1px transparent; border-radius: 8px; display: inline-block; font-size: 16px; font-weight: 600; line-height: 40px; padding: 0px 20px; transition: color 0.25s ease 0s, background-color 0.25s ease 0s; white-space: nowrap; color:#000000!important;} .container-whoweare .bannerbotton a:hover{background:#337ab7!important; color:#ffffff!important; text-decoration: none!important;} .about-split {padding: clamp(60px, 8vw, 100px) 0; background: linear-gradient(90deg, #ffffff 0%, #fff9f3 100%);} .container-whoweare.split {display: flex; align-items: stretch; gap: 48px; max-width: 1200px; margin: 0 auto; padding: 0 24px;} .img-col, .text-col {flex: 1 1 0;} .img-col {position: relative; overflow: hidden; border-radius: 16px; box-shadow: 0 10px 25px rgba(0,0,0,0.08);} .img-col img {width: 100%; height: 100%; object-fit: cover; display: block;} .text-col {display: flex; flex-direction: column; justify-content: center; color: #334155;} .text-col h2 {font-size: clamp(28px, 4vw, 36px); margin-bottom: 16px; color: #0f172a;} @media (max-width: 992px) {.container-whoweare.split {flex-direction: column; align-items: center;} .img-col {display: block; width: 100%; height: auto; overflow: visible; box-shadow: none;} .img-col img {width: 100%; height: auto; object-fit: cover; border-radius: 16px;} .text-col {width: 100%; text-align: center; margin-top: 24px;}} .container_mysecure{margin-top:80px;}.headercontainer{height:150px;}.affiliateNav{width:100%; max-width:100%;}.navbar-brand {position:absolute; top:5%; left:100px; display:block; width:220px; height:80px; background-image: url(https://utilitynet.s3.amazonaws.com/northernnrg/images/logomain.png)!important; background-repeat: no-repeat;}.navbar-default {box-shadow: rgb(202 131 42) 4px 4px 10px; border-color:transparent;}@media(max-width:1200px){.navbar-brand{left:20px;}}@media (max-width: 992px) {.navbar-brand {float: left; font-size: 18px; top:0px; left:30px; height: 90px; width:200px; line-height: 20px; padding: 0px!important; background-image: url(https://utilitynet.s3.amazonaws.com/northernnrg/images/logo.png)!important; display: block !important;}} .navbar-default {background-color: #F9A134;} .navbar-default .navbar-nav > li > a {color: #ffffff;} .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {color: #ffffff;}@media(min-width:993px){.navupper{background:#ffffff; min-height:95px; width:100%; padding:0px 85px 0px 0px;} .navupper ul {list-style: none; margin-top:15px;} .navupper ul li{padding:10px;} .navupper ul li a{color:#565656!important; background-color: transparent!important; transition:opacity 0.25s;} .navupper ul li a:hover{opacity:0.66; text-decoration: none;} .navbarmain{background:#F9A134; min-height:60px; width:100%; padding:10px 85px 10px 0px;} .navbarmain ul{list-style: none; padding:0px 10px;} .navbarmain ul li a{padding: 0 15px; color:#ffffff!important; background-color: transparent!important; transition:opacity 0.25s; font-size: 18px; line-height: 40px; display:block; font-weight:400;} .navbarmain ul li a:hover{color:#000000!important;} .navbarmain .button{background: #ffffff!important; color:#3e3f3e!important; border-radius: 8px; display: inline-block; font-size: 16px; font-weight: 900; line-height: 40px; padding: 0px 20px; text-transform: none; transition: color 0.25s ease 0s, background-color 0.25s ease 0s; white-space: nowrap;} .navbarmain .button:hover{background:#337ab7!important; color:#ffffff!important;} .caret{display:none;} .navbarmain li > .navdropdown{display:block; position:absolute; overflow:hidden; top:60px; left:0px; padding:0; background:#fff; max-height:0; min-width:320px; box-shadow:0 5px 20px rgba(0,0,0,0.1); transition:max-height 0.25s, padding 0.25s; border: none;} .navbarmain li:hover > .navdropdown{max-height:300px; padding:10px 0;} .navbarmain .navdropdown a{display:block; padding:0 20px; font-size:16px; line-height:35px; font-weight:700; color:#525459!important; transition:background 0.25s, color 0.25s} .navbarmain .navdropdown a:hover{background:#3e3f3e!important; color:#fff!important;} .mobilesupport{display: none!important;}}@media(min-width:993px) and (max-width:1200px){.navupper{padding:0px 40px 0px 0px;} .navbarmain{padding-right:40px;} .navbarmain ul li a{display:block; padding:0 10px; color:#fff; font-size:18px; font-weight:400; line-height:40px;}}@media (max-width: 992px) {.headercontainer{height:55px;} .navupper{display: none;} .navbar-default {box-shadow: rgb(202 131 42) 4px 4px 10px;} .navbar-default .navbar-toggle {border-color: transparent; margin-right: 20px;} .navbar-default .navbar-toggle {border-color: #ffffff;} .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {background-color: transparent;} .navbar-default .navbar-toggle .icon-bar {background-color: #ffffff;} .navbar-header {float: none; height:55px;} .navbar-left,.navbar-right {float: none !important;} .navbar-toggle {display: block;} .navbar-collapse {border-top: 1px solid #f9f4f4!important; box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);} .navbar-fixed-top {top: 0; border-width: 0 0 1px;} .navbar-collapse.collapse {display: none!important;} .navbar-nav {float: none!important; margin-top: 7.5px;} .navbar-nav>li {float: none;} .navbar-nav>li>a {padding-top: 10px; padding-bottom: 10px;} .collapse.in{display:block !important;} .navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse {max-height: 600px!important;} .navupper, .navbarmain{background:transparent; min-height:40px; width:100%; padding-left:40px!important; padding-right:40px!important; margin-bottom:20px;} .navupper ul, .navbarmain ul {list-style: none;} .navupper ul li, .navbarmain ul li{margin-top: 3px;} .navupper ul li a, .navbarmain ul li a{padding:5px!important; color:#ffffff!important; background-color: transparent!important; transition:opacity 0.25s; font-size:16px;} .navupper ul li a:hover, .navbarmain ul li a:hover{opacity:1; color:#3e3f3e!important;} .navupper .icon {display: inline-block; height: 20px; margin: -3px 3px 0 0; width: 20px; border: none;} .navbarmain .button{background:#3e3f3e!important; color:#ffffff!important; border-radius: 10px; display: inline-block; font-size: 16px; font-weight: 900; line-height: 30px; padding: 0px 20px!important; text-transform: none; transition: color 0.25s ease 0s, background-color 0.25s ease 0s; white-space: nowrap;} .navbarmain .button:hover{background: #ffffff!important; color:#3e3f3e!important;} .caret{display:inline-block;} .navbarmain .navdropdown{background:#ffffff!important;} .navbarmain .navdropdown a{display:block; padding:5px 5px 5px 10px!important; margin:5px; font-size:14px; line-height:20px; color:#525459!important; transition:background 0.25s, color 0.25s; white-space: normal;} .navbarmain .navdropdown a:hover{background:#3e3f3e!important; color:#ffffff!important;} .navbar-nav .open .dropdown-menu {position: static; float: none; width: auto; margin-top: 0; background-color: transparent; border: 0; -webkit-box-shadow: none; box-shadow: none;}}@media (max-width: 480px) {.navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse {max-height: 340px!important;}}@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : landscape) {.navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse {max-height: 230px!important;}}@media only screen and (min-device-width: 480px) and (max-device-width: 992px) and (orientation: landscape) {.navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse {max-height: 330px!important;}} #sidechat{cursor: pointer; width:135px; height:43px; position: fixed; bottom:0px; right:0px; visibility: visible; z-index:10000;} #copyrightContainer{font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; font-size:13px; background-color:#e7e7e7; width:100%; position: relative;} .copyrightHolder{top: 0; left: 0; right: 0; left: 0; text-align: center; height: 100%; vertical-align: middle; padding:10px; background-color:#e7e7e7;} .serviceAlbertaLicenseFooterImage {background-image: url(https://utilitynet.s3.amazonaws.com/public/images/retailer/utilitynet/utilitynet-small-logo.png); background-repeat: no-repeat; background-position: center center; width: 250px; height: 48px; display: inline-block;} .serviceAlbertaLicenseFooterText{display: inline-block; margin-top:10px; vertical-align: top; line-height: 20px; width: 55%; padding: 0px 10px 0px 10px;} @media (max-width: 992px) {.serviceAlbertaLicenseFooterText{display: inline-block; margin-top:5px; margin-bottom:10px; vertical-align: top; padding:0px 0px 25px 0px; width: 100%;}}