/* Google Fonts Import for Open Sans */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

/* Added the below font is for react component*/
@font-face {
	font-family: 'open-sans';
	src: url('../fonts/OpenSans-Regular.ttf') format('truetype');
	font-display: swap;
}

/* global CSS Properties */
*{
  margin: 0;
  padding: 0;
  font-family: "Open Sans", sans-serif;
  scroll-behavior: smooth;
  scroll-padding-top: 1rem;
  text-decoration: none;
  box-sizing: border-box;
  list-style: none;
  text-decoration: none;
}

:root {
  --Color-surface-heather: #F5F5F5;
  --Color-text-color: #101820;
  --Color-divider-primary: #A5B7BA;
  --Color-surface-black: #000000;
  --Color-text-white:  #FFFFFF;
  --gradient-button: #FEC711;
  --Spacing-0: 0px;
  --Spacing-1: 4px;
  --Spacing-2: 8px;
  --Spacing-3: 12px;
  --Spacing-4: 16px;
  --Color-divider-primary: #A5B7BA;
  --Input-sapField_Background: #FFF;
  --Color-surface-heather: #F5F5F5;
  --Color-text-grey: #101820;
  --Color-text-black: #000000;
  --Color-surface-grey: #53565A;
  font-family: 'Open Sans', sans-serif;
  --Fonts-Line-Height-x-sm:20px;
  --Fonts-Line-Height-sm:24px;
  /* bread-crumbs related variables */
  --Color-text-blue: #1A76C5;
  --Color-text-grey: #101820;
}

body{
  color: var(--Color-text-color);
  white-space: normal;
}

.container{
  margin-left: 0;
  margin-right: 0;
}

.sce-redesign-content .layout-content > :last-child {
  padding-bottom: 32px;
}

@media only screen and (max-width: 1023.9px) {
  .sce-redesign-content .layout-content > :last-child {
    padding-bottom: 16px;
  }
}

/* Custom styling for breadcrumbs starts here */

#scebreadcrumb {
  padding: 20px 0px 20px 0px;
  margin: 0;
}
.breadcrumb-navigation {
  padding: 0;
  font-family: "Open Sans";
}
.breadcrumb-navigation>li {
  display: inline;
}
.breadcrumb-navigation>li.active,
.breadcrumb-navigation>li.active>a {
  color: var(--Color-text-blue);
}
/*.breadcrumb-navigation li+li:before {
  font-size: 14px;
  content: '/ ';
  color: var(--Color-text-grey);
}*/
.breadcrumb-navigation>li>a,
.breadcrumb-navigation>li>a:focus,
.breadcrumb-navigation>li>a:active {
  text-decoration: none;
  color: var(--Color-text-grey);
  font-size: 14px;
  line-height: 130%;
}
.breadcrumb-navigation>li.active>a,
.breadcrumb-navigation>li.active>a:focus,
.breadcrumb-navigation>li.active>a:active {
  color: var(--Color-text-blue);
}
.breadcrumb-navigation>li>a:hover {
  text-decoration: underline;
}

@media screen and (max-width:640px) {
  .breadcrumb-navigation>li>a,
  .breadcrumb-navigation>li>a:focus,
  .breadcrumb-navigation>li>a:active {
    font-size: 12px;
  }
}

/* Custom styling for breadcrumbs ends here */

/* styling for footer starts here  */

/* container */
.footer-main-wrapper .container{
    margin-left: 0;
    margin-right: 0;
}
/* footer main css */
.footer-main-wrapper {
    background-color: var(--Semantic-Scale-Edison-Heather-500);
}
.footer-main-wrapper .footer-main{
    padding: var(--Spacing-Spacing-x6) 160px;
    background-color: var(--Semantic-Scale-Edison-Heather-500); 
}
.footer-main-wrapper .footer-main-hyperlink{
    padding: var(--spacing-spacing-xs) 160px;
    background-color: var(--Semantic-Scale-Edison-Heather-500); 
    white-space: nowrap;
}
.footer-main-wrapper .footer-main-black{
    padding: 16px 160px 16px 160px;
}
/* Main CSS */
.footer-main-wrapper .box{
    display: flex;
    justify-content: space-between;
    position: relative;
    column-gap: 32px;
}
.footer-main-wrapper .dropdown-menu{
    height: 48px;
    width: 250px;
    border: 1px 0px 0px 0px;
    border-radius: 4px;
    padding: 8px 16px 8px 16px;
}
.footer-main-wrapper .dropdown-main{
    white-space: nowrap;
}
.footer-main-wrapper .menu{
    font-size: 16px !important;
    text-align: left;
    width: 100%;
    flex: 1;
}
.footer-main-wrapper .footer-heading {
    color: var(--Text-Black);
    font-family: var(--Font-Family);
    font-size: var(--Font-Size-SM);
    font-style: normal;
    font-weight: 700;
    line-height: var(--Font-Line-Height-MED);
    margin: 0px;
}
.footer-main-wrapper ol,.footer-main-wrapper ul {
    padding-left: 0px !important;
}
.footer-main-wrapper dl,.footer-main-wrapper ol,.footer-main-wrapper ul {
    margin-bottom: 0px !important;
}
.footer-main-wrapper .paragraph-title{
    min-height: 50px;
    line-height: 150%;
    font-weight: 600;
    white-space: nowrap;
    border-bottom: 1px solid var(--Semantic-Scale-Sage-700);
    padding: var(--spacing-2) var(--spacing-4) var(--spacing-2) 16px;
    display: flex;
    align-items: center;
} 
.footer-main-wrapper .partners-text-mobile{
    display: none;
}
.footer-main-wrapper .up-down-arrow {
    height: 16px;
    width: 16px;
    display: none;
}  
.footer-main-wrapper .up-down-arrow-rotate{
    height: 16px;
    width: 16px;
    display: none;
    transform: rotate(180deg);
}
.footer-main-wrapper .footer-main-li-content{
    min-height: 50px;
    text-wrap: auto;
    color: var(--Text-Black);
    font-family: var(--Font-Family);
    font-size: var(--Font-Size-SM);
    font-style: normal;
    font-weight: 400;
    line-height: var(--Font-Line-Height-MED);
    border-bottom: 1px solid var(--Semantic-Scale-Sage-700);
    padding: var(--spacing-2) var(--spacing-4) var(--spacing-2) 16px;
    display: flex;
    align-items: center;
}
.footer-main-wrapper .footer-menu{
    position: relative;
    display: flex;
    justify-content: space-between;
    text-align: center;
    align-self: stretch;
    align-items: center;
}
.footer-main-wrapper .footer-hyperlinks{
    position: relative;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.footer-main-wrapper .footer-hyperlink-icons {
    display: flex;
    padding: 0 0;
    justify-content: flex-end;
    height: 32px;
    align-items: center;
    gap: var(--spacing-spacing-sm);
}
.footer-main-wrapper .footer-bottom-heading{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.footer-main-wrapper .footer-li-hyperlinks{
    display: inline-block;
    color: var(--Text-Primary);
    font-family: var(--Font-Family);
    font-size: var(--Font-Size-SM);
    font-style: normal;
    font-weight: 400;
    line-height: var(--Font-Line-Height-MED);
    padding: var(--spacing-2) var(--spacing-4) var(--spacing-2) 16px;
} 
.footer-main-wrapper .remove-border{
    border-bottom: none;
    padding: 0;
    margin: 0;
}
.footer-main-wrapper .footer-li-hyperlinks-div{
    display: flex;
    justify-content: space-around;
    gap: 32px;
    align-items: center;
    padding: 0;
    margin: 0;
    line-height: var(--Font-Line-Height-MED);
}
.footer-main-wrapper .footer-li-hyperlinks-last-div{
    display: flex;
    justify-content: space-around;
    gap: 10px;
    align-items: center;
    padding-top: 2px;
}
.footer-main-wrapper .hyperlink-arrow{
    width: 24px;
    height: 24px;
    margin-left: 16px;
}
.footer-main-wrapper .social-icon{
    height: 24px;
    width: 24px;
    background-color: var(--Semantic-Scale-Edison-Heather-500);
}
.footer-main-wrapper .footer-copyright{
    display: flex;
    font-weight: 400;
    font-size: 14px;
    justify-content: space-between;
    align-items: center;    
    background-color: #111;
}
.footer-main-wrapper .footer-wrapper{
    position: relative;
}
.footer-main-wrapper .footer-copyright-text{
    color: var(--Text-White);
    padding: 1.5px 0px 1.5px 16px;
    display: flex;
    justify-content: space-between;
}
.footer-main-wrapper .footer-copyright-text-icon{
    color: var(--Text-White);
    padding: 1.5px 4px 1.5px 4px;
}
.footer-main-wrapper .span-footer{
  display: flex;
}

.footer-main-wrapper .sce-image-logo{
    height: 25.41px;
    width: 90px;
}

/* Accordian CSS */
.footer-main-wrapper .accordion-content{
    display: block;
}

.footer-main-wrapper .accordion-content-active{
    display: block;
}

/* Chat Icon CSS */
.footer-main-wrapper .chatIcon{
    width: 64px;
    height:64px;
    padding: 14.7px;
    position: absolute;
    right: 8px;
    top: -50px;
    background-color: var(--gradient-button);
    border-radius: 50px;
}

/* Hyperlink/Anchor Tag CSS */
footer.footer-main-wrapper a,footer.footer-main-wrapper u {
    text-decoration: none;
    color: var(--Color-text-color);
    cursor: pointer;
}

footer.footer-main-wrapper a,
footer.footer-main-wrapper a:visited,
footer.footer-main-wrapper a:hover,
footer.footer-main-wrapper a:active {
    color: inherit !important;
}

/* Language Selector Drop Down CSS */

.footer-main .mainContainer {
    display: flex;
    flex-direction: column;
    height: fit-content;
    width: 256px;
    align-items: flex-start;
    gap: 0px;
    color: var(--Text-Primary);
    padding: var(--spacing-2) var(--spacing-2) var(--spacing-2) var(--spacing-4);
    border-radius: var(--Border-Radius-Radius-Sm);
    border: 1px solid var(--Semantic-Scale-Sage-700);
    background: var(--Background-Theme-Primary);
}

.footer-main .inputMainContainer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    cursor: pointer;
    color: var(--Text-Primary);
    font-family: var(--Font-Family);
    font-size: var(--Font-Size-SM);
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}

.footer-main .results-container {
    display: none;
    flex-direction: column;
    width: 100%;
    max-height: 152px;
    overflow-y: scroll;  /* Changed from auto to scroll */
    padding: var(--spacing-2) 0;
    margin-top: 10px;
    color: var(--Text-Primary);
    background: var(--Background-Theme-Primary);
    border-top: 1px solid var(--Semantic-Scale-Sage-700);
    -webkit-overflow-scrolling: touch; /* Ensures smooth scrolling on iOS */
    gap: 4px;
}

.footer-main .results-container li {
    list-style: none;
}

.footer-main .l-s-resultItem {
    cursor: pointer;
    color: var(--Text-Primary);
    font-family: var(--Font-Family);
    font-size: var(--Font-Size-SM);
    font-style: normal;
    font-weight: 400;
    line-height: var(--Font-Line-Height-MED);
}

.footer-main .l-s-resultItem:hover {
    background-color: var(--Semantic-Scale-Edison-Heather-500);
    font-family: var(--Font-Family);
}

.footer-main .results-container::-webkit-scrollbar {
    width: 4px;
    display: block; /* Ensures scrollbar is always visible */
}

.footer-main .results-container::-webkit-scrollbar-track {
    background: var(--Semantic-Scale-Edison-Heather-500);
    border-radius: 4px;
    margin-top: var(--Spacing-2);
}

.footer-main .results-container::-webkit-scrollbar-thumb {
    background: var(--Semantic-Scale-Sage-700);
    border-radius: 4px;
}

.footer-main .results-container::-webkit-scrollbar-thumb:hover {
    background: var(--Semantic-Scale-Sage-700);
}

.footer-main-wrapper #l-s-dynamicLanguage {
    color: var(--Text-Primary);
    font-family: var(--Font-Family);
    font-size: var(--Font-Size-SM);
    font-style: normal;
    font-weight: 700;
    line-height: var(--Font-Line-Height-MED);
}

.footer-main-wrapper .edison-logo-padding {
    padding-right: 4px;
}

.footer-main .box{
    padding: 0;
    max-width: 100%;
}
.footer-main-wrapper .footer-settings{
    display:none;
}
.footer-main-wrapper .footer-set-hyperlinks{
    display:none;
}
.footer-main-wrapper.full-footer .footer-settings{
    display:block;
}
.footer-main-wrapper.full-footer .footer-set-hyperlinks{
    display:block;
}
/* CXR-8817-Underline on hover code start */
.footer-main-li-content a:hover,.footer-heading a:hover, 
.footer-li-hyperlinks-a-div a:hover, .footer-copyright-text a:hover{
    text-decoration: underline !important;
}
/* code end */
@media screen and (max-width: 1024.1px) and (min-width: 782.1px) {
    .footer-main, 
    .footer-main-black{
        padding: 10px 10px 10px 10px;
    }  
    .footer-main-wrapper .footer-main-hyperlink{
        padding: 8px 10px 8px 10px;
    }
    .footer-main-wrapper .chatIcon{
        top: -34px;
        display: flex;
        width: 48px;
        height: 48px;
        padding: 11px;
        align-items: center;
    }
}

/* Tablet and Mobile View S M L Screens */
@media only screen and (max-width: 1023.9px) {
    .footer-main-wrapper .menu {
        height: auto;
        padding: 0px;
        width: auto;
    }
    .footer-main .mainContainer, 
    .footer-main .inputMainContainer,
    .footer-main .results-container{
        max-width: 100%;
        min-height: 100%;
    }
    .footer-main-wrapper .container {
        padding-right: 0px !important;
        padding-left: 0px !important;
    }
    .footer-main-wrapper .dropdown-main{
        margin-top: 5px;
    }
    .footer-main-wrapper .dropdown-menu{
        padding: 8px 16px 8px 16px;
        width: 100%;
    }
    .footer-main-wrapper .footer-main{
        padding: 0;
    }
    .footer-main-wrapper .footer-main-hyperlink{
        padding: 0px;
    }
    .footer-main-wrapper .footer-main-black{
        padding: 8px 16px 8px 16px;
    }
    .footer-main-wrapper .box{
        flex-direction: column;
    }
    .footer-main-wrapper .footer-menu{
        flex-direction: column;
        padding: 0px;
    }
    .footer-main-wrapper .footer-main-li-content{
        font-size: 14px;
        padding: var(--spacing-2) var(--spacing-4) var(--spacing-2) 24px;
        color: var(--Text-Black);
        font-family: var(--Font-Family);
        font-size: var(--Font-Size-SM);
        font-style: normal;
        font-weight: 400;
        line-height: var(--Font-Line-Height-MED);
        border-bottom: 1px solid var(--Semantic-Scale-Sage-700);
        background: var(--Semantic-Scale-Edison-Heather-500);
        height: 50px;
        align-items: center;
        display: flex;
    }
    .footer-main-wrapper .paragraph-title {
        display: flex;
        justify-content: space-between;
        font-weight: 600;
    }
    .footer-main-wrapper .partners-text-laptop{
        display: none;
    }
    .footer-main-wrapper .partners-text-mobile{
        display: block;
    }
    .footer-main-wrapper .up-down-arrow-rotate{
        transform: rotate(180deg);
        display: block;
    }
    .footer-main-wrapper .footer-hyperlinks{
        display: block;
        width: 100%;
    }
    .footer-main-wrapper .footer-li-hyperlinks-div{
        width: 100%;
        justify-content: space-between;
        align-items: center;
    }
    .footer-main-wrapper .footer-verticle-line-div {
        display: none;
    }
    .footer-main-wrapper .footer-li-hyperlinks{
        display: flex;
        justify-content: space-between;
        align-items: center;
        font-size: 14px;
        height: 50px;
        color: var(--Text-Black);
        font-family: var(--Font-Family);
        font-size: var(--Font-Size-SM);
        font-style: normal;
        font-weight: 400;
        line-height: var(--Font-Line-Height-MED);
        border-bottom: 1px solid var(--Semantic-Scale-Sage-700);
        padding: var(--spacing-2) var(--spacing-4) var(--spacing-2) 16px;
    }
    .footer-main-wrapper .footer-hyperlink-icons {
        padding: var(--spacing-spacing-xxs) 0px;
        height: 46px;
    }
    .footer-main-wrapper .remove-border{
        border-bottom: none;
        padding: 4px 4px 4px 4px;
    }
    .footer-main-wrapper .footer-copyright{
        flex-direction: column;
        width: 100%;
        height: auto;
    }
    .footer-main-wrapper .display-icon{
        flex-direction: row;
        justify-content: center;
        height: 72px;
    }
    .footer-main-wrapper .footer-bottom-heading{
        display: flex;
    }
    .footer-main-wrapper .span-footer{
        display: flex;
        flex-direction: row;
    }
    .footer-main-wrapper .footer-bottom-logo{
        flex-direction: row;
    }
    .footer-main-wrapper .footer-verticle-line{
        display: none;
    }
    .footer-main-wrapper .footer-bottom-heading-mobile-view{
        display: block;
    }
    .footer-main-wrapper .footer-menu .accordion-content{
        display: none;
        overflow: hidden;
        transition: 0.4s ease-out;
    }
    .footer-main-wrapper .footer-copyright-text{
        color: var(--Text-White);
        padding: 1.5px 4px 1.5px 16px;
    }
    .footer-main-wrapper .footer-copyright-text-icon{
        color: var(--Text-White);
        padding: 1.5px 4px 1.5px 4px;
    }
    .footer-main-wrapper .copyright-padding {
        padding-left: 23px;
    }
    .footer-main-wrapper .chatIcon{
        top: -36px;
        display: flex;
        width: 48px;
        height: 48px;
        padding: 11px;
        align-items: center;
    }
    .footer-main .mainContainer{
        margin-left: 16px;
        margin-right: 16px;
        margin-top: 0px;
        width: auto;
        margin: 24px var(--spacing-4) 8px var(--spacing-4);
    }
    .footer-main .inputMainContainer{
        font-size: 14px;
    }
    .footer-main .footer-heading{
        font-size: 14px;
    }
    .footer-main-wrapper .footer-heading {
        color: var(--Text-Black);
        font-family: var(--Font-Family);
        font-size: var(--Font-Size-SM);
        font-style: normal;
        font-weight: 700;
        line-height: var(--Font-Line-Height-MED);
        margin: 0;
    }
    .footer-main-wrapper .hyperlink-arrow {
        vertical-align: middle;
    }
    .footer-main .paragraph-title{
        height: 50px;
        align-items: center;
    }
    .footer-main .box{
        margin:0;
        max-width: 100%;
    }
    .footer-main .l-s-resultItem{
        font-size: 14px;
    }
    .footer-li-hyperlinks-a-div{
    width: 100%;
}
.footer-li-hyperlinks-a-div a{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}
}
.footer-li-hyperlinks-a-div a {
    display: flex;
    gap: 10px;
    align-items:center
}

@media screen and (max-width: 1320px) and (min-width: 1024px) {
    .footer-main-wrapper .footer-main-hyperlink {
        padding: var(--spacing-spacing-xs) 0px;
    }
    .footer-main-wrapper .footer-menu {
        justify-content: space-evenly;
    }
}

@media screen and (max-width: 1100px) and (min-width: 1024px) {
  .footer-main-wrapper .footer-li-hyperlinks-div {
      gap: 16px;
  }
}

/* footer no-nav start here */
.footer-main-wrapper .footer-wrapper-no-nav {
    width: 100%;
}

.footer-main-wrapper .footer-wrapper-no-nav .footer-main-black {
    min-height: 48px;
    padding: 16px 160px;
}

.footer-main-wrapper .footer-wrapper-no-nav .footer-copyright {
    display: flex;
    font-weight: 400;
    font-size: 14px;
    gap: 12px;
    justify-content: space-between;
    align-items: center;
    background-color: #111;
}

.footer-main-wrapper .footer-wrapper-no-nav .footer-copyright-text {
    padding: 0;
    display: flex;
    justify-content: space-between;
    position: relative;
    text-align: left;
    color: var(--Text-White);
    font-family: var(--Font-Family);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: var(--Font-Line-Height-SM);
}

.footer-message-text {
  background-color: #111;
  text-align: center;
  font-size: 12px;
  font-weight: 400
}
.footermessage p{
  color: var(--Text-White);
}
.footer-main-wrapper .footer-wrapper-no-nav .footer-copyright-text a {
    position: relative;
    text-align: left;
    color: var(--Text-White);
    font-family: var(--Font-Family);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: var(--Font-Line-Height-SM);
}

.footer-main-wrapper .footer-wrapper-no-nav .span-footer {
    display: flex;
    gap: 24px;
}

.footer-main-wrapper .footer-wrapper-no-nav .sce-image-logo {
    width: 90px;
    height: 26px;
}

.footer-main-wrapper .footer-wrapper-no-nav .edison-logo-padding {
    padding-right: 0;
}

.footer-main-wrapper .footer-copyrights .edison-logo-padding a{
    display: inline-block;
}

.footer-main-wrapper .footer-wrapper-no-nav .frame-child {
    position: relative;
    width: 134px;
    height: 12px;
}

.footer-main-wrapper .footer-wrapper-no-nav .header-line-icon {
    width: 4px;
    position: relative;
    height: 18px;
    object-fit: contain;
}

.footer-main-wrapper .footer-wrapper-no-nav .footer-bottom-heading {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 16px;
}

.footer-main-wrapper .footer-wrapper-no-nav .footer-bottom-tail {
    align-items: start !important;
}

.footer-wrapper-no-nav .footer-bottom-heading-mobile-view {
    gap: 24px !important;
}

.span-footer .footer-copyright-text {
    padding-right: 5px !important;
}

@media screen and (max-width: 1024.1px) and (min-width: 782.1px) {
    .footer-main-wrapper .footer-wrapper-no-nav .footer-main-black {
        padding: 10px 10px 10px 10px;
    }
}

/* Tablet and Mobile View S M L Screens */
@media only screen and (max-width: 1023.9px) {
    .footer-main-wrapper .footer-wrapper-no-nav .footer-main-black {
        padding: 24px var(--spacing-spacing-md);
    }

    .footer-main-wrapper .footer-wrapper-no-nav .footer-copyright {
        flex-direction: column;
        width: 100%;
        height: auto;
        gap: 16px;
    }

    .footer-main-wrapper .footer-wrapper-no-nav .footer-copyright-text a {
        position: relative;
        text-align: left;
        color: var(--Text-Primary);
        font-family: var(--Font-Family);
        font-size: var(--Font-Size-2XS);
        font-style: normal;
        font-weight: 400;
        line-height: var(--Font-Line-Height-SM);
    }

    .footer-main-wrapper .footer-wrapper-no-nav .footer-copyright-text {
        position: relative;
        text-align: left;
        color: #FFF;
        font-family: var(--Font-Family);
        font-size: 12px;
        font-style: normal;
        font-weight: 400;
        line-height: var(--Font-Line-Height-SM);
    }

    .footer-main-wrapper .footer-wrapper-no-nav .copyright-padding {
        padding-left: 0px;
        display: flex;
        justify-content: space-evenly;
        padding-top: 24px;
    }

    .footer-main-wrapper .footer-wrapper-no-nav .header-line-icon {
        width: 4px;
        position: relative;
        height: 18px;
        object-fit: contain;
    }

    .footer-main-wrapper .footer-wrapper-no-nav .footer-bottom-heading {
        display: flex;
        gap: var(--spacing-spacing-xs);
    }

    .footer-main-wrapper .footer-wrapper-no-nav .footer-bottom-logo {
        flex-direction: row;
    }

    .footer-main-wrapper .footer-wrapper-no-nav .footer-bottom-heading-mobile-view {
        display: block;
    }

    .footer-main-wrapper .footer-wrapper-no-nav .span-footer {
        display: flex;
        flex-direction: row;
        justify-content: center;
        flex-wrap: wrap;
    }
}
/* footer no-nav ends here */

/* styling for footer ends here  */

/* Font Family changes for React Component */
react-centralized-guest, react-rateanalyser-landingpage, react-rateanalyser-landingpage div, react-rateanalyser-landingpage span {
  font-family: "open-sans";
}
#calculator {  n
  padding: 40px 0 10px 0; }
  #calculator *, #calculator *:before, #calculator *:after {
  box-sizing: border-box; }
  #calculator > .holder {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  background-color: #f6f6f6; }
  @media (min-width: 969px) {
  #calculator > .holder {
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap; } }
  #calculator > .holder .left-side {
  max-width: 100%;
  -webkit-flex-basis: 100%;
  -ms-flex-preferred-size: 100%;
  flex-basis: 100%;
  padding: 20px;
  border-bottom: 1px solid #ccc; }
  @media (min-width: 969px) {
  #calculator > .holder .left-side {
  max-width: 40%;
  -webkit-flex-basis: 40%;
  -ms-flex-preferred-size: 40%;
  flex-basis: 40%; } }
  #calculator > .holder .left-side:after {
  content: none; }
  @media (min-width: 969px) {
  #calculator > .holder .left-side {
  border-bottom: 0px;
  border-right: 1px solid #ccc; } }
  #calculator > .holder .left-side form {
  box-sizing: border-box; }
  #calculator > .holder .left-side form .input-wrapper {
  width: 100%;
  font-size: 18px;
  line-height: 30px;
  margin-bottom: 10px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap; }
  @media (min-width: 551px) {
  #calculator > .holder .left-side form .input-wrapper {
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
    flex-wrap: nowrap; } }
  #calculator > .holder .left-side form .input-wrapper .screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  height: 1px;
  width: 1px;
  overflow: hidden;
  position: absolute !important; }
  #calculator > .holder .left-side form .input-wrapper .label {
  font-weight: bold;
  width: 100%;
  margin: 0 auto;
  color:black;
  font-size:20px;
  line-height: 2;
  text-align: left;
  -webkit-flex-basis: 100%;
  -ms-flex-preferred-size: 100%;
  flex-basis: 100%;
  max-width: 100%; }
  @media (min-width: 551px) {
  #calculator > .holder .left-side form .input-wrapper .label {
  -webkit-flex-basis: 33%;
  -ms-flex-preferred-size: 33%;
    flex-basis: 33%;
  max-width: 33%; } }
  #calculator > .holder .left-side form .input-wrapper select {
  overflow: hidden;
  background: url(../images/dropdown-arrow.png) no-repeat right #fff;
  border: 1px solid #b7b7b7;
  width: 100%;
  font-size: 18px;
  border-radius: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  color: #000;
  padding: 10px 15px 10px 2%;
  line-height: 22px;
  -webkit-flex-basis: 100%;
  -ms-flex-preferred-size: 100%;
  flex-basis: 100%;
  max-width: 100%; }
  @media (min-width: 551px) {
  #calculator > .holder .left-side form .input-wrapper select {
  -webkit-flex-basis: 66%;
  -ms-flex-preferred-size: 66%;
    flex-basis: 66%;
  max-width: 66%; } }
  #calculator > .holder .left-side form .input-wrapper select option {
  padding-left: 25px; }
  #calculator > .holder .left-side form .input-wrapper select::-ms-expand {
  display: none; }
  #calculator > .holder .left-side form .calculate-holder {
  margin: 0 auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center; }
  #calculator > .holder .left-side form .calculate-holder .calculate {
  height: 50px;
  background-color: #ccc;
  -webkit-transition-duration: .3s;
  transition-duration: .3s;
  -webkit-transition-property: background-color;
  transition-property: background-color;
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  line-height: .9375em;
  padding: 0.6em 3.55em;
  font-size: 22px;
  font-weight: 400;
  color: #000;
  text-decoration: none;
  margin-top: 20px;
  border: 0;
  cursor: initial; }
  #calculator > .holder .left-side form .calculate-holder .calculate.enabled {
  cursor: pointer;
  -webkit-transition: 1s;
  transition: 1s;
  background-color: #317400;
  color: #fff; }
  #calculator > .holder .left-side form .reset-holder {
  text-align: center;
  margin-top: 10px;
  min-height: 22px; }
  #calculator > .holder .left-side form .reset-holder .reset {
  display: none;
  padding-top: 10px; }
  #calculator > .holder .results-output {
  max-width: 100%;
  -webkit-flex-basis: 100%;
  -ms-flex-preferred-size: 100%;
  flex-basis: 100%;
  padding: 20px; }
  @media (min-width: 969px) {
  #calculator > .holder .results-output {
  max-width: 60%;
  -webkit-flex-basis: 60%;
  -ms-flex-preferred-size: 60%;
  flex-basis: 60%; } }
  #calculator > .holder .results-output .holder-box .click-container {
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  width: 100%;
  position: relative;
  height: 520px; }
  @media (min-width: 400px) {
  #calculator > .holder .results-output .holder-box .click-container {
  height: 450px; } }
  @media (min-width: 669px) {
  #calculator > .holder .results-output .holder-box .click-container {
  height: 282px; } }
  #calculator > .holder .results-output .holder-box .click-container.card-click.flipped .front {
  -webkit-transform: perspective(800px) rotateY(180deg);
  transform: perspective(800px) rotateY(180deg); }
  #calculator > .holder .results-output .holder-box .click-container.card-click.flipped .back {
  -webkit-transform: perspective(800px) rotateY(0deg);
  transform: perspective(800px) rotateY(0deg); }
  #calculator > .holder .results-output .holder-box .click-container .front {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition: 1s;
  transition: 1s;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  -webkit-transform: perspective(800px) rotateY(0deg);
  transform: perspective(800px) rotateY(0deg);
  width: 100%;
  height: 520px;
  background: url(../images/hero_image.jpg) no-repeat;
  background-position: center; }
  @media (min-width: 400px) {
  #calculator > .holder .results-output .holder-box .click-container .front {
  height: 450px; } }
  @media (min-width: 669px) {
  #calculator > .holder .results-output .holder-box .click-container .front {
  height: 282px; } }
  @media (min-width: 768px) {
  #calculator > .holder .results-output .holder-box .click-container .front {
  background-size: 100%; } }
  #calculator > .holder .results-output .holder-box .click-container .back {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 520px;
  -webkit-transition: 1s;
  transition: 1s;
  -webkit-transform: perspective(800px) rotateY(-180deg);
  transform: perspective(800px) rotateY(-180deg);
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden; }
  @media (min-width: 400px) {
  #calculator > .holder .results-output .holder-box .click-container .back {
  height: 450px; } }
  @media (min-width: 669px) {
  #calculator > .holder .results-output .holder-box .click-container .back {
  height: 282px; } }
  #calculator > .holder .results-output .holder-box .click-container .back .back-content {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 520px;
  background-color: #fff;
  background-color: #fff; }
  @media (min-width: 400px) {
  #calculator > .holder .results-output .holder-box .click-container .back .back-content {
  height: 450px; } }
  @media (min-width: 669px) {
  #calculator > .holder .results-output .holder-box .click-container .back .back-content {
  height: 282px; } }
  #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
    justify-content: space-between;
  width: 100%;
  -webkit-flex-basis: 100%;
  -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
  max-width: 100%;
  margin: 0 auto;
  text-align: center;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  padding: 10px; }
  #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .icon-box {
  -webkit-flex-basis: 100%;
  -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
  max-width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
    justify-content: center;
  -webkit-align-content: center;
  -ms-flex-line-pack: center;
    align-content: center; }
  @media (min-width: 669px) {
  #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .icon-box {
  -webkit-flex-basis: 27%;
    -ms-flex-preferred-size: 27%;
      flex-basis: 27%;
  max-width: 27%; } }
  #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .icon-box img {
  width: 90px;
  height: 90px; }
  #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .icon-box .icon-description {
  font-size: 20px;
  font-weight: 400;
  line-height: 1.2;
  padding-bottom: 8px;
  margin-top: 12px;
  -webkit-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
      flex-basis: 100%;
  max-width: 100%; }
  #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .icon-box .icon-description-sub {
  padding: 0 10px;
  font-size: 14px;
  color: #363636;
  -webkit-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
      flex-basis: 100%;
  max-width: 100%; }
  #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table {
  -webkit-flex-basis: 100%;
  -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
  max-width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  -webkit-align-content: stretch;
  -ms-flex-line-pack: stretch;
    align-content: stretch; }
  @media (min-width: 669px) {
  #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table {
  -webkit-flex-basis: 73%;
    -ms-flex-preferred-size: 73%;
      flex-basis: 73%;
  max-width: 73%; } }
  #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder {
  -webkit-flex-basis: 100%;
    -ms-flex-preferred-size: 100%;
      flex-basis: 100%;
  max-width: 100%;
  -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  padding-top: 10px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  border-top: 1px solid #626262; }
  #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder.border-top-hide {
  border-top: 0px; }
  #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder.holder-flex {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex; }
  #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder.holder-hide {
  display: none; }
  #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder .cost {
  -webkit-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
      flex-basis: 50%;
  max-width: 50%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-align-content: center;
    -ms-flex-line-pack: center;
      align-content: center; }
  #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder .cost .cost-wrap {
    text-align: center;
    padding-left: 0;
    -webkit-flex-basis: 100%;
      -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
    max-width: 100%; }
    #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder .cost .cost-wrap .dollar, #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder .cost .cost-wrap .currencydot, #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder .cost .cost-wrap .change {
    font-size: 25px;
    color: #000000;
    font-weight: 400;
    line-height: 1.2; }
    #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder .cost .cost-wrap .dollar, #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder .cost .cost-wrap .change {
    vertical-align: top; }
    #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder .cost .cost-wrap .dollars {
    font-size: 38px;
    color: #000000;
    font-weight: 400;
    line-height: .9;
    padding-bottom: 4px;
    vertical-align: top; }
    @media (min-width: 669px) {
      #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder .cost .cost-wrap .dollars {
      font-size: 50px; } }
  #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder .cost .cost-label {
    -webkit-flex-basis: 100%;
      -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
    max-width: 100%;
    font-size: 16px;
    color: #626262;
    text-align: center; }
  #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder .description {
  -webkit-flex-basis: 50%;
    -ms-flex-preferred-size: 50%;
      flex-basis: 50%;
  max-width: 50%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-align-content: center;
    -ms-flex-line-pack: center;
      align-content: center; }
  #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder .description .line-1 {
    color: #000000;
    font-weight: 400;
    line-height: 1.2;
    -webkit-flex-basis: 100%;
      -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
    max-width: 100%;
    font-size: 20px; }
    @media (min-width: 669px) {
    #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder .description .line-1 {
      font-size: 23px; } }
  #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder .description .line-2, #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder .description .line-3 {
    color: #626262;
    line-height: 1.3;
    -webkit-flex-basis: 100%;
      -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
    max-width: 100%;
    font-size: 18px; }
    @media (min-width: 669px) {
    #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder .description .line-2, #calculator > .holder .results-output .holder-box .click-container .back .back-content > .holder .pricing-table > .holder .description .line-3 {
      font-size: 20px; } }
   .select-para {
     width: 100%;
   }
   .sce-calc-message, .sce-calc-json {
     display: none;
   }
  
  /* End hybrid page: calculator code */
  /* charge port estimator starts */
.clearfix:after {
  content: "";
  display: table;
  clear: both; }

.full-width {
  width: 100%; }

#port-estimator {
  padding: 40px 0 10px 0; }
  #port-estimator > .holder {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    background-color: #f6f6f6; }
    @media (min-width: 768px) {
      #port-estimator > .holder {
        -webkit-flex-wrap: nowrap;
            -ms-flex-wrap: nowrap;
                flex-wrap: nowrap;
        padding: 20px 0; } }
    #port-estimator > .holder .divisionElementCustom {
      width: 100%;
      padding: 0 20px; }
      @media (min-width: 768px) {
        #port-estimator > .holder .divisionElementCustom {
          width: 50%; } }
      #port-estimator > .holder .divisionElementCustom:after {
        content: none; }
      #port-estimator > .holder .divisionElementCustom p {
        padding: 15px 0; }
      #port-estimator > .holder .divisionElementCustom:nth-child(2) {
        border-top: 1px solid #ccc; }
        @media (min-width: 768px) {
          #port-estimator > .holder .divisionElementCustom:nth-child(2) {
            border-top: 0;
            border-left: 1px solid #ccc; } }
    #port-estimator > .holder .form-inputs {
      -webkit-flex-basis: 100%;
          -ms-flex-preferred-size: 100%;
              flex-basis: 100%;
      padding: 20px; }
      @media (min-width: 768px) {
        #port-estimator > .holder .form-inputs {
          padding-bottom: 0;
          -webkit-flex-basis: 50%;
              -ms-flex-preferred-size: 50%;
                  flex-basis: 50%; } }
      #port-estimator > .holder .form-inputs .contentRowCustom {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
            -ms-flex-wrap: wrap;
                flex-wrap: wrap; }
      #port-estimator > .holder .form-inputs .form-inputs-top .zplk-wrapper {
        width: 100%;
        font-size: 18px;
        line-height: 30px;
        margin-bottom: 10px;
        padding-top: 10px;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
            -ms-flex-wrap: wrap;
                flex-wrap: wrap; }
        @media (max-width: 1100px) {
          #port-estimator > .holder .form-inputs .form-inputs-top .zplk-wrapper {
            margin: 0 auto 5px auto;
            padding-top: 15px; } }
        #port-estimator > .holder .form-inputs .form-inputs-top .zplk-wrapper .label {
          font-weight: bold;
          width: 100%;
          margin: 0 auto;
          padding-right: 2%; 
		  color:black;
		  text-align:left;
		  font-size: 18px;
		  white-space: normal;
          line-height: 30px;
		  }
          @media (min-width: 551px) {
            #port-estimator > .holder .form-inputs .form-inputs-top .zplk-wrapper .label {
              width: 40%;
              margin: 0; } }
          @media (min-width: 1101px) {
            #port-estimator > .holder .form-inputs .form-inputs-top .zplk-wrapper .label {
              width: 49%; } }
        #port-estimator > .holder .form-inputs .form-inputs-top .zplk-wrapper select {
          overflow: hidden;
          background: url(../images/dropdown-arrow.png) no-repeat right #fff;
          border: 1px solid #b7b7b7;
          width: 100%;
          font-size: 18px;
          border-radius: 0;
          -webkit-appearance: none;
             -moz-appearance: none;
                  appearance: none;
          color: #000;
          padding: 10px 15px 10px 2%;
          line-height: 22px; }
          @media (min-width: 551px) {
            #port-estimator > .holder .form-inputs .form-inputs-top .zplk-wrapper select {
              padding-left: 3%;
              width: 60%; } }
          @media (min-width: 1101px) {
            #port-estimator > .holder .form-inputs .form-inputs-top .zplk-wrapper select {
              width: 50%; } }
          #port-estimator > .holder .form-inputs .form-inputs-top .zplk-wrapper select::-ms-expand {
            display: none; }
        #port-estimator > .holder .form-inputs .form-inputs-top .zplk-wrapper .footnote {
          font-size: 12px;
          line-height: 16px;
          color: #333;
          width: 50%; }
          @media (max-width: 1100px) {
            #port-estimator > .holder .form-inputs .form-inputs-top .zplk-wrapper .footnote {
              width: 60%; } }
          @media (max-width: 550px) {
            #port-estimator > .holder .form-inputs .form-inputs-top .zplk-wrapper .footnote {
              width: 100%; } }
          #port-estimator > .holder .form-inputs .form-inputs-top .zplk-wrapper .footnote input {
            width: 100%;
            margin-bottom: 7px;
            line-height: 22px;
            border: 1px solid #b7b7b7;
            border-radius: 0;
                    box-sizing: border-box;
            font-size: 18px;
            padding: 10px 15px 10px 3%;
            -webkit-appearance: none;
               -moz-appearance: none;
                    appearance: none; }
            @media (min-width: 551px) {
              #port-estimator > .holder .form-inputs .form-inputs-top .zplk-wrapper .footnote input {
                padding-left: 6%; } }
            @media (min-width: 768px) {
              #port-estimator > .holder .form-inputs .form-inputs-top .zplk-wrapper .footnote input {
                padding-left: 7%; } }
      #port-estimator > .holder .form-inputs .form-inputs-bottom {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
            -ms-flex-wrap: wrap;
                flex-wrap: wrap; }
        #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div {
          text-align: center;
          margin: 0 auto;
          -webkit-transition: all 200ms ease-in-out;
          transition: all 200ms ease-in-out;
          padding-top: 20px; }
          #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div.hide {
            display: none; }
          #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .assumption {
            font-size: 17px;
            cursor: pointer; }
            #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .assumption.expanded {
              cursor: pointer;
              -webkit-transition: 1s;
              transition: 1s; }
            #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .assumption.expanded:after {
        background: url(../images/up.jpg) no-repeat;
    background-position: 50% 50%;
    display: inline-block;
    content: "";
    height: 1em;
    background-size: 70%;
    width: 2.5em;
    padding-left: 1.5em;
}
            #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .assumption:after {
background: url(../images/down.jpg) no-repeat;
    background-position: 50% 50%;
    display: inline-block;
    content: "";
    height: 1em;
    background-size: 70%;
    width: 2.5em;
    padding-left: 1.5em;}
          #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .hidden-div {
            text-align: left;
            height: auto;
            max-height: 0;
            overflow: hidden; }
            #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .hidden-div#moretext {
              -webkit-transition: all 200ms ease-in-out;
              transition: all 200ms ease-in-out;
              padding-top: 20px; }
            #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .hidden-div.expanded {
              max-height: 500px;
              -webkit-transition: max-height 2s;
              transition: max-height 2s; }
            #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .hidden-div .zplk-wrapper {
              width: 100%;
              font-size: 18px;
              line-height: 30px;
              margin-bottom: 10px;
              padding-top: 10px;
              display: -webkit-box;
              display: -webkit-flex;
              display: -ms-flexbox;
              display: flex;
              -webkit-flex-wrap: wrap;
                  -ms-flex-wrap: wrap;
                      flex-wrap: wrap; }
              @media (max-width: 1100px) {
                #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .hidden-div .zplk-wrapper {
                  margin: 0 auto 5px auto;
                  padding-top: 15px; } }
              #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .hidden-div .zplk-wrapper .label {
                width: 100%;
                margin: 0 auto;
                padding-right: 2%;
                font-weight: bold; 
				color: black;
				text-align:left;
				font-size: 18px;
				white-space: normal;
				line-height: 30px;}
                @media (min-width: 551px) {
                  #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .hidden-div .zplk-wrapper .label {
                    width: 40%;
                    margin: 0; } }
                @media (min-width: 1101px) {
                  #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .hidden-div .zplk-wrapper .label {
                    width: 49%; } }
              #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .hidden-div .zplk-wrapper select {
                overflow: hidden;
                background: url(../images/dropdown-arrow.png) no-repeat right #fff;
                border: 1px solid #b7b7b7;
                width: 100%;
                font-size: 18px;
                border-radius: 0;
                -webkit-appearance: none;
                   -moz-appearance: none;
                        appearance: none;
                color: #000;
                padding: 10px 15px 10px 2%;
                line-height: 22px; }
                @media (min-width: 551px) {
                  #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .hidden-div .zplk-wrapper select {
                    padding-left: 3%;
                    width: 60%; } }
                @media (min-width: 1101px) {
                  #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .hidden-div .zplk-wrapper select {
                    width: 50%; } }
                #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .hidden-div .zplk-wrapper select::-ms-expand {
                  display: none; }
              #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .hidden-div .zplk-wrapper .footnote {
                font-size: 12px;
                line-height: 16px;
                color: #333;
                width: 50%; }
                @media (max-width: 1100px) {
                  #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .hidden-div .zplk-wrapper .footnote {
                    width: 60%; } }
                @media (max-width: 550px) {
                  #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .hidden-div .zplk-wrapper .footnote {
                    width: 100%; } }
                #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .hidden-div .zplk-wrapper .footnote input {
                  width: 100%;
                  margin-bottom: 7px;
                  line-height: 22px;
                  border: 1px solid #b7b7b7;
                  border-radius: 0;
                          box-sizing: border-box;
                  font-size: 18px;
                  padding: 10px 15px 10px 3%;
                  -webkit-appearance: none;
                     -moz-appearance: none;
                          appearance: none; }
                  @media (min-width: 551px) {
                    #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .hidden-div .zplk-wrapper .footnote input {
                      padding-left: 6%; } }
                  @media (min-width: 768px) {
                    #port-estimator > .holder .form-inputs .form-inputs-bottom .optional-div .hidden-div .zplk-wrapper .footnote input {
                      padding-left: 7%; } }
        #port-estimator > .holder .form-inputs .form-inputs-bottom .calculate-holder {
          margin: 0 auto; }
          #port-estimator > .holder .form-inputs .form-inputs-bottom .calculate-holder .calculate_port {
            background-color: #ccc;
            -webkit-transition-duration: .3s;
                    transition-duration: .3s;
            -webkit-transition-property: background-color;
            transition-property: background-color;
            display: inline-block;
            vertical-align: middle;
            text-align: center;
            line-height: .9375em;
            padding: 0.6em 3.55em;
            font-size: 22px;
            font-weight: 400;
            color: #001;
            text-decoration: none;
            margin-top: 20px;
            border: 0;
            cursor: initial; }
            #port-estimator > .holder .form-inputs .form-inputs-bottom .calculate-holder .calculate_port.enabled {
              cursor: pointer;
              -webkit-transition: 1s;
              transition: 1s;
              background-color: #317400;
            color: #fff; }
    #port-estimator > .holder .results-output {
      -webkit-flex-basis: 100%;
          -ms-flex-preferred-size: 100%;
              flex-basis: 100%;
      padding-top: 20px; }
      @media (min-width: 768px) {
        #port-estimator > .holder .results-output {
          padding-top: 0;
          -webkit-flex-basis: 50%;
              -ms-flex-preferred-size: 50%;
                  flex-basis: 50%; } }
      #port-estimator > .holder .results-output .contentRowCustom {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
            -ms-flex-wrap: wrap;
                flex-wrap: wrap; }
        #port-estimator > .holder .results-output .contentRowCustom .my_rows {
          display: -webkit-flex;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-flex-wrap: wrap;
              -ms-flex-wrap: wrap;
                  flex-wrap: wrap;
          width: 100%; }
          #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col {
            width: 100%;
            display: inline-block;
            -webkit-box-flex: 1;
            -webkit-flex-grow: 1;
                -ms-flex-positive: 1;
                    flex-grow: 1;
            -webkit-flex: 0 0 auto;
                -ms-flex: 0 0 auto;
                    flex: 0 0 auto;
            margin-bottom: 10px; }
            #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container {
              -webkit-transform-style: preserve-3d;
                      transform-style: preserve-3d;
              width: 100%;
              position: relative;
              height: 450px; }
              @media (min-width: 768px) {
                #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container {
                  height: 470px; } }
              #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container.card-click.flipped .front {
                -webkit-transform: perspective(800px) rotateY(180deg);
                        transform: perspective(800px) rotateY(180deg); }
              #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container.card-click.flipped .back {
                -webkit-transform: perspective(800px) rotateY(0deg);
                        transform: perspective(800px) rotateY(0deg); }
              #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .front {
                -webkit-backface-visibility: hidden;
                        backface-visibility: hidden;
                -webkit-transition: 1s;
                transition: 1s;
                -webkit-transform-style: preserve-3d;
                        transform-style: preserve-3d;
                position: absolute;
                top: 0;
                left: 0;
                z-index: 2;
                -webkit-transform: perspective(800px) rotateY(0deg);
                        transform: perspective(800px) rotateY(0deg);
                width: 100%;
                height: 420px;
                background: url(../images/pat_hero.jpg) no-repeat;
                background-position: 100% 0; }
                @media (max-width: 550px) {
                  #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .front {
                    background-position: 93% 0; } }
                @media (min-width: 768px) {
                  #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .front {
                    height: 440px; } }
              #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back {
                -webkit-backface-visibility: hidden;
                        backface-visibility: hidden;
                -webkit-transition: 1s;
                transition: 1s;
                -webkit-transform-style: preserve-3d;
                        transform-style: preserve-3d;
                position: absolute;
                top: 0;
                left: 0;
                -webkit-transform: perspective(800px) rotateY(-180deg);
                        transform: perspective(800px) rotateY(-180deg);
                width: 100%; }
                @media (min-width: 768px) {
                  #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back {
                    height: 440px; } }
                #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content {
                  width: 100%;
                  height: 420px;
                  position: absolute;
                  top: 0;
                  left: 0;
                  -webkit-box-align: baseline;
                  -webkit-align-items: baseline;
                      -ms-flex-align: baseline;
                          align-items: baseline;
                  padding: 30px;
                  background-color: #fff;
                  display: -webkit-box;
                  display: -webkit-flex;
                  display: -ms-flexbox;
                  display: flex;
                  -webkit-flex-wrap: wrap;
                      -ms-flex-wrap: wrap;
                          flex-wrap: wrap; }
                  @media (min-width: 768px) {
                    #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content {
                      height: 440px; } }
                  @media (min-width: 1200px) {
                    #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content {
                      padding: 50px 40px 30px 40px; } }
                  #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .charge-port-div {
                    width: 100%;
                    padding: 10px;
                    margin: 0 auto;
                    text-align: center;
                    -webkit-box-align: start;
                    -webkit-align-items: flex-start;
                        -ms-flex-align: start;
                            align-items: flex-start;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                        -ms-flex-pack: center;
                            justify-content: center; }
                    @media (min-width: 1200px) {
                      #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .charge-port-div {
                        width: 75%; } }
                    #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .charge-port-div .svg-div {
                      width: 65px; }
                      #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .charge-port-div .svg-div #port-img {
                        width: 56px;
                        height: 127px; }
                    #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .charge-port-div .info-div {
                      width: 162px; }
                      #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .charge-port-div .info-div .info-number {
                        font-size: 60px;
                        color: #317400;
                        line-height: 66px;
                        margin-top: 13px; }
                      #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .charge-port-div .info-div .info-description {
                        margin: 0 auto;
                        font-size: 20px;
                        color: #000001; }
                  #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details {
                    width: 100%;
                    margin: 0 auto;
                    display: -webkit-box;
                    display: -webkit-flex;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-flex-wrap: wrap;
                        -ms-flex-wrap: wrap;
                            flex-wrap: wrap;
                    -webkit-box-pack: center;
                    -webkit-justify-content: center;
                        -ms-flex-pack: center;
                            justify-content: center;
                    padding-top: 14px; }
                    #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details .holder {
                      display: -webkit-box;
                      display: -webkit-flex;
                      display: -ms-flexbox;
                      display: flex;
                      -webkit-flex-wrap: wrap;
                          -ms-flex-wrap: wrap;
                              flex-wrap: wrap;
                      -webkit-box-pack: center;
                      -webkit-justify-content: center;
                          -ms-flex-pack: center;
                              justify-content: center;
                                  width: 255px;
                      -webkit-flex-basis: 255px;
                          -ms-flex-preferred-size: 255px;
                              flex-basis: 255px; }
                      #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details .holder .current {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-flex-wrap: nowrap;
                            -ms-flex-wrap: nowrap;
                                flex-wrap: nowrap;
                        -webkit-flex-basis: 100%;
                            -ms-flex-preferred-size: 100%;
                                flex-basis: 100%;
                                  width: 100%;
                        font-size: 20px;
                        color: #000001;
                        height: 25px; }
                        #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details .holder .current .first {
                          -webkit-flex-basis: 20%;
                              -ms-flex-preferred-size: 20%;
                                  flex-basis: 20%;
                                  width: 20%;
                          text-align: right; }
                        #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details .holder .current .second {
                          -webkit-flex-basis: 60%;
                              -ms-flex-preferred-size: 60%;
                                  flex-basis: 60%;
                                  width: 60%;
                          text-align: left;
                          padding-left: 12px; }
                        #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details .holder .current .third {
                          -webkit-flex-basis: 20%;
                              -ms-flex-preferred-size: 20%;
                                  flex-basis: 20%;
                                  width: 20%;
                          text-align: left; }
@media (max-width: 767px) {
						button#nebula_div_btn {
							  z-index: 100 !important
						   }
                          #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details .holder .current .third .car-img {
                            width: 41px;
                            -webkit-transform: scaleX(-1);
                                -ms-transform: scaleX(-1);
                                    transform: scaleX(-1); }}
                      #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details .holder .future {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-flex-wrap: nowrap;
                            -ms-flex-wrap: nowrap;
                                flex-wrap: nowrap;
                        -webkit-flex-basis: 100%;
                            -ms-flex-preferred-size: 100%;
                                flex-basis: 100%;
                                  width: 100%;
                        font-size: 20px;
                        color: #000001;
                        margin-top: 6px;
                        height: 25px; }
                        #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details .holder .future .first {
                          -webkit-flex-basis: 20%;
                              -ms-flex-preferred-size: 20%;
                                  flex-basis: 20%;
                                  width: 20%;
                          text-align: right; }
                          #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details .holder .future .first .plus {
                            font-size: 15px;
                            font-weight: 600; }
                        #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details .holder .future .second {
                          -webkit-flex-basis: 60%;
                              -ms-flex-preferred-size: 60%;
                                  flex-basis: 60%;
                                  width: 60%;
                          text-align: left;
                          padding-left: 12px; }
                        #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details .holder .future .third {
                          -webkit-flex-basis: 20%;
                              -ms-flex-preferred-size: 20%;
                                  flex-basis: 20%;
                                  width: 20%;
                          text-align: left; }
@media (max-width: 767px) {
                          #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details .holder .future .third .car-img {
                            width: 41px;
                            -webkit-transform: scaleX(-1);
                                -ms-transform: scaleX(-1);
                                    transform: scaleX(-1); }}
                      #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details .holder .horizontal-line {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-box-pack: center;
                        -webkit-justify-content: center;
                            -ms-flex-pack: center;
                                justify-content: center; }
                        #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details .holder .horizontal-line .line {
                          border-top: 2px solid #228b22;
                          width: 245px;
                          margin-top: 9px;
                          margin-bottom: 14px; }
                      #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details .holder .total {
                        display: -webkit-box;
                        display: -webkit-flex;
                        display: -ms-flexbox;
                        display: flex;
                        -webkit-flex-wrap: nowrap;
                            -ms-flex-wrap: nowrap;
                                flex-wrap: nowrap;
                        -webkit-flex-basis: 100%;
                            -ms-flex-preferred-size: 100%;
                                flex-basis: 100%;
                                  width: 100%;
                        font-size: 27px;
                        color: #000001;
                        height: 32px; }
                        #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details .holder .total .first {
                          -webkit-flex-basis: 20%;
                              -ms-flex-preferred-size: 20%;
                                  flex-basis: 20%;
                                  width: 20%;
                          text-align: right; }
                        #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details .holder .total .second {
                          -webkit-flex-basis: 60%;
                              -ms-flex-preferred-size: 60%;
                                  flex-basis: 60%;
                                  width: 60%;
                          text-align: left;
                          padding-left: 12px; }
                        #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details .holder .total .third {
                          -webkit-flex-basis: 20%;
                              -ms-flex-preferred-size: 20%;
                                  flex-basis: 20%;
                                  width: 20%;
                          text-align: left; }
@media (max-width: 767px) {
                          #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details .holder .total .third .car-img {
                            width: 48px;
                            -webkit-transform: scaleX(-1);
                                -ms-transform: scaleX(-1);
                                    transform: scaleX(-1); }}
                      #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .back .back-content .calc-details .holder .notes {
                        -webkit-flex-basis: 100%;
                            -ms-flex-preferred-size: 100%;
                                flex-basis: 100%;
                        text-align: center;
                        font-size: 12px;
                        color: #000001;
                        line-height: 1.3;
                        margin-top: 15px; }
              #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .sce-reset {
                text-align: right;
                float: right;
                padding-top: 20px;
                cursor: pointer;
                margin-top: 440px; }
                #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .sce-reset {
                  display: none; }
                @media (max-width: 768px) {
                  #port-estimator > .holder .results-output .contentRowCustom .my_rows .my_col .click-container .sce-reset {
                    padding-right: 20px;
                    margin-top: 460px; } }

.disclaimer {
  font-size: 12px;
  line-height: 16px;
  color: #333; }

_:-ms-lang(x), #port-estimator > .holder .form-inputs {
  -ms-flex-preferred-size: 90%;
  flex-basis: 90%; }

_:-ms-lang(x), #port-estimator > .holder .results-output {
  -ms-flex-preferred-size: 90%;
  flex-basis: 90%; }

@media (min-width: 500px) {
  _:-ms-lang(x), #port-estimator > .holder .form-inputs {
    -ms-flex-preferred-size: 94%;
    flex-basis: 94%; }
  _:-ms-lang(x), #port-estimator > .holder .results-output {
    -ms-flex-preferred-size: 94%;
    flex-basis: 94%; } }

@media (min-width: 768px) {
  _:-ms-lang(x), #port-estimator > .holder .form-inputs {
    -ms-flex-preferred-size: 43%;
    flex-basis: 43%; }
  _:-ms-lang(x), #port-estimator > .holder .results-output {
    -ms-flex-preferred-size: 43%;
    flex-basis: 43%; } }

@media (min-width: 850px) {
  _:-ms-lang(x), #port-estimator > .holder .form-inputs {
    -ms-flex-preferred-size: 46%;
    flex-basis: 46%; }
  _:-ms-lang(x), #port-estimator > .holder .results-output {
    -ms-flex-preferred-size: 46%;
    flex-basis: 46%; } }


@media screen and (min-width: 0\0) {
  #port-estimator .results-output .click-container .back .back-content .calc-details .holder .current .first,
  #port-estimator .results-output .click-container .back .back-content .calc-details .holder .current .second,
  #port-estimator .results-output .click-container .back .back-content .calc-details .holder .current .third,
  #port-estimator .results-output .click-container .back .back-content .calc-details .holder .future .first,
  #port-estimator .results-output .click-container .back .back-content .calc-details .holder .future .second,
  #port-estimator .results-output .click-container .back .back-content .calc-details .holder .future .third,
  #port-estimator .results-output .click-container .back .back-content .calc-details .holder .total .first,
  #port-estimator .results-output .click-container .back .back-content .calc-details .holder .total .second,
  #port-estimator .results-output .click-container .back .back-content .calc-details .holder .total .third {
    float: left; } }


.sce-chrgport-estmr-pg .cls-1 {
	fill: #678f33;
}
.sce-chrgport-estmr-pg .cls-2 {
	fill: #fcd375;
}
.sce-chrgport-estmr-pg .cls-3 {
	fill: #a9bb90;
}
.sce-chrgport-estmr-pg .cls-4 {
	fill: #e6e6e6;
}
.sce-chrgport-estmr-pg .cls-5 {
	fill: #221f1f;
}
.sce-chrgport-estmr-pg .cls-6 {
	fill: #424143;
}
.sce-chrgport-estmr-pg .cls-7 {
	fill: #6d6e71;
}
.sce-chrgport-estmr-pg .cls-8 {
	fill: #bcbdbf;
}
.sce-chrgport-estmr-pg .cls-9 {
	fill: #fff;
}
.sce-chrgport-estmr-pg .cls-10 {
	fill: #678f33;
}
.sce-chrgport-estmr-pg .cls-11 {
	fill: #2d2d2d;
}
.sce-chrgport-estmr-pg .cls-12 {
	fill: #676767;
}
.sce-chrgport-estmr-pg .cls-13 {
	fill: #fff;
}
.sce-chrgport-estmr-pg .cls-14 {
	fill: none;
	stroke: #fff;
	stroke-miterlimit: 10;
	stroke-width: 2.38px;
}
.sce-chargeport-estimator {
  display: none;
}
/* charge port estimator ends here */