/***************************************************
****************************************************
 HEADER STYLE STARTS HERE 
 ***************************************************
 **************************************************/
.enrollment-masthead {
    background-color: var(--light-white);
    border-bottom: 1px solid var(--light-gray);
    color: var(--secondary-color);
}

.enrollment-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    max-width: 1200px;
    margin: 0 auto;
}

/* logo */
.enrollment-logo {
    display: block;
    -webkit-box-shadow: none;
    box-shadow: none;
    padding: 16px;
}

.enrollment-logo img {
    width: 191px;
    max-width: 140px;
}


/* contact */
.enrollment-utility {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 16px;
}

.enrollment-utility-language {
    margin-bottom: 6px;
}

/* icon */
.enrollment-utility-link-icon {
    margin-right: .5em;
    color: var(--secondary-color);
    
}

.enrollment-utility-link {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-shadow: none;
    box-shadow: none;
    font-size: 12px;
    color: var(--secondary-color);
    display: inline-block;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
}


/* contact link */
.enrollment-utility-contact {
    font-size: 14px;
    font-family: din-2014, -apple-system, BlinkMacSystemFont, "Segsoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    font-weight: 600;
    color: var( --secondary-color)
}

.enrollment-utility-contact a {
    color: var(--base-color);
    -webkit-box-shadow: none;
    box-shadow: none;
}


/***************************************************
****************************************************
 HEADER STYLE ENDS HERE 
 ***************************************************
 **************************************************/




/***************************************************
****************************************************
 STEPPER STYLE STARTS HERE
 ***************************************************
 **************************************************/

.stepper {
    background: var(--light-white);
    border-bottom: 2px solid var(--light-gray);
    padding-top: 1.5em
}

.stepper,
.stepper-items {
    position: relative;
    z-index: 1
}

.stepper-items {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    max-width: 896px;
    margin: 0 auto -20px;
    padding: 0 16px;
    counter-set: stepper 0;
}

.stepper-step:before {
    display: none;
}

.stepper-step {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    counter-increment: stepper;
}

.stepper-step:first-child {
    padding-left: 0;
}

.stepper-step .iocn-wrapper {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.stepper-step .iocn-wrapper:after {
    content: '';
    width: 100%;
    height: 2px;
    background: transparent;
    position: absolute;
    left: -50%;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: -1;
}

.stepper-step:first-child .iocn-wrapper:after {
    display: none;
}

.stepper-step.is-active .stepper-icon:before {
    color: white;
}

.stepper-step.is-active .iocn-wrapper:after {
    background: #46a6c4;
}


.stepper-icon {
    position: relative;
    width: 32px;
    height: 32px;
    border-radius: 32px;
    background: var(--white);
    border: 2px solid var(--light-gray);
    -webkit-box-shadow: 0 0 0 0 #46a6c41a;
    box-shadow: 0 0 0 0 #46a6c41a;
    -webkit-transition: border-color .5s ease .25s, -webkit-box-shadow .7s ease .25s;
    transition: border-color .5s ease .25s, -webkit-box-shadow .7s ease .25s;
    -o-transition: border-color .5s ease .25s, box-shadow .7s ease .25s;
    transition: border-color .5s ease .25s, box-shadow .7s ease .25s;
    transition: border-color .5s ease .25s, box-shadow .7s ease .25s, -webkit-box-shadow .7s ease .25s
}

.stepper-icon .icon,
.stepper-icon:before {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.stepper-icon:before {
    content: counter(stepper);
    width: 32px;
    height: 32px;
    line-height: 32px;
    text-align: center;
    color: var(--light-black);
    font-family: Kanit, -apple-system, BlinkMacSystemFont, Segsoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
    font-weight: 500;
    font-size: 1.125em;
    border-radius: 50%
}

.stepper-icon .icon {
    z-index: 1;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 40%;
    height: 40%
}

.stepper-icon .icon path {
    stroke-dashoffset: -112;
    stroke-dasharray: 112;
}

.stepper-label {
    text-align: center;
    color: var(--secondary-color);
    font-family: Kanit, -apple-system, BlinkMacSystemFont, Segsoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
    font-weight: 400;
    font-size: .875em;
    line-height: 1.2;
    padding-bottom: 16px;
    opacity: .5;
    -webkit-transition: opacity .3s ease;
    -o-transition: opacity .3s ease;
    transition: opacity .3s ease;
}

.stepper-step.is-active .stepper-label {
    opacity: 1;
}

.stepper-step.is-active .stepper-icon {
    border-color: var(--primary-color);
    -webkit-box-shadow: 0 0 0 .5em #46a6c41a;
    box-shadow: 0 0 0 .5em #46a6c41a;
}

.stepper-step.is-active .stepper-icon:before {
    color: var(--primary-color);
}

.stepper-step.is-active .stepper-icon {
    border-color: var(--primary-color);
}


/* When form is submit successfully then this code is live */
/* .stepper-step.is-active  .stepper-icon:before {
    opacity: 0;
    -webkit-transition: opacity .5s ease-out;
    -o-transition: opacity .5s ease-out;
    transition: opacity .5s ease-out;
}

.stepper-step.is-active .stepper-icon .icon path {
    stroke-dashoffset: 0;
    -webkit-transition: stroke-dashoffset .5s ease .35s;
    -o-transition: stroke-dashoffset .5s ease .35s;
    transition: stroke-dashoffset .5s ease .35s;
} */

/***************************************************
****************************************************
 STEPPER STYLE ENDS HERE
 ***************************************************
 **************************************************/



/***************************************************
****************************************************
MAIN SECTION STYLE STARTS HERE
 ***************************************************
 **************************************************/

/**************************** PANEL STYLE STARTS HERE ***************************/
.panels {
    overflow-x: hidden;
}

.panel {
    position: relative;
    background: var(--white);
    -webkit-transform-origin: top center;
    -ms-transform-origin: top center;
    transform-origin: top center;
    -webkit-transition: .25s ease;
    -o-transition: .25s ease;
    transition: .25s ease;
    padding: 96px 24px;
    margin: 0 auto;
}

.panel:not(:first-of-type) {
    display: none;
}

.page-header {
    text-align: center;
    margin-bottom: 32px;
    color: var(--primary-color);
    text-transform: uppercase;
}

/* location */
.location-bar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 16px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: -24px -8px 32px;
    padding-bottom: 1em;
    border-bottom: 1px solid var(--light-gray);
}

.location-bar-item {
    -webkit-transition: .12s ease;
    -o-transition: .12s ease;
    transition: .12s ease;
}


.location-bar.has-existing-promo {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.location-bar.has-existing-promo .form-field {
    text-align: center
}

.promo-search {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.promo-search .promo-search-input {
    width: 100%;
}

/**************************** PANEL STYLE ENDS HERE ***************************/


/**************************** PLAN CARDS STYLE STARTS HERE ***************************/
.plancards {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 16px;
}

.plancard-item {
    max-width: 320px;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.plancard {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    border: 1px solid rgba(202, 203, 204, .5);
    border-radius: .25em;
    padding: 1.5em 32px;
    -webkit-box-shadow: 0 4px 10px 0 transparent;
    box-shadow: 0 4px 10px 0 transparent;
    -webkit-transition: -webkit-box-shadow .35s ease;
    transition: -webkit-box-shadow .35s ease;
    -o-transition: box-shadow .35s ease;
    transition: box-shadow .35s ease;
    transition: box-shadow .35s ease, -webkit-box-shadow .35s ease;
    text-align: center;
    width: 100%;
}

.plancard:after,
.plancard:before {
    content: "";
    pointer-events: none;
    border: 2px solid transparent;
    -webkit-box-sizing: inherit;
    box-sizing: inherit;
    position: absolute;
    width: 0;
    height: 0;
    border-radius: 0;
}

.plancard:before {
    left: -1px;
    top: -1px;
}

.plancard:after {
    right: -1px;
    bottom: -1px;
}

.plancard--shadow {
    -webkit-box-shadow: 0 4px 10px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, .08)
}

.plancard--selectable:hover,
.plancard--selectable.active {
    -webkit-box-shadow: 0 4px 10px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, .08)
}

.plancard--selectable:active:after,
.plancard--selectable:active:before,
.plancard--selectable:hover:after,
.plancard--selectable:hover:before {
    width: calc(100% + 2px);
    height: calc(100% + 2px);
    border-radius: 4px
}

.plancard--selectable:active:before,
.plancard--selectable:hover:before {
    border-top-color: var(--base-color);
    border-right-color: var(--base-color);
    -webkit-transition: border-radius .7s ease 0s, border-top-color .3s cubic-bezier(.85, .73, .14, .95) 0s, width .3s cubic-bezier(.85, .73, .14, .95) 0s, height .3s cubic-bezier(.85, .73, .14, .95) .198s, border-right-color .3s cubic-bezier(.85, .73, .14, .95) .198s;
    -o-transition: border-radius .7s ease 0s, border-top-color .3s cubic-bezier(.85, .73, .14, .95) 0s, width .3s cubic-bezier(.85, .73, .14, .95) 0s, height .3s cubic-bezier(.85, .73, .14, .95) .198s, border-right-color .3s cubic-bezier(.85, .73, .14, .95) .198s;
    transition: border-radius .7s ease 0s, border-top-color .3s cubic-bezier(.85, .73, .14, .95) 0s, width .3s cubic-bezier(.85, .73, .14, .95) 0s, height .3s cubic-bezier(.85, .73, .14, .95) .198s, border-right-color .3s cubic-bezier(.85, .73, .14, .95) .198s
}

.plancard--selectable:active:after,
.plancard--selectable:hover:after {
    border-bottom-color: var(--base-color);
    border-left-color: var(--base-color);
    -webkit-transition: border-radius .7s ease 0s, border-bottom-color .3s cubic-bezier(.85, .73, .14, .95) 0s, width .3s cubic-bezier(.85, .73, .14, .95) 0s, height .3s cubic-bezier(.85, .73, .14, .95) .198s, border-left-color .3s cubic-bezier(.85, .73, .14, .95) .198s;
    -o-transition: border-radius .7s ease 0s, border-bottom-color .3s cubic-bezier(.85, .73, .14, .95) 0s, width .3s cubic-bezier(.85, .73, .14, .95) 0s, height .3s cubic-bezier(.85, .73, .14, .95) .198s, border-left-color .3s cubic-bezier(.85, .73, .14, .95) .198s;
    transition: border-radius .7s ease 0s, border-bottom-color .3s cubic-bezier(.85, .73, .14, .95) 0s, width .3s cubic-bezier(.85, .73, .14, .95) 0s, height .3s cubic-bezier(.85, .73, .14, .95) .198s, border-left-color .3s cubic-bezier(.85, .73, .14, .95) .198s
}

.plancard--selectable:active .icon--check:before,
.plancard--selectable:hover .icon--check:before {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    -webkit-transition: -webkit-transform .3s cubic-bezier(0, .685, .33, 1.3) .3s;
    transition: -webkit-transform .3s cubic-bezier(0, .685, .33, 1.3) .3s;
    -o-transition: transform .3s cubic-bezier(0, .685, .33, 1.3) .3s;
    transition: transform .3s cubic-bezier(0, .685, .33, 1.3) .3s;
    transition: transform .3s cubic-bezier(0, .685, .33, 1.3) .3s, -webkit-transform .3s cubic-bezier(0, .685, .33, 1.3) .3s
}

.plancard--selectable:active .icon--check svg .check,
.plancard--selectable:hover .icon--check svg .check {
    stroke-dashoffset: 0;
    -webkit-transition: stroke-dashoffset .5s ease .5s;
    -o-transition: stroke-dashoffset .5s ease .5s;
    transition: stroke-dashoffset .5s ease .5s
}

.plancard-summary {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
}

/* plancard hover icon check style starts here*/
.icon--check {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    right: -12.5px;
    top: -12.5px;
    width: 25px;
    height: 25px;
    z-index: 1
}

.icon--check svg {
    width: 42%;
    height: 42%
}

.icon--check svg .check {
    stroke: var(--white);
    stroke-dashoffset: -112;
    stroke-dasharray: 112
}

.icon--check:before {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: 25px;
    height: 25px;
    background: var(--base-color);
    border-radius: 50%;
    z-index: -1;
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0)
}

/* plancard hover icon check style ends here*/

.plancard-rating {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: -.5em;
    padding-bottom: .75em;
}

.badge {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: .25em 1em;
    border-radius: 1em;
    background: var(--light-gray);
    color: var(--light-black);
    text-transform: uppercase;
    font-family: Kanit, -apple-system, BlinkMacSystemFont, Segsoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: .05em;
    white-space: nowrap
}

.badge-icon {
    width: 1em;
    height: 1em;
    margin-right: .5em
}

.badge-icon .icon {
    display: block;
    width: 100%;
    height: 100%;
}


.badge--outline {
    background: transparent;
    padding-top: .125em;
    padding-bottom: .125em;
    border: 2px solid var(--light-gray);
}


.plancard-badge {
    display: table;
    -ms-grid-row-align: center;
    -ms-flex-item-align: center;
    align-self: center;
    margin-left: auto;
    margin-right: auto;
    background: var(--light-gray);
    border-radius: 25px;
    padding: 5px 13px;
    color: var(--light-black);
    text-align: center;
    font-family: Kanit, -apple-system, BlinkMacSystemFont, Segsoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
    font-size: 12px;
    font-weight: 500;
    line-height: 1;
}


.plancard-title {
    color: var(--light-black);
    margin: 0;
}


.plancard-price {
    display: block;
    color: var(--light-black);
    text-align: center;
    font-size: 4.5em;
    font-family: Kanit, -apple-system, BlinkMacSystemFont, Segsoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
    font-weight: 500;
    margin-top: 10px;
    line-height: 1
}

.plancard-price-unit {
    vertical-align: middle;
    font-size: 55%;
    margin-left: 5px;
    line-height: 1;
    bottom: 0;
    font-style: normal;
    font-weight: 400
}


/* PLAN CARD BODY STARTS HERE */
.plancard-body {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    color: var(--light-black);
    text-align: center;
    margin-top: 16px;
    margin-bottom: 16px;
}

.plancard-icon {
    margin: 1em 0;
}

.plancard-icon:first-child {
    margin-top: 0;
}

.plancard-icon:last-child {
    margin-bottom: 0;
}

.icon-bubble,
.icon-card {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.icon-bubble {
    background: var(--light-white);
    width: 3.75em;
    height: 3.75em;
    border-radius: 4.5em;
    padding: 5px;
}


.icon-bubble .icon {
    display: block;
    width: 2.25em;
    height: 2.25em
}


.icon-bubble .icon--people-connections,
.icon-bubble .icon--warning {
    -webkit-transform: translateY(-7%);
    -ms-transform: translateY(-7%);
    transform: translateY(-7%)
}

.icon-bubble .icon--document-pen {
    -webkit-transform: translateX(8%);
    -ms-transform: translateX(8%);
    transform: translateX(8%)
}

.icon-bubble .icon--phone-message {
    -webkit-transform: translateX(10%);
    -ms-transform: translateX(10%);
    transform: translateX(10%)
}

.plancard-attributes {
    font-size: 14px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.plancard-attributes li::before{
    display: none;
}

.plancard-attributes .info-icon {
    width: 14px;
    height: 14px;
    background: url(../images/info-gray.svg) no-repeat 50%;
    display: inline-block;
}

.plancard-attributes,
.unlist {
    list-style: none;
    margin: 0;
    padding: 0;
}

/*TOOLTIP */
.tooltip {
    font-size: 14px;
    font-family: din-2014, -apple-system, BlinkMacSystemFont, Segsoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
    font-weight: 400;
    font-style: italic;
    color: var(--light-black);
    text-align: left;
}

.tooltip--inline:hover {
    display: inline-block;
}

.tooltip.is-active .tooltip-label {
    border-bottom-color: var(--base-color);
}

.tooltip--inline {
    display: inline-block;
    height: 1.25em;
    vertical-align: middle;
}


.tooltip-icon {
    display: inline-block;
    width: 1em;
    height: 1em;
    color: var(--light-black);
}

.tooltip-label {
    border-bottom: 1px dashed var(--dark-gray);
    transform: all .4s ease;
}

.tooltip-label:hover{
    border-bottom: 1px dashed var(--base-color);
    color:  var(--base-color);
}

/* PLAN CARD BODY ENDS HERE */


/* PLAN CARD FOOTER STARTS HERE */
.plancard-footer {
    font-size: 14px;
}

.plancard-footer-action:first-of-type {
    margin-top: 12px;
}

.plancard-footer-action+.plancard-footer-action {
    margin-top: 8px;
}

.plancards .plancard-item {
    -webkit-transition: .5s ease;
    -o-transition: .5s ease;
    transition: .5s ease;
}

.plancards .plancard-item:nth-child(0) {
    -webkit-transition-delay: 0ms;
    -o-transition-delay: 0ms;
    transition-delay: 0ms
}

.plancards .plancard-item:first-child {
    -webkit-transition-delay: 50ms;
    -o-transition-delay: 50ms;
    transition-delay: 50ms
}

.plancards .plancard-item:nth-child(2) {
    -webkit-transition-delay: .1s;
    -o-transition-delay: .1s;
    transition-delay: .1s
}

.plancards .plancard-item:nth-child(3) {
    -webkit-transition-delay: .15s;
    -o-transition-delay: .15s;
    transition-delay: .15s
}

.plancards .plancard-item:nth-child(4) {
    -webkit-transition-delay: .2s;
    -o-transition-delay: .2s;
    transition-delay: .2s
}

.plancards .plancard-item:nth-child(5) {
    -webkit-transition-delay: .25s;
    -o-transition-delay: .25s;
    transition-delay: .25s
}

.plancards.v-enter .plancard-item,
.plancards.v-leave-to .plancard-item {
    opacity: 0;
    -webkit-transform: translateY(-1em) scale(.9);
    -ms-transform: translateY(-1em) scale(.9);
    transform: translateY(-1em) scale(.9)
}

/**************************** PLAN CARDS STYLE ENDS HERE ***************************/


/**************************** LIGHT BOX STARTS HERE***************************/
.lightbox {
    position: fixed;
    z-index: 9;
    background: rgba(15, 24, 25, .6);
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    text-align: left
}

.lightbox:not(.is-active) {
    pointer-events: none;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: opacity .35s ease-out, visibility 0s .35s;
    -o-transition: opacity .35s ease-out, visibility 0s .35s;
    transition: opacity .35s ease-out, visibility 0s .35s
}

.lightbox.is-active {
    opacity: 1;
    -webkit-transition: opacity .35s ease-out, visibility 0s 0s;
    -o-transition: opacity .35s ease-out, visibility 0s 0s;
    transition: opacity .35s ease-out, visibility 0s 0s
}

.modal-dialog {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    position: fixed;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 10;
    width: 92%;
    max-width: 43em
}

.modal,
.modal-dialog {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.modal {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -webkit-box-shadow: 0 0 5em 0 rgba(0, 0, 0, .2);
    box-shadow: 0 0 5em 0 rgba(0, 0, 0, .2);
    background: var(--white);
    border-radius: .25em;
    cursor: auto;
    width: 100%;
    max-height: 90vh;
    overflow: hidden
}

.modal .modal-footer,
.modal .modal-header {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto
}

.modal .modal-body {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto
}

.modal-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    border-top-left-radius: .25em;
    border-top-right-radius: .25em;
    width: 100%;
    border-bottom: 1px solid var(--light-white);
    background: var(--light-white)
}

.modal-close {
    display: block;
    margin-left: auto;
    padding: .75em;
}

.modal-close svg {
    display: block;
    width: .75em;
    height: .75em;
}

.modal-body {
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    position: relative;
    padding: 32px;
}

.modal-body ul {
    margin-left: 1.25em;
}


.modal-footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    border-top: 1px solid var(--light-white);
    padding: 16px 32px 32px 32px;
}

.link {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    align-items: center;
    font-size: .875rem;
    white-space: nowrap;
    cursor: pointer;
    transition: all .4s ease;
}


.link-icon {
    display: block;
    max-width: 1.5rem;
    height: 1.5rem;
    margin-right: 0.5em;
    color: #cacbcc;
    transition: all .4s ease;
}

.link-icon:not(svg) {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    justify-content: center;
}

.link-label {
    box-shadow: 0 1px 0 0 #cacbcc;
    transition: all .4s ease;
}

.link:hover .link-icon{
    color: var(--primary-color);
}

.link:hover .link-label{
    box-shadow: 0 1px 0 0 var(--primary-color);
}

/**************************** LIGHT BOX ENDS HERE***************************/



/***************************** CONTACT INFORMATION *******************************/
.section-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 1.5em;
    margin-bottom: 1.5em;
    width: 100%;
}

.section-title {
    margin: 0;
}

.form-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.form-container .input-box {
    width: calc(100% / 2 - 20px);
    margin-bottom: 15px;
}

.form-container .column {
    width: 100%;
    margin-bottom: 15px;
}


.form-disclaimer {
    text-align: center;
    font-style: italic;
    font-size: .875em;
    color: var(--light-black);
    padding: 30px 14px;
}

.form-disclaimer p {
    max-width: 46em;
    margin-left: auto;
    margin-right: auto
}


.divider-label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-family: din-2014, -apple-system, BlinkMacSystemFont, Segsoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
    font-size: 14px;
    font-weight: 600;
    font-style: italic;
    color: var(--light-black);
    text-transform: uppercase;
    margin: 2em 0 1.5em;
    letter-spacing: .05em;
    line-height: 1.5
}

.divider-label:after,
.divider-label:before {
    content: "";
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    height: 1px;
    background: var(--light-gray)
}

.divider-label:before {
    margin-right: 8px
}

.divider-label:after {
    margin-left: 8px
}

.review {
    position: relative;
    border: 1px solid var(--white-gray);
    border-radius: 5px;
    border-bottom: 2px solid var(--white-gray);
    padding: 1em;
    margin-bottom: 15px;
}

.review:after {
    content: "";
    display: table;
    width: 100%;
    clear: both
}

.review .review-action+* {
    margin-top: 0
}

.review :last-child {
    margin-bottom: 0
}

.review-action {
    float: right;
    margin-left: 1em;
    margin-bottom: 1em
}

.plancard--expanded {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    gap: 25px;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    border: 1px solid var(--white-gray);
    border-radius: 0;
    padding: 24px;
}

.plancard-notes {
    padding-left: 32px;
    text-align: left;
    margin-left: 32px;
    border-left: 1px solid var(--light-gray);
}

.plancard-notes>:first-child {
    margin-bottom: 16px;
}

.plancard-notes ul {
    margin-top: 16px;
}


/* icon card type */
.icon-cardtype {
    display: inline-block;
    vertical-align: middle;
    background: no-repeat 50%;
    background-size: 100% 100%;
    -webkit-transition: .2s ease;
    -o-transition: .2s ease;
    transition: .2s ease;
    -webkit-transform-origin: center center;
    -ms-transform-origin: center center;
    transform-origin: center center;
    -webkit-box-shadow: inset 0 0 0 1px rgba(202, 203, 204, .5);
    box-shadow: inset 0 0 0 1px rgba(202, 203, 204, .5);
    border-radius: .125em;
    width: 41px;
    height: 25px;
}

.icon-cardtype--default {
    background-image: url(../images/icon/card-icon.svg)
}

.icon-cardtype--visa {
    background-image: url(../img/icons/complex/cc-visa.svg)
}

.icon-cardtype--master-card,
.icon-cardtype--mastercard {
    background-image: url(../img/icons/complex/cc-mastercard.svg)
}

.icon-cardtype--american-express,
.icon-cardtype--amex {
    background-image: url(../img/icons/complex/cc-amex.svg)
}

.icon-cardtype--discover {
    background-image: url(../img/icons/complex/cc-discover.svg)
}

.stattable .icon-cardtype {
    border-radius: 4px;
}


.billing-address {
    width: 100%;
    display: none;
}

.billing-address.active{
    display: flex;
}


.icon-card {
    width: 2.625em;
    height: 1.5625em;
    background: var(--light-white);
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: .125em
}

.icon-card .icon {
    width: 100%;
    height: 100%;
}


.terms {
    height: 9em;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    padding: 10px 12px;
    background: var(--white);
    border: 1px solid var(--white-gray);
    border-radius: 1px
}

.terms>:first-child {
    margin-top: 0
}

.terms>:last-child {
    margin-bottom: 0
}

.form-field-description {
    display: block;
    margin: 0;
    padding-top: .5em;
    color: var(--light-black);
    letter-spacing: .05em;
    line-height: 1.2;
    font-size: .75em;
    font-style: italic
}


.form-actions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 20px;
}


.checkbox-input.invalid:not([disabled])+.checkbox-label:before,
.checkbox-input.invalid:not([disabled])+.radio-label:before,
.radio-input.invalid:not([disabled])+.checkbox-label:before,
.radio-input.invalid:not([disabled])+.radio-label:before,
input.invalid,
select.invalid,
textarea.invalid {
    border-color: #b30918;
}


.callout {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    gap: 32px;
    margin-bottom: 10px;
}

.callout-body h2 {
    margin-bottom: 0;
}

.callout--boxed {
    border: 1px solid var(--light-gray);
    border-radius: .25em;
    padding: 1em
}

.callout-actions {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 12px;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.callout-body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 16px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}


.callout-actions ol,
.callout-actions ul,
.callout-body ol,
.callout-body ul {
    text-align: left;
}


.callout--payment-methods {
    font-size: 16px;
}

.callout--helpful {
    position: relative;
    background: rgba(68, 217, 250, 0.2);
    border: 1px dashed var(--primary-color);
    border-radius: .25em;
    padding: .75em 1em;
    font-size: .875em;
    line-height: 1.2
}

.callout--helpful .callout-icon {
    padding-right: 1em
}

.callout--helpful .callout-body :first-child {
    margin-top: 0
}

.widgets {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 -8px;
}

.widgets,
.widgets-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.widgets-item {
    padding: 0 8px 16px;
    max-width: 100%
}

.widgets-item .widget {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%
}

.widget {
    position: relative;
    padding: 1.2em;
    border: 1px solid var(--light-gray);
    border-radius: .25em;
    margin-bottom: 18px;
}

.widget+.widget,
.widget+.widgets {
    margin-top: 16px;
}


.boxtoggle {
    display: inline-block;
    position: relative;
    font: inherit;
    cursor: pointer;
    line-height: 1.2
}

.boxtoggle+.boxtoggle {
    margin-left: .75em
}

.boxtoggle-label {
    display: block;
    border: solid var(--gray);
    border-width: 1px 1px .1875em;
    padding: .9em 1em;
    text-align: center;
    color: #0f1819;
    font-weight: 700;
    font-size: 15px;
    -webkit-transition: .2s ease-in-out;
    -o-transition: .2s ease-in-out;
    transition: .2s ease-in-out;
}

.boxtoggle-check {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: var(--base-color);
    width: 1.25em;
    height: 1.25em;
    border-radius: 1em;
    position: absolute;
    top: 0;
    left: 100%;
    margin-top: .125em;
    margin-left: -.125em;
    z-index: 1;
    color: var(--white);
    -webkit-transform: translate(-50%, -50%) scale(0);
    -ms-transform: translate(-50%, -50%) scale(0);
    transform: translate(-50%, -50%) scale(0)
}

.boxtoggle-check:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-40%, -60%) rotate(45deg);
    -ms-transform: translate(-40%, -60%) rotate(45deg);
    transform: translate(-40%, -60%) rotate(45deg);
    width: .375em;
    height: .625em;
    border: 2px solid var(--white);
    border-left: 0;
    border-top: 0
}

.boxtoggle-subtitle,
.boxtoggle-title {
    display: block;
    position: relative;
    z-index: 1;
    white-space: nowrap
}

.boxtoggle-title {
    font-weight: 600
}

.boxtoggle-subtitle {
    font-size: 12px;
    font-style: italic;
    font-weight: 400;
    color: var(--light-black);
    letter-spacing: .05em
}

.boxtoggle-input {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0
}

.boxtoggle-input:checked~.boxtoggle-label {
    border-color: var(--base-color);
}

.boxtoggle-input:checked~.boxtoggle-check {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%) scale(1);
    -ms-transform: translate(-50%, -50%) scale(1);
    transform: translate(-50%, -50%) scale(1);
    -webkit-transition: .2s cubic-bezier(.175, .885, .32, 1.275);
    -o-transition: .2s cubic-bezier(.175, .885, .32, 1.275);
    transition: .2s cubic-bezier(.175, .885, .32, 1.275)
}

.boxtoggle-input:not(:checked)~.boxtoggle-check {
    opacity: 0
}

.amountfield-other .boxtoggle-check {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%) scale(1);
    -ms-transform: translate(-50%, -50%) scale(1);
    transform: translate(-50%, -50%) scale(1);
    -webkit-transition: .2s cubic-bezier(.175, .885, .32, 1.275);
    -o-transition: .2s cubic-bezier(.175, .885, .32, 1.275);
    transition: .2s cubic-bezier(.175, .885, .32, 1.275);
    left: 120px
}

.glyphinput {
    position: relative
}

.glyphinput-icon {
    position: absolute;
    top: 1.75em;
    left: 1em;
    width: 1.25em;
    height: 1.25em;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    color: var(--dark-gray);
}

.glyphinput-input {
    padding-left: calc(12px + 2.25em)
}

.glyphinput-input:not(input) {
    border: 1px solid var(--white-gray);
    border-radius: 1px
}

.glyphinput-input:not(input) input {
    border: 0;
    border-radius: 0;
    padding-left: 0;
    width: 100%
}

.amountfield {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin: 1em 0
}

.amountfield-select fieldset.checkbox-group legend,
.amountfield-select fieldset.radio-group legend,
.amountfield-select label,
fieldset.checkbox-group .amountfield-select legend,
fieldset.radio-group .amountfield-select legend {
    display: block
}

.amountfield-input {
    width: 120px;
    height: 48.8px;
    padding-top: .875em;
    padding-bottom: .875em;
    line-height: 19px
}

.amountfield-input:not(:focus).is-zero {
    color: var(--dark-gray)
}

.amountfield-balance {
    font-size: 12px;
    font-style: italic;
    color: var(--light-black)
}

.amountfield-balance .balancelabel {
    letter-spacing: .05em
}

.amountfield-balance .money {
    font-weight: 600;
    font-style: normal;
    font-size: 15px;
}

.amountfield-confirm {
    display: block;
    width: 100%;
    margin-top: 1.25em;
    margin-bottom: 1.25em
}

.amountfield-confirm.v-enter-active,
.amountfield-confirm.v-leave-active {
    -webkit-transition: .2s ease;
    -o-transition: .2s ease;
    transition: .2s ease
}

.amountfield-confirm.v-enter {
    opacity: 0;
    -webkit-transform: scale(.8);
    -ms-transform: scale(.8);
    transform: scale(.8)
}

.amountfield-confirm.v-leave-to {
    max-height: 0;
    overflow: hidden;
    padding-top: 0;
    padding-bottom: 0;
    margin-top: 0;
    margin-bottom: 0;
    opacity: 0
}

.amountfield-other {
    position: relative;
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    padding-left: 1.5em;
    margin-left: 1.5em
}

.amountfield-other .glyphinput-icon {
    top: 1.6em
}

.amountfield-other:before {
    content: "";
    position: absolute;
    display: block;
    width: 1px;
    height: 48px;
    left: 0;
    top: 28px;
    background: var(--light-gray)
}

.amountfield-other:after {
    content: "OR";
    position: absolute;
    display: block;
    background: var(--white);
    font-size: .7em;
    top: 45px;
    left: -6px;
    font-weight: 700;
    font-style: italic
}


.cardNumber {
    position: relative
}

.cardNumber-input {
    font-family: Monaco, Consolas, Inconsolata, Lucida Console, monospace;
    padding-left: 65px;
}

.cardNumber-type {
    position: absolute;
    top: 50%;
    left: 12px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}


.notice {
    line-height: 1.2;
    padding: 16px;
    border: 1px solid transparent;
    border-radius: .25em
}

.notice :first-child {
    margin-top: 0
}

.notice :last-child {
    margin-bottom: 0
}

.notice a {
    color: inherit;
    font-weight: 700
}


.notice-list {
    margin: 0 0 0 1em;
    padding: 0
}

.notice--error {
    border-color: #b30918;
    background: rgba(179, 9, 24, .15);
    color: #b30918
}

.notice--success {
    border-color: #2c8500;
    background: rgba(44, 133, 0, .15);
    color: #2c8500
}

.notice--warning {
    border-color: #f3b229;
    background: rgba(243, 178, 41, .15)
}

.notice--small {
    font-size: .875em;
    padding: .75em 1em
}

.notice.v-enter,
.notice.v-leave-to {
    opacity: 0;
    -webkit-transform: scale(.95);
    -ms-transform: scale(.95);
    transform: scale(.95)
}

.notice.v-enter-to,
.notice.v-leave {
    opacity: 1;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    -webkit-transition: opacity .3s ease, -webkit-transform .3s ease;
    transition: opacity .3s ease, -webkit-transform .3s ease;
    -o-transition: opacity .3s ease, transform .3s ease;
    transition: opacity .3s ease, transform .3s ease;
    transition: opacity .3s ease, transform .3s ease, -webkit-transform .3s ease
}


.check-list {
    list-style: none;
}

.check-list>li {
    position: relative;
    margin: .5em 0;
    padding-left: 36px;
}

.check-list>li:before {
    content: "";
    position: absolute;
    top: .25em;
    left: 0;
    opacity: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 24px;
    color: var(--base-color);
    border: 2px solid;
    background: url("data:image/svg+xml;charset=utf-8,%3Csvg width='9' height='7' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='%23F3B229' stroke-width='2' d='M7.862 1L3.288 5.5 1 3.25' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat 50% 55%;
    margin-right: .5em
}

.disclaimer {
    margin: 1em 0;
    font-size: 14px;
    font-style: italic;
    color: #889298;
    line-height: 1.5;
}


.notice .disclaimer {
    color: rgba(15, 24, 25, .8);
}


.promo-code {
    -webkit-transition: .2s ease;
    -o-transition: .2s ease;
    transition: .2s ease;
    color: var(--dark-gray);
}


.plans-message {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: 200px;
    -webkit-transition: .3s ease;
    -o-transition: .3s ease;
    transition: .3s ease;
}

.plans-message .callout {
    max-width: 512px;
    border: 1px dashed var(--dark-gray);
    border-radius: .25em;
    padding: 1.5em;
}





/***************************************************
****************************************************
 THANKU PAGE
 ***************************************************
 **************************************************/

.section--feature {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 32px;
    padding: 40px 0;
    border-top: 1px solid rgba(202, 203, 204, .5);
    border-bottom: 1px solid rgba(202, 203, 204, .5);
    margin: 32px;
}

.section--feature .section-item--aside {
    -ms-flex-preferred-size: 70%;
    flex-basis: 70%;
}

.section--feature ul li {
    padding: 0;
}


.section--feature ul li::before {
    display: none;
}

.section.print-hide {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 24px;
}

.print-hide .widget {
    width: 100%;
}

/***************************************************
****************************************************
MAIN SECTION STYLE ENDS HERE
 ***************************************************
 **************************************************/



/***************************************************
****************************************************
FOOTER STYLE ENDS HERE
 ***************************************************
 **************************************************/
.enrollment-footer {
    font-size: .8125em;
    padding: 16px 0;
    color: var(--light-black);
    font-style: italic;
    text-align: center;
}

.enrollment-footer p {
    margin: 0;
}

/***************************************************
****************************************************
FOOTER STYLE STARTS HERE
 ***************************************************
 **************************************************/