/*!
 * Bootstrap v3.3.6 (http://getbootstrap.com)
 * Copyright 2011-2015 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */

/***************************************************************************************************************************/
/* VARIABLES */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;700;900&display=swap');

:root {
    --color1: #1C1C54;
    --color2: #25C998;
    --color3: #282C7A;
    --color4: #1A1D53;
    --color5: #2391FF;
    --color6: #a94442;
    --color7: #76DABC;
    --yellow: #F9B32E;
    --yellow-faded: #FFFFCC;
    --color-faded: #f6f6f6;
    --background-faded: #F9F9F9;
}

/* Custom BootStrap Expansion*/

.col-xl-1, .col-xxl-1, .col-xl-2, .col-xxl-2, .col-xl-3, .col-xxl-3, .col-xl-4, .col-xxl-4, .col-xl-5, .col-xxl-5, .col-xl-6, .col-xxl-6, .col-xl-7, .col-xxl-7, .col-xl-8, .col-xxl-8, .col-xl-9, .col-xxl-9, .col-xl-10,.col-xxl-10, .col-xl-11,.col-xxl-11, .col-xl-12,.col-xxl-12
{
    position: relative;
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px;
}

/* col-xl 2K resolution */

@media(min-width:1400px) {
    .container { width: 1355px; }
    .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 { float: left; }
    .col-xl-1 { width: 8.33333% }
    .col-xl-2 { width: 16.66667% }
    .col-xl-3 { width: 25% }
    .col-xl-4 { width: 33.33333% }
    .col-xl-5 { width: 41.66667% }
    .col-xl-6 { width: 50% }
    .col-xl-7 { width: 58.33333% }
    .col-xl-8 { width: 66.66667% }
    .col-xl-9 { width: 75% }
    .col-xl-10 { width: 83.33333% }
    .col-xl-11 { width: 91.66667% }
    .col-xl-12 { width: 100% }
    .col-xl-offset-0 { margin-left: 0% }
    .col-xl-offset-1 { margin-left: 8.33333% }
    .col-xl-offset-2 { margin-left: 16.66667% }
    .col-xl-offset-3 { margin-left: 25% }
    .col-xl-offset-4 { margin-left: 33.33333% }
    .col-xl-offset-5 { margin-left: 41.66667% }
    .col-xl-offset-6 { margin-left: 50% }
    .col-xl-offset-7 { margin-left: 58.33333% }
    .col-xl-offset-8 { margin-left: 66.66667% }
    .col-xl-offset-9 { margin-left: 75% }
    .col-xl-offset-10 { margin-left: 83.33333% }
    .col-xl-offset-11 { margin-left: 91.66667% }
    .col-xl-offset-12 { margin-left: 100% }
}

/** col-xxl 4k resolution **/
@media(min-width:2000px) {
    .container { width: 1955px; }
    .col-xxl-1, .col-xxl-2, .col-xxl-3, .col-xxl-4, .col-xxl-5, .col-xxl-6, .col-xxl-7, .col-xxl-8, .col-xxl-9, .col-xxl-10, .col-xxl-11, .col-xxl-12 { float: left; }
    .col-xxl-1 { width: 8.33333% }
    .col-xxl-2 { width: 16.66667% }
    .col-xxl-3 { width: 25% }
    .col-xxl-4 { width: 33.33333% }
    .col-xxl-5 { width: 41.66667% }
    .col-xxl-6 { width: 50% }
    .col-xxl-7 { width: 58.33333% }
    .col-xxl-8 { width: 66.66667% }
    .col-xxl-9 { width: 75% }
    .col-xxl-10 { width: 83.33333% }
    .col-xxl-11 { width: 91.66667% }
    .col-xxl-12 { width: 100% }
    .col-xxl-offset-0 { margin-left: 0% }
    .col-xxl-offset-1 { margin-left: 8.33333% }
    .col-xxl-offset-2 { margin-left: 16.66667% }
    .col-xxl-offset-3 { margin-left: 25% }
    .col-xxl-offset-4 { margin-left: 33.33333% }
    .col-xxl-offset-5 { margin-left: 41.66667% }
    .col-xxl-offset-6 { margin-left: 50% }
    .col-xxl-offset-7 { margin-left: 58.33333% }
    .col-xxl-offset-8 { margin-left: 66.66667% }
    .col-xxl-offset-9 { margin-left: 75% }
    .col-xxl-offset-10 { margin-left: 83.33333% }
    .col-xxl-offset-11 { margin-left: 91.66667% }
    .col-xxl-offset-12 { margin-left: 100% }
}

/***************************************************************************************************************************/
/* COLORS */

.bg1 {
    background-color: var(--color1);
    color: white;
}

.bg2 {
    background-color: var(--color2);
}

.bg2 h1, .bg2 h2, .bg1 h1, .bg1 h2 {
    font-weight: 700;
    color: white;
}

.bg1 p, .bg2 p {
    color: white;
}

.bg8 {
    background-color: var(--yellow);
}

.border2 {
    border: 1px solid var(--color2);
}

.bg-gray {
    background-color: var(--background-faded);
}

.text-primary {
    color: var(--color1);
}

.text-accent {
    color: var(--color2);
}

/***************************************************************************************************************************/

body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background-color: #FFFFFF;
    font-family: Montserrat, Helvetica Neue, sans-serif;
    font-style: normal;
    font-weight: 400;
    margin: 0;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: transparent;
}

.body-content, #content-container, #content_form {
    flex: 1 0 auto;
}


h1, .h1, h1 > span, h1 > span > span { font-size: clamp(24px, 8.5vw, 48px)}
h2, .h2, h2 > span, h2 > span > span { font-size: clamp(18px, 7vw, 36px)}
h3, .h3 { font-size: clamp(16px, 6vw, 30px)}
h4, .h4 { font-size: clamp(14px, 5vw, 24px)}
h5, .h5 { font-size: clamp(12px, 4vw, 20px)}
p, .p, li,.li { font-size: clamp(8px, 3vw, 16px)}
legend { font-size: clamp(18px, 5vw, 24px); color: var(--color1) }
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6, p, .p {
    font-family: Montserrat, Helvetica Neue, sans-serif;
    color: var(--color1);
}

h1.forgot-password-heading {
    font-family: Montserrat, Helvetica Neue, sans-serif !important;
    font-size: clamp(24px, 8.5vw, 48px);
    color: var(--color1);
    font-weight: 400;
    margin-top: 3em;
    border-bottom: none;
}

#terms-container h2 {font-size: clamp(14px, 5vw, 24px); font-weight: 700; }
#terms-container h3 {font-size: clamp(12px, 4vw, 20px); font-weight: 700;}

.bold, h1, h2 {
    font-weight: 700;
}

.block-left, .block-right, .block-center {
	display: block;
	max-width: 100%;
	padding: 1.5rem;
}

.block-left {
	margin-left: 0;
	margin-right: auto;
}

.block-right {
	margin-right: 0;
	margin-left: auto;
}

.block-center {
	margin-left: auto;
	margin-right: auto;
}

.fill-full { width: 100%; }
.fill-wide { width: 80%; }
.fill-medium { width: 60%; }
.fill-narrow { width: 40%; }

.glyphicon-refresh {
    animation: spin 1s infinite linear;
    -webkit-animation: spin2 1s infinite linear;
}

.msg-warning {
    color: red;
    font-size: clamp(8px, 3vw, 12px)
}

@keyframes spin {
    from { transform: scale(1) rotate(0deg); }
    to { transform: scale(1) rotate(360deg); }
}

@-webkit-keyframes spin2 {
    from { -webkit-transform: rotate(0deg); }
    to { -webkit-transform: rotate(360deg); }
}

button > .glyphicon-refresh {
    margin-top: -1.5em;
    padding: 3px 10px;
    display: block;
}

.flex-container {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.flex1 {
    display: flex;
    justify-content: center;
}

.flex {
    background-color: inherit;
    border-radius: 3px;
    padding: 20px;
}

.flex-wrap {
    flex-wrap: wrap;
}

.flex1-child {
    flex-grow: 1;
    min-height: 100px;
}

.flex-left, .flex-right {
    width: 50%;
}

@media screen and (max-width: 767px) {
    .flex-container {
        display: block;
    }

    .flex-left, .flex-right {
        display: block !important;
        text-align: center !important;
    }
    
    .col-xs-3 {
        width: 70%;
    }
}

.homepageicon {
    width: 20%; 
    display: block; 
    margin-left: auto; 
    margin-right: auto
}


@media (min-width: 320px) and (max-width: 1200px) {
    footer .footer-bottom {
        font-size: calc(15px + (30 - 15) * ((100vw - 320px) / (1200 - 320))) !important;
    }
}

@media (min-width: 600px) and (max-width: 1200px) {
     footer .footer-bottom {
        font-size: calc(15px + (30 - 15) * ((100vw - 600px) / (1200 - 600))) !important;
    }
}

a {
    color: var(--color2) ;
}

a:hover {
    color: var(--color1);
    text-decoration: none;
}

a:not([href]):not([class]), a:not([href]):not([class]):hover {
    color: inherit;
    text-decoration: none;
}

a.accordion-toggle[aria-expanded="true"] {
    color: var(--color2);
    text-decoration: none;
    padding-right: 3px;
}

a.accordion-toggle[aria-expanded="false"] {
    color: var(--color1);
    text-decoration: none;
    padding-right: 3px;
}

.nav-tabs>li.active>a, .nav-tabs>li.active>a:hover, .nav-tabs>li.active>a:focus {
    border: none;
    color: var(--color1);
}

.small-text {
    font-size: 13px;
    color: var(--color1);
}

@media (min-width: 600px) and (max-width: 1200px) {
    .small-text {
        font-size: calc(11px + (22 - 11) * ((100vw - 600px) / (1200 - 600)));
    }
}

.line-height-1-5 {
    line-height: 1.5em;
}

.line-height-1-75 {
    line-height: 1.75em;
}

@media (min-width: 600px) and (max-width: 1200px) {
    .small-text {
        font-size: calc(11px + (13 - 11) * ((100vw - 600px) / (1200 - 600))) !important;
    }
}

@media (min-width: 1200px) {
    .small-text {
        font-size: 13px;
    }
}

.navbar-static-top.navbar-inverse {
    background-color: #FFFFFF !important;
    border-color: transparent;
}

.container-syringa {
    margin-right: 0;
    margin-left: 0;
    padding-left: 0;
    padding-right: 0;
    width: 100% !important;
}

.row-syringa {
    margin-left: 0;
    margin-right: 0;
    width: 100% !important;
}

.syringa-validation-summary .validation-header, .syringa-validation-summary ul li, .syringa-validation-summary ul li a {
    color: var(--color6);
}

.syringa-validation-summary.alert.alert-danger {
    background-color: #FFFFFF;
    color: var(--color6);
}

.validation-header span.fa, .validation-header {
    font-size: clamp(12px, 4vw, 20px);
}

/* page overlay */
.syringa-overlay {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 999;
    background: rgba(225, 225, 225) url("loader2.gif") center no-repeat;
    background-size: 200px 200px;
}

/* Turn off scrollbar when body element has the loading class */
body.syringa-loading {
    overflow: hidden;
}

/* Make spinner image visible when body element has the loading class */
body.syringa-loading .syringa-overlay {
    display: block;
}

/* DIV COMPONENTS */
div.right-align {
    text-align: right;
    padding-right: 1em;
}

@media (max-width: 991px) {
    div.right-align {
        text-align: left;
    }
    #signuptoday {
      align-items: center;
      justify-content: center;
    }
}

div.right-col {
    text-align: left;
}

/* TABLES */

@media only screen and (max-width: 760px) {

    .privacy-table table {
        display: table;
    }

    table tbody tr td:before {
        font-weight: bold;
        display: block;
    }
}

/* FORMS AND FORM CONTROLS */
.form-control {
    border: 1px solid #ced4da;
    border-radius: .25rem;
    height: calc(1.5em + .75rem + 2px);
    padding: .375rem .75rem;
}

/* TOP NAVIGATION */

.caret {
    border-top: 6px dashed;
    border-right: 6px solid transparent;
    border-left: 6px solid transparentt;
}

.navbar-inverse .navbar-toggle {
    border: none;
    color: var(--color2);
    background-color: #FFFFFF;
}

.navbar-toggle .icon-bar {
    background-color: var(--color2);
    border: 1px solid var(--color2);
}

.navbar-inverse .navbar-toggle .icon-bar {
    background-color: var(--color2);
}

.navbar-inverse .navbar-toggle {
    border: none;
}

.navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:focus {
    background-color: #FFFFFF;
}

ul.dropdown-menu li a[role='menuitem']:hover {
    color: var(--color2);
}

.dropdown-menu {
    border: 0px;
    box-shadow: 0px 25px 20px -20px gray;
}


/* BREADCRUMB */
ul.breadcrumb, ul.breadcrumb > li.active {
    display: none;
}

ul.breadcrumb > li a {
    color: var(--color5);
}

.breadcrumb > li+li:before {
    color: var(--color5);
}

#content_form .breadcrumb {
    display: none;
}

/* BNG BANNER */
.bng-sticky {
    position: fixed;
    top: 0px;
    width: 100%;
}

#bng-header {
    padding: 1em;
    background: var(--yellow-faded);
    min-height: 7rem;
    display: none;
    width: 100%;
    z-index: 1000;
}

#bng-header h2, #bng-header p {
    text-align: center;
}

#bng-header p, #bng-header p a, .bng-sticky p, .bng-sticky p a {
    font-size: 12px;
}

#bng-header p a, .bng-sticky p a {
    text-decoration: underline;
    color: blue;
}

.header-banner {
    padding: 1em;
    background: var(--yellow-faded);
    display: none;
    width: 100%;
    z-index: 1000;
}

.header-banner p {
    font-size: 1.5rem;
    color: var(--color1);
}

.header-banner p a {
    font-size: 1.5rem;
    color: var(--color2);
    text-decoration: none;
}

/* LISTS */
ol.spaced-2 li, ul.spaced-2 li {
    line-height: 2em;
}

/* ACCORDION */
.accordion {
    cursor: pointer;
    padding: 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
    transition: 0.4s;
}

.active, .accordion:hover {
    background-color: #ccc;
}


#panelFAQ {
  background-color: var(--background-faded);
}

.faqheader {
  color:  var(--color1);
  font-weight: 700;
}

.panel {
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.panel-group .panel-heading+.panel-collapse>.panel-body,
.panel-group .panel-heading+.panel-collapse>.list-group {
    border-top: none;
}
.panel-checkout{
    padding: 1em 0 0 0;
}

.panel-checkout .panel-body {
    padding: 0;
    overflow: hidden;
}

/***************************************************************************************************************************/
/* PORTAL REGISTRATION */
input[id*='captcha'], a[id*='captcha'] {
    margin-top: .5em;
}

label[id*='captcha'] {
    padding-left: .5em;
}

/*MAKE REQUIRED FIELDS MARKER DESIGNATED COLOR */
#terms-modal{
    display: none;
}

html[dir=ltr] .crmEntityFormView .tab .tab-column {
    padding-left: 0px;
}

.crmEntityFormView .tab-title {
    border-bottom: 2px solid #ddd;
    padding-bottom: 1rem;
    font-size: clamp(16px, 6vw, 30px)
}

.crmEntityFormView .section-title {
    display: none;
}

div[data-name=tab_hidden] {
     display: none; 
    }

div[class="ui-dialog ui-corner-all ui-widget ui-widget-content ui-front ui-draggable ui-resizable"]:target {
    visibility: visible;
    opacity: 1;
  }

.ui-dialog .ui-dialog-content {
    position: relative;
    border: 0;
    padding: 0.5em 1em;
    background: 0 0;
    overflow: hidden;
}
  
#terms-contents {
    overflow-y: auto;
    max-height: calc(80vh - 180px);
    background: #fff;
  }

.modal-content {
    padding: 5px;
    border-radius: 15px;
}

.modal h2 {
    font-size: clamp(18px, 7vw, 36px)
}

.modal-footer {
    padding: 10px;
}

.modal-dialog{
    overflow-y: initial !important
}

#i-agree-btn {
    margin-top: 0px;
}

@media screen and (max-width: 768px) {
    /* image has .img-responsive which takes care of the display; NEED TO OVERRIDE IT TO CENTER IMAGE */
    #portal-reg-connectfast-logo {
        display: inline;
        text-align: center;
        margin-bottom: 1.5em;
    }
}

@media screen and (max-width: 767px) {
    img[id*='captcha'] {
        margin-bottom: 1em;
    }
}

@media screen and (max-width: 600px) {
   label[id*='captcha'] {
        display: block;
        padding-left: 0em;
    }

    #terms {
        max-height: 300px;
        border: 1px solid #000000;
    }

    #InsertButton {
        margin-top: 200px;
    }
}

/***************************************************************************************************************************/
/* CHAT BOT */
#chatbot-main {
    display: block;
    border: none;
    position: fixed;
    margin: auto 5px 5px auto;
    inset: 385px 0px 0px auto;
    width: 400px;
    z-index: 999999999;
    text-align: right;
}

#chatbot-main button {
    display: inline;
    background-color: rgb(11, 85, 106);
    color: #FFFFFF;
}

#chatbot {
    display: block;
    border: none;
    position: fixed;
    margin: auto 5px 5px auto;
    inset: auto 0px 0px auto;
    width: 400px;
    height: 400px;
    opacity: 1;
    background: none transparent;
    max-height: 100%;
    max-width: 100vw;
    transform: translateY(0px);
    transition: none 0s ease 0s;
    visibility: visible;
    z-index: 999999999;
    border-radius: 15px;
}

#chatbot, #chatbot html, #chatbot body {
    background-color: #FFFFFF;
}

/***************************************************************************************************************************/
/* HOME PAGE */

.services {
    margin-top: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #FFFFFF;
    padding: 20px;
}

.list-services {
    list-style-type: none;
    /* Remove bullets */
    padding: 0;
    /* Remove padding */
    margin: 0;
    /* Remove margins */
    margin-bottom: 1em;
}

.list-services li {
    font-size: 16px;
    line-height: 24px;
}

.btn-color2, #InsertButton {
    border-style: none;
    border-radius: 20px;
    background-color: var(--color2);
    color: white;
    margin-top: 15px;
    display: inline-block;
    text-align: center;
    user-select: none;
    padding: 5px 10px;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: 700;
}

.btn-color5, #submit-redeem-invitation, #submit-signin-local, #submit-forgot-password, .btn-primary  {
    border-radius: 20px;
    background-color: var(--color5);
    border: none;
    color: white;
    margin-top: 15px;
    display: inline-block;
    text-align: center;
    user-select: none;
    padding: 5px 10px;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: 700;
}

.btn-color6 {
    border-radius: 20px;
    background-color: var(--color6);
    border: none;
    color: white;
    margin-top: 15px;
    display: inline-block;
    text-align: center;
    user-select: none;
    padding: 5px 10px;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: 700;
}


.btn:hover, .btn:focus, .btn:active, .btn:active:hover, .btn:active:focus, .btn.active:active, #submit-redeem-invitation:hover, #submit-redeem-invitation:active, #submit-redeem-invitation:focus,
#submit-signin-local:hover, #submit-signin-local:active, #submit-signin-local:focus, #submit-forgot-password:hover, #submit-forgot-password:active, #submit-forgot-password:focus, 
#InsertButton:hover, #InsertButton#focus, #InsertButton#active {
  cursor: pointer;
  box-shadow: 0 4px 6px 0 rgba(0,0,0,.3);
  outline: none;
  border: none;
  color: #151742;
}

.btn-primary:hover, .btn-primary:active {
    background-color: var(--color5);
}

a:not([href]):not([class]),
a:not([href]):not([class]):hover {
    color: inherit;
    text-decoration: none;
}

.btn {
    font-size: clamp(12px, 3vw, 16px)
}

.btn-clear {
    color: rgb(80, 80, 80);
    background-color: transparent;
    border: none;
    display: inline-block;
    padding: .75em;
    margin-top: .75em
}

.btn-clear:hover, .btn-clear:active, .btn-clear:focus {
    cursor: pointer;
    border: none;
    outline: none;
    text-decoration: underline;
}

#submit-signin-local + a {
    margin-top: 10px;
    font-size: 12px;
    background-color: transparent;
    border: none;
    color: rgb(80, 80, 80);
    display: block;
}

#submit-signin-local + a:hover,#submit-signin-local + a:focus, #submit-signin-local + a:active {
    cursor: pointer;
    border: none;
    text-decoration: underline;
    box-shadow: none;
}

@media only screen and (max-width: 760px) {
    div > button.btn-dark {
        width: 80%;
        display: block;
    }
    #bill-options-container p{
        width: 80%;
    }
}

.fiber-logo {
    display: inline-block;
}

#startingPrice {
    color: var(--color1);
    word-spacing: 9999rem;
}

#mapPicture {
    width: 80%;
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding-top: 10px;
}

#supportIcon {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

#home-why-connectfast-internet {
    padding: 20px;
    position: relative;
    width: 100%;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    background-color: #FFFFFF;
    border-radius: 7px;
    box-sizing: border-box;
}

/* SERVICE AVAILABILIY CHECK */
.addresssearch {
    display: block;
    justify-content: center;
    align-content: center;
}

#divCheckAddress {
    margin: 2em auto;
}

#divAddresses {
    max-height: 80vh; 
    overflow-y: auto;
    overflow-x: hidden;
    padding: 1rem;
    display: flex !important;
    flex-wrap: wrap;
    justify-content: center
}

#divAddresses > [class*='col-'] {
    display: flex;
    flex-direction: row;
  }

.address-card {
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 300ms;
    padding: 1rem 3rem;
    border-radius: 1rem;
    min-height: 80px;
    width: 100%;
    margin-bottom: 1.5rem;
    font-size: clamp(6px, 3vw, 14px);
    line-height: 2.0rem;
}

.address-card.addr-available:hover {
    border: 1px solid var(--color2);
}

.address-card.addr-serviced:hover, .address-card.addr-unavailable:hover {
    cursor: not-allowed;
    pointer-events: all !important;
}

.addr-available {
    border: 1px solid grey;
}

.addr-serviced {
    border: 1px solid var(--yellow);
    background-color: var(--yellow-faded);
}

.addr-unavailable {
    border: 1px solid grey;
    background-color: var(--background-faded);
}

.addr-available .pull-right {
    color:var(--color2);
    font-weight: 700;
}

.addr-serviced .pull-right {
    color:var(--yellow);
    font-weight: 700;
}

.addr-unavailable .pull-right {
    color:grey;
    font-weight: 700;
}

.required-red {
    color: var(--color6);
}

.card {
    border-radius: 5px;
    border: 0;
    box-shadow: 0px 0px 10px 0px rgba(82, 63, 105, 0.1);
    -webkit-box-shadow: 0px 0px 10px 0px rgba(82, 63, 105, 0.1);
    -moz-box-shadow: 0px 0px 10px 0px rgba(82, 63, 105, 0.1);
    -ms-box-shadow: 0px 0px 10px 0px rgba(82, 63, 105, 0.1);
}

.card-title {
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 25px;
    text-align: center;
}

.card-title-price {
    color: var(--color5);
}

.card-subtitle {
    font-weight: bold;
}

.card-plan {
    border-radius: 10px;
    border-color: var(--color2);
    border-style: solid;
    border-width: thin;
    background-color: var(--color-faded);
}

.card-plan hr {
    width: 15%; 
    border: solid var(--color2);
}

.card-plan:hover, .onegbhome-card:hover, .plan-card:hover, .address-card.addr-available:hover {
	-webkit-box-shadow: 0 5px 10px rgba(175, 176, 176, 0.6);
	box-shadow: 0 5px 10px rgba(175, 176, 176, 0.6);
	-webkit-transform: translateY(-5px);
	-moz-transform: translateY(-5px);
	-ms-transform: translateY(-5px);
	-o-transform: translateY(-5px);
	transform: translateY(-5px);
}

.common-card {
    border-radius: 0px;
    padding: 0em;
    border: none;
}

.card-image-container {
    padding: 0em;
}

.card-body {
    padding: 20px 20px 0px 20px;
    margin-bottom: 1em;
}

.common-card .card-body {
    padding: 2em;
}

.card-body div div {
    margin: auto 0px;
}

.common-card div {
    margin: 0;
}

.card+.card {
    margin-left: 2%;
}

.subscription-card {
    margin-bottom: 1em;
    background-color: #fff;
    width: 80%;
}

.plan-details {
    line-height: 2.0;
    color: gray;
    flex: 1 0 auto;
}

.plan-card-top {
    height: 100%;
}

@media (min-width: 576px) {
    .card {
        flex: 1 0 0%;
        margin-bottom: 0;
    }
}

@media only screen and (max-width: 600px) {
    .flex {
        padding: 0;
    }

    .flex1 {
        flex: none;
        display: block;
    }

    .card {
        width: 80%;
        display: block;
        margin-top: 1em;
        margin-left: auto;
        margin-right: auto;
    }

    .card+.card {
        margin: inherit auto inherit auto;
    }

    .common-card {
        width: 100%;
    }
}

.card img {
    display: block;
    margin: 0 auto;
}

.common-card img, #home-fast-and-affordable-row img {
    width: 100%;
    display: block;
    margin: 0 0;
    padding-top: 0px;
}

#contentHead {
    color: var(--color1);
    text-align: center;
    margin-top: 10px;
    margin-bottom: 10px;
}

#home-committed {
    padding-bottom: 30px;
    line-height: 24px;
}

#home-committed h2 {
    margin-bottom: 20px;
}

#home-committed-service-and-support {
    margin-top: 2em;
}

#home-committed-service-and-support p {
    line-height: 1.5rem;
}

/* THIS FIXES THE SEARCH BUTTON TO BE AT THE SAME LEVEL AS THE SELECT LIST */
.input-group-btn {
    vertical-align: top;
}

#smallLogo {
    width: 40%;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

@media (min-width: 320px) and (max-width: 768px) {
    #smallLogo {
        width: 80%;
    }
}

.fiberCompanyLogo {
    max-height: 80px;
    display: block;
    margin-left: auto;
    margin-right: auto;
 }

 .onegbhome-card {
    width: 280px;
    padding-top: 10px;
    background-color: white;
    margin: 8px;
    position: relative;
    z-index: 1;
    overflow: hidden;
    transition: 0.7s;
}

@media (max-width: 760px) {

      #fibercompany {
       max-height: 50px;
    }

    .onegbhome-card, .smallscreen-center {
        margin: 0px auto;
        text-align: center;
    }

    .btnsmallscreen-center, #submit-signin-local + a {
        display: block;
        justify-content: center;
        align-items: center;
    }
}

@media (min-width: 761px) and (max-width: 991px) {
   
    #fibercompany {
        max-height: 60px; 
    }

    .onegbhome-card, .smallscreen-center {
        margin: 0px auto;
        text-align: center;
    }

    .btnsmallscreen-center, #submit-signin-local + a {
        display: block;
        justify-content: center;
        align-items: center;
    }
}

/***************************************************************************************************************************/
/* TERMS OF USE */

#terms-container {
    line-height: 1.75em;
    overflow-y: auto;
    max-height: 70vh;
}

.nav-tabs > li > a {
    font-weight: 700;
    color: inherit;
    border: 0;
    margin: 0;
}

.nav-tabs > li > a:hover {
    background-color: none;
}

.nav-tabs {
    border-bottom: 2px solid var(--color-faded);
}

.nav-tabs > li {
    border-bottom: 4px solid transparent;
}

.nav-tabs > li.active {
    border-bottom: 4px solid var(--color3);
}

.privacy-table {
    color: var(--color1);
    border-color: var(--color1);
    width: 90%;
    margin-left: auto;
	margin-right: auto;
}

.table-bordered, .table-bordered>thead>tr>th,.table-bordered>tbody>tr>th, .table-bordered>tbody>tr>td {
    border: 1px solid var(--color1);
}

/***************************************************************************************************************************/
/* SPEED TEST */
/* BODY INSIDE IFRAME HAS A MARGIN; COUNTER IT WITH DIV CONTAINER MARGIN*/
.embed-responsive {
    margin-right: 8px;
}

@media screen and (max-width: 820px) {
    .embed-responsive {
        height: clamp(650px, 1vh, 1000px);
    }
}

/***************************************************************************************************************************/
/* FAQ PAGE */
#page-heading {
    display: table;
    height: 400px;
}

ol,li {
    color: var(--color1);
} 

@media only screen and (max-width: 760px) {
    #page-heading {
        height: 200px;
    }
}

@media only screen and (min-width: 761px) and (max-width: 992px) {
    #page-heading {
        height: 250px;
    }
}

.header-img {
    max-height: 500px;
    margin-left: auto; 
    margin-right: 0; 
    max-width: 100%; 
    height: auto;
}

#page-heading > * {
    display: table-cell;
    vertical-align: middle;
}

.panel {
    border: 0;
}

.panel-body {
    border: 0;
    padding: 10px;
    margin-left: 10px;
}

.panel-body .container {
    width: auto;
    margin: 0px;
}

.panel-heading .accordion-plus-toggle:before {
    font-family: 'Glyphicons Halflings';
    content: "\2212";
    /* - */
    float: right;
    color: var(--color2);
    font-size: clamp(12px, 4vw, 16px);
}

.panel-heading .accordion-plus-toggle.collapsed:before {
    font-family: 'Glyphicons Halflings';
    content: "\002b";
    /* + */
    color: var(--color1);
    font-size: clamp(12px, 4vw, 16px);
}

/* sets the link to the width of the entire panel title */
.panel-title > a {
    display: block;
}

.panel-heading {
    padding: 0;
}

.panel-heading > div > a {
    padding: 15px 15px;
}

.panel-heading:hover {
    background-color: color-mix(in srgb, var(--color1) 5%, transparent);
}

.active {
    background-color: #FFFFFF;
}

/***************************************************************************************************************************/
/* MY ACCOUNT */

.myaccount-container {
    width: 100%;
    background-color: var(--background-faded);
    padding: 3em 0;
}

.account-information > p>span {
    padding-left: 1em;
}

.account-information > p a {
    display: inline-block;
    margin-left: 4em;
}

.accountinfo-input {
    display: inline-block;
    width: 100%;
}

.accountinfo-label {
    display: block;
    color: var(--color1);
}

.btn-addservice {
    color: var(--color2);
    background-color: transparent;
    border: none;
    display: inline-block;
}

.btn-addservice:hover, .btn-addservice:active, .btn-addservice:focus {
    cursor: pointer;
    border: none;
    outline: none;
    text-decoration: underline;
}

.btn-service-info {
    font-size: clamp(10px, 2vw, 12px);
    margin-top: 10px;
}

.list-group-item.active, .list-group-item.active:hover {
    background-color: transparent;
    color: #555;
    text-decoration: underline;
}

.privacy-table>.table>tbody>tr>th, .privacy-table>.table>tbody>tr>td {
    border-top: none;
    padding: 3px 10px 3px 10px;
}

.my-account-table.table>tbody>tr>th, .my-account-table.table>tbody>tr>td {
    border-top: none;
}

table {
    border-collapse: collapse;
}

table th {
    white-space: nowrap;
}

table.sectioned tbody {
    border: 1px solid gray;
    border-collapse: separate;
    border-spacing: 4px;
    color: gray;
    font-size: clamp(8px, 3vw, 14px)
}

.subscription-data-card > div {
    position: relative;
}

.crmEntityFormView .tab, .crmEntityFormView fieldset {
    margin-bottom: 0px;
}

img[src='/xrm-adx/images/contact_photo.png'], img[src='https://content.powerapps.com/resource/powerappsportal/img/contact_photo.png'] {
    display: none;
}

.status_label.active {
    color: var(--color2);
}

.status_label.processing {
    color: var(--yellow);
}

.status_label.nonepayment {
    color: var(--color6);
}

.status_label.customer_canceled {
    color: var(--color6);
}

.status_label.pending_payment {
    color: var(--yellow);
}

.status_label.cancellation_requested {
    color: var(--yellow);
}

.serviceStatusForm {
    max-width: 768px;
    text-align: center;
}

.btnCancel, 
.btnReactivate,  
.btnMakePayment, 
.btnManagePaymentMethod,
.btnLatePayment {
    display: none;
}

div.container:has(> .row > #mainContent > form > div > fieldset > div#login-validation-summary ) {
    flex: 1 0 auto;
}

.well {
    background-color: transparent;
    border: none;
    color: var(--color1);
    font-weight: bold;
    font-size: clamp(14px, 5vw, 24px);
    box-shadow: none;
    padding: 15px;
}

html[dir=ltr] .userFullName {
    font-weight: bold;
    font-size: clamp(14px, 5vw, 24px);
    padding-left: 0px;
}

/***************************************************************************************************************************/
/* #region Sign In Page */
#content-container, #register-container, .createorder-container {
    width: 100%;
    background-color: var(--background-faded);
    padding: 3em 0;
}

#content-container #content {
    margin: 0 auto 0 auto;
    max-width: 95%;
}

#content-container::before {
    content: "Welcome to ConnectFast";
    font-size: clamp(24px, 8.5vw, 54px);
    font-weight: 700;
    color: var(--color1);
    margin-top: 3rem;
}

#content-container > #content::before {
    content: "Please sign in or redeem your invitation.";
    font-size: clamp(8px, 3vw, 20px);
    color: var(--color2);
}

#content-container #content .nav-tabs {
    display: flex;
    justify-content: center;
    flex-direction: row;
    margin: 5rem 1rem 0 1rem;
}

#content-container #content .nav-tabs .fa.fa-sign-in {
    display: none;
}

#content-container #content .nav-tabs .active,
#content-container #content .nav-tabs .active a {
    background-color: var(--background-faded);
}

#content-container #content .nav-tabs .focus,
#content-container #content .nav-tabs .focus a {
    border: none;
}

.forgot-password-heading:focus-visible, a:focus-visible, #loginValidationSummary:focus-visible, #redeemInvitation-validation-summary:focus-visible, .nav>li>a:focus {
    outline: none;
}

#loginValidationSummary ul li a, #redeemInvitation-validation-summary ul li a{
    color: red;
}

.alert-info {
    background-color: #ddf5fa;
    border-color: transparent;
    color: var(--color1);
}

#ebs_account_main_address_country_label,  
#ebs_account_main_address_country,
#ebs_account_billing_address_stateorprovince,
#ebs_account_billing_address_country_label,
#ebs_account_billing_address_country,
#ebs_product_id_string_label,
#ebs_product_id_string,
#message_main,
#ebs_raid_address_id,
#ebs_raid_address_id_label,
#ebs_raid_infrastructure_id,
#ebs_raid_infrastructure_id_label,
#ebs_raid_bill_option_id,
#ebs_raid_bill_option_id_label,
#ebs_raid_residential_provider,
#ebs_raid_residential_provider_label,
#btnAddService  {
    display: none
}

@media only screen and (max-width: 760px) {
    #content {
        padding: 10px;
    }
    #content-container .page-content .col-md-6
    {
        width: 100%;
        margin-left: 0%
    }

    #content-container::before {
        margin-left: 10vw;
    }

    #content-container > #content::before {
        margin-left: 5vw;
    }

    #lease-name {
        text-align: left;
    }

    #lease-desc {
        margin-left: 0rem;
    }

    .card+.card {
        margin-left: auto;
    }

    .plan-card-body {
        padding: 0rem;
    }
}

@media(min-width:768px) and (max-width:991px) {
    #content-container #content {
        max-width: 90%;
    }

    #content-container .page-content .col-md-6
    {
        width: 90%;
        margin-left: 5%;
    }

    #content-container::before {
        margin-left: 10vw;
    }

    #content-container > #content::before {
        margin-left: 5vw;
    }

    #lease-name {
        text-align: left;
    }

    #lease-desc {
        margin-left: 0rem;
    }

    .card+.card {
        margin-left: 2%;
    }

    .plan-card-body {
        padding: 0rem;
    }
}

@media(min-width:992px) and (max-width:1399px)
{
    #content-container #content {
        max-width: 70%;
    }

    #content-container .page-content .col-md-6 {
        width: 80%;
        margin-left: 10%;
    }
    
    #content-container::before {
        margin-left: 10vw;
    }

    #content-container > #content::before {
        margin-left: -5vw;
    }

    .plan-card-body {
        padding: 0rem;
    }
}

@media(min-width:1400px) and (max-width:1999px) {
    #content-container #content {
        max-width: 50%;
    }

    #content-container .page-content .col-md-6
    {
        width: 80%;
        margin-left: 10%;
    }

    #content-container::before {
        margin-left: 12vw;
    }

    #content-container > #content::before {
        margin-left: -13vw;
    }
}

@media(min-width:2000px) {
    #content-container #content {
        max-width: 40%;
    }

    #content-container .page-content .col-md-6
    {
        width: 80%;
        margin-left: 10%;
    }

    #content-container::before {
        margin-left: 20vw;
    }

    #content-container > #content::before {
        margin-left: -10vw;
    }
}

#content-container > #content form .form-group > * {
    width: 100%;
    text-align: left;
    margin-bottom: .5rem;
}

.login-heading-section {
    display: none;
}


/* #endregion */
/***************************************************************************************************************************/

@media only screen and (max-width: 760px) {
    #bill-options-container p {
        width: 80%;
    }
}

.display-selected {
    color: var(--color1);
    margin-left: 2rem;
    margin-right: 2rem;
}

#linkPlansAndPricing {
    display: none;
}

#service-message-fail, #service-message-success {
    display: none;
}

#checkout-wrapper, #checkout-container {
    background-color: var(--background-faded);
    margin-top: 20px;
}

.register-btn {
    margin-top: 1em; 
    margin-left: auto; 
    margin-right: auto; 
    text-align: center;
}

/***************************************************************************************************************************/
/* PLANS AND PRICING */

.currency {
    color: var(--color5);
    margin-right: 2px;
    display: inline-block;
    vertical-align: top;
}

.price {
    color: var(--color5);
    display: inline-block;
    vertical-align: baseline;
    background: transparent;
}

.price-cents {
    color: var(--color5);
    display: inline-block;
}

.frequency {
    color: var(--color5);
    font-weight: 700;
    margin-left: 1rem;
    display: inline-block;
}

.plan-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    max-width: 300px;
    word-wrap: break-word;
    background-color: var(--color-faded);
    border-color: rgba(193, 194, 194, 0.6);
    border-radius: 10px;
    border-style: solid;
    border-width: thin;
    color: var(--color3); 
}

.plan-card:hover {
    border-color: var(--color2);
}

.plan-card hr {
    width: 15%; 
    border: solid var(--color2);
    margin-top: 0px;
    margin-bottom: 10px;
}

.plan-card-register {
    margin-left: auto; 
    margin-right: auto;
    margin-bottom: 1rem;
    border-color: var(--color2);
}

.plan-card-body {
    padding: 2rem;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    height: 100%;
}

h2.plan-name {
    font-size: clamp(18px, 4vw, 24px);
    line-height: 1.5;
}

#changePlan {
    width: 100%; 
    color: var(--color5);
}

#changePlan:hover {
    color: rgb(80, 80, 80);
    text-decoration: underline;
}

/* Create your order page */
.panel-details {
    font-weight: 400; 
    margin-top: 2rem;
    line-height: 1.5em;
}

/* How it works page */

.sub-title-color5 {
    font-weight: 700;
    color: var(--color5);
}
/***************************************************************************************************************************/
/* Request Registration Completion */

.page-header {
    border-bottom: none;
}

/***************************************************************************************************************************/
/* PROFILE PAGE */

/*  .weblinks .list-group  #151742  */
div[data-label="Profile Navigation"], div[data-label="Profile Navigation"] .weblinks, div[data-label="Profile Navigation"] .weblinks .list-group-item {
    background-color: var(--color4);
    color: #FFFFFF;
}

/* #region Generated CSS */

.navbar {
    background-color: white;
    min-height: 60px;
}

.navbar-right > ul {
    text-align: end;
}

.navbar-static-top {
    border-width: 0;
    margin-bottom: 0;
}

.navbar-static-top.navbar .navbar-collapse {
    max-height: 510px;
    box-shadow: none;
    border-top: none;
}

.navbar-static-top.navbar > .container > .row > div {
    float: none;
    display: inline-block;
    vertical-align: bottom;
}


.navbar-static-top.navbar .menu-bar > .navbar-nav > li > a.active {
    color: var(--color2);
    font-weight: bold;
}

.navbar-static-top.navbar .menu-bar > .navbar-nav > li > a {
    font-size: 15px;
    font-weight: 400;
    color: var(--color1);
}

.navbar-static-top.navbar .menu-bar > .navbar-nav > li > a:hover {
    color: var(--color2);
}

.navbar-static-top .navbar-brand {
    font-size: 2.11em;
    font-family: var(--font1);
    color: #232222;
    position: relative;
}

@media (max-width: 1200px) {
    .navbar-static-top .navbar-brand {
        position: initial;
        height: 42px;
    }
}

@media (max-width: 767px) {
    .navbar-header {
        position: relative;
    }
    .navbar-static-top.navbar > .container > .row > div {
        display: block;
    }

    .navbar-header {
        position: relative;
    }
}

footer {
    position: relative;
    color: #AAAAAA;
    position: inherit;
}

.socialmediaicon {
    max-width: 3rem;
    float: left;
    display: block;
    margin: 10px;
}

.socialmediaicon:hover {
    cursor: pointer;
}
.socialmediaicon circle {
    fill: none;
    stroke-width: 4px;
    stroke: var(--color1);
}
.socialmediaicon:hover circle {
    stroke: var(--color2);
}
.socialmediaicon path {
    fill: var(--color1);
    stroke: none;
}
.socialmediaicon:hover path {
    fill: var(--color2);
}

/* to prevent footer from laying on top of the chatbot area */
footer > .container {
    padding: 4rem 0;
}

footer svg.logo { 
    max-height: 2em; 
    max-width: 12em;
}

.footerlink {
    color: var(--color1);
}

.footerlink:hover {
    color: var(--color2);
}

#footer-copyright {
    text-align: center;
    font-size: 13px;
    background-color: var(--color1);
    padding: 2rem 0;
}

#footer-copyright p {
    color: var(--color-faded);
}

#footer-copyright p {
    color: var(--color-faded);
}

.dropdown-menu>li>a {
    color: var(--color1);
}

.dropdown-menu>li>a:hover {
    border: none;
    padding: 3px 20px;
}

.dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus, .dropdown-menu>li>a:active {
    text-decoration: none;
    background-color: transparent;
}

.dropdown-menu>.active>a, .dropdown-menu>.active>a:hover, .dropdown-menu>.active>a:focus {
    background-color: transparent;
    border-color: transparent;
}

.nav>li>a:hover, .nav>li>a:focus, .nav .open>a, .nav .open>a:hover, .nav .open>a:focus {
    background-color: transparent;
  }

/* #endregion */

/* Power Virtual Agent styles */
.pva-floating-style {
    position: fixed;
    bottom: 0px;
    right: 0px;
    margin-right: 16px;
    margin-bottom: 18px;
    z-index: 9999;
}

html[dir="rtl"] .pva-floating-style {
    position: fixed;
    bottom: 0px;
    left: 0px;
    margin-left: 16px;
    margin-bottom: 18px;
    z-index: 9999;
}

/*************************************************************************************************************************/
/* Welcome Page */

#home-why-connectfast-internet .img-icon, .icon {
    height: 4rem;
}

#WelcomeContactContainer .img-icon {
    height: 4rem;
}

.img-icon .icon-c1 {
    fill: var(--color1);
}

.img-icon .icon-c2 {
    fill: var(--color2);
}

.contentHead {
    color: var(--color1);
    font-weight: 500;
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.support-card {
    background-color: white;
    padding: 1rem;
    height: 28rem;
}

.support-card:hover {
    -webkit-box-shadow: 0 5px 10px rgba(175, 176, 176, 0.6);
	box-shadow: 0 5px 10px rgba(175, 176, 176, 0.6);
	-webkit-transform: translateY(-5px);
	-moz-transform: translateY(-5px);
	-ms-transform: translateY(-5px);
	-o-transform: translateY(-5px);
	transform: translateY(-5px);
}

/* Power Virtual Agent styles ends */

/* Spacing Classes */
.m-0 { margin: 0 !important }
.m-1 { margin: .25rem !important }
.m-2 { margin: .5rem !important }
.m-3 { margin: 1rem !important }
.m-4 { margin: 1.5rem !important }
.m-5 { margin: 3rem !important }
.m-auto { margin: auto !important }
.mx-0 { margin-right: 0 !important; margin-left: 0 !important }
.mx-1 { margin-right: .25rem !important; margin-left: .25rem !important }
.mx-2 { margin-right: .5rem !important; margin-left: .5rem !important }
.mx-3 { margin-right: 1rem !important; margin-left: 1rem !important }
.mx-4 { margin-right: 1.5rem !important; margin-left: 1.5rem !important }
.mx-5 { margin-right: 3rem !important; margin-left: 3rem !important }
.mx-auto { margin-right: auto !important; margin-left: auto !important }
.my-0 { margin-top: 0 !important; margin-bottom: 0 !important }
.my-1 { margin-top: .25rem !important; margin-bottom: .25rem !important }
.my-2 { margin-top: .5rem !important; margin-bottom: .5rem !important }
.my-3 { margin-top: 1rem !important; margin-bottom: 1rem !important }
.my-4 { margin-top: 1.5rem !important; margin-bottom: 1.5rem !important }
.my-5 { margin-top: 3rem !important; margin-bottom: 3rem !important }
.my-auto { margin-top: auto !important; margin-bottom: auto !important }
.mt-0 { margin-top: 0 !important }
.mt-1 { margin-top: .25rem !important }
.mt-2 { margin-top: .5rem !important }
.mt-3 { margin-top: 1rem !important }
.mt-4 { margin-top: 1.5rem !important }
.mt-5 { margin-top: 3rem !important }
.mt-auto { margin-top: auto !important}
.me-0 { margin-right: 0 !important}
.me-1 { margin-right: .25rem !important}
.me-2 { margin-right: .5rem !important}
.me-3 { margin-right: 1rem !important}
.me-4 { margin-right: 1.5rem !important}
.me-5 { margin-right: 3rem !important}
.me-auto { margin-right: auto !important}
.mb-0 { margin-bottom: 0 !important}
.mb-1 { margin-bottom: .25rem !important}
.mb-2 { margin-bottom: .5rem !important}
.mb-3 { margin-bottom: 1rem !important}
.mb-4 { margin-bottom: 1.5rem !important}
.mb-5 { margin-bottom: 3rem !important}
.mb-auto { margin-bottom: auto !important}
.ms-0 { margin-left: 0 !important}
.ms-1 { margin-left: .25rem !important}
.ms-2 { margin-left: .5rem !important}
.ms-3 { margin-left: 1rem !important}
.ms-4 { margin-left: 1.5rem !important}
.ms-5 { margin-left: 3rem !important}
.ms-auto { margin-left: auto !important}
.p-0 { padding: 0 !important}
.p-1 { padding: .25rem !important}
.p-2 { padding: .5rem !important}
.p-3 { padding: 1rem !important}
.p-4 { padding: 1.5rem !important}
.p-5 { padding: 3rem !important}
.p-6 { padding: 6rem !important}
.px-0 { padding-right: 0 !important;  padding-left: 0 !important}
.px-1 { padding-right: .25rem !important;  padding-left: .25rem !important}
.px-2 { padding-right: .5rem !important;  padding-left: .5rem !important}
.px-3 { padding-right: 1rem !important;  padding-left: 1rem !important}
.px-4 { padding-right: 1.5rem !important;  padding-left: 1.5rem !important}
.px-5 { padding-right: 3rem !important;  padding-left: 3rem !important}
.px-6 { padding-right: 6rem !important;  padding-left: 6rem !important}
.py-0 { padding-top: 0 !important;  padding-bottom: 0 !important}
.py-1 { padding-top: .25rem !important;  padding-bottom: .25rem !important}
.py-2 { padding-top: .5rem !important;  padding-bottom: .5rem !important}
.py-3 { padding-top: 1rem !important;  padding-bottom: 1rem !important}
.py-4 { padding-top: 1.5rem !important;  padding-bottom: 1.5rem !important}
.py-5 { padding-top: 3rem !important;  padding-bottom: 3rem !important}
.py-6 { padding-top: 6rem !important;  padding-bottom: 6rem !important}
.pt-0 { padding-top: 0 !important}
.pt-1 { padding-top: .25rem !important}
.pt-2 { padding-top: .5rem !important}
.pt-3 { padding-top: 1rem !important}
.pt-4 { padding-top: 1.5rem !important}
.pt-5 { padding-top: 3rem !important}
.pt-6 { padding-top: 6rem !important}
.pe-0 { padding-right: 0 !important}
.pe-1 { padding-right: .25rem !important}
.pe-2 { padding-right: .5rem !important}
.pe-3 { padding-right: 1rem !important}
.pe-4 { padding-right: 1.5rem !important}
.pe-5 { padding-right: 3rem !important}
.pe-6 { padding-right: 6rem !important}
.pb-0 { padding-bottom: 0 !important}
.pb-1 { padding-bottom: .25rem !important}
.pb-2 { padding-bottom: .5rem !important}
.pb-3 { padding-bottom: 1rem !important}
.pb-4 { padding-bottom: 1.5rem !important}
.pb-5 { padding-bottom: 3rem !important}
.pb-6 { padding-bottom: 6rem !important}
.ps-0 { padding-left: 0 !important}
.ps-1 { padding-left: .25rem !important}
.ps-2 { padding-left: .5rem !important }
.ps-3 { padding-left: 1rem !important }
.ps-4 { padding-left: 1.5rem !important }
.ps-5 { padding-left: 3rem !important }
.ps-6 { padding-left: 6rem !important}