/* EXAMPLE   var(--gray-100)   */
:root {
    --brand: #621B6A;
    --brand-dark: #3F0F40 ; 
    --brand-medium: #B08DB3 ; 
    --brand-light: #D7C5D9 ; 
    
    --brand-bright: #b43e8f;
    
    
    --primary: #007BFF ;
    --primary-100: #0069D9 ;
    --primary-150: #0062CC ; 
    
    --primary-light: #377DFF ;
    
    --success: #22B77B ; 
    --success-500: #3a9d5d ; 
    
    --warning: #FFBF11 ; 
    --warning-100: #f5b813 ; 
    
    --danger: #FF1963 ; 
    
    --blue-100: #E5F2FF ; 
    
    
    --black: #000000 ;
    --white: #FFFFFF ;

        --gray-50: #f4f4f4 ;
    --gray-100: #f0f3f5 ;
    --gray-200: #e8e8e8 ; 
    --gray-300: #CECECE ;
        --gray-350: #CED4DA ;     
    --gray-400: #adadad ;
    --gray-500: #8e8e8e ;
    --gray-600: #6C757D ; 
    --gray-700: #4C4C4C ;
    --gray-800: #313131 ;
    --gray-900: #2e2e2e ;
        --gray-950: #1f1f1f ;  

    
    --highlight: #FBFFCD ; 
    --disabled: #C2CFD6 ;
    }

    







/* Responsive Text Alignment Classes */
/*
To use, set the alignment that you would want for the smallest screen size with standard
class - such as text-left, then begin overrides at the size you would want overrides to begin 
at such as text-md-center
*/
 @media (min-width: 576px) {
    .text-sm-left { text-align: left !important; }
    .text-sm-right { text-align: right !important; }
    .text-sm-center { text-align: center !important; }
    .text-sm-justify { text-align: justify !important; }
    }
@media (min-width: 768px) {
    .text-md-left { text-align: left !important; }
    .text-md-right { text-align: right !important; }
    .text-md-center { text-align: center !important; }
    .text-md-justify { text-align: justify !important; }
    }
@media (min-width: 992px) {
    .text-lg-left { text-align: left !important; }
    .text-lg-right { text-align: right !important; }
    .text-lg-center { text-align: center !important; }
    .text-lg-justify { text-align: justify !important; }
    }
@media (min-width: 1200px) {
    .text-xl-left { text-align: left !important; }
    .text-xl-right { text-align: right !important; }
    .text-xl-center { text-align: center !important; }
    .text-xl-justify { text-align: justify !important; }
    }


/*Fixes z-index issue for animate.css node module*/
.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:none!important;animation-fill-mode:none!important}

/*Animations*/
.colorchange_background_new {
    -webkit-animation:colorchange_background_new 8s ;
    }
    @-webkit-keyframes colorchange_background_new {
        0% { background-color: #b7dcff; }
        100% { background-color: transparent; }
        }



/** Typography **/
h1, .h1 {
    font-family: 'Helvetica Neue','Source Sans Pro', Arial ;
    font-weight: 300; 
    font-size: 2.4rem; }

h2, .h2 {
    font-size: 1.75rem; }

h3, .h3 {
    font-size: 1.53125rem; }

h4, .h4 {
    font-size: 24px;
    font-weight: 200;
    }

h5, .h5 {
    font-size: 18px; 
    font-weight: 500 ; }

h6, .h6 {
    font-size: 0.875rem; }

.help-text {
    font-size: 12px ;
    line-height: 19px ; 
    font-weight: 500 ; 
    }

/* This Will Be Capitalized  */
.text-capitalize {
    text-transform: capitalize
    }

/* This will be in uppercase  */
.text-uppercase {
    text-transform: uppercase
    }

/* This will be in lowercase */
.text-lowercase {
    text-transform: lowercase
    }

.small-caps {
    font-variant: small-caps !important ;
    }


i.icon.essenty {
    color: #D7C5D9 
}
i.icon.essenty::before {
    font-style: normal ; 
    font-size: 120%; 
    line-height:1 ; 
    content: "e";    
    font-family: 'Righteous', cursive;
    }


/*Cursor Styles*/
.cursor-default {
    cursor: default; 
    }
.cursor-pointer {
    cursor: pointer; 
    }
.cursor-resize {
    cursor: n-resize; 
    }


/* Class version of small block element */
.small { 
    font-size: 80% !important; 
    }
.smaller { 
    font-size: 85% !important; 
    }

/* Borders & Border Colors */
.border-light {
    border-color: #C1C4C8 !important; 
    }
.border-transparent {
    border-color: transparent !important; 
    }

.text-underline { 
    text-decoration: underline !important ; 
    }
.text-underline-space { 
    display: inline-block;
    border-bottom: 2px solid;
    padding-bottom: 0;
    }

/*Font Weights*/
.font-weight-thin {
    font-weight: 100 ; 
    }
.font-weight-xlight {
    font-weight: 200 ; 
    }
.font-weight-light {
    font-weight: 300 ; 
    }
.font-weight-regular {
    font-weight: 400 ; 
    }
.font-weight-medium {
    font-weight: 500 ; 
    }
.font-weight-semibold {
    font-weight: 600 ; 
    }
.font-weight-bold {
    font-weight: 700 ; 
    }
.font-weight-xbold {
    font-weight: 800 ; 
    }
.font-weight-xheavy {
    font-weight: 900 ; 
    }



/*Text Colors*/
mark {
    background-color: var(--highlight) !important; 
    }

.text-high-bglight, .text-black {
    color: #000000 !important ;
    }

.text-dark-bglight {
    color: #2e2e2e !important ;
    }
a.text-dark-bglight:hover, a.text-dark-bglight:focus {
    color: #1f1f1f !important ;
    }

.text-medium-bglight {
    color: var(--gray-600) !important ;
    }
a.text-medium-bglight:hover, a.text-medium-bglight:focus {
    color: #4C4C4C !important ;
    }

.text-hint-bglight {
    color: #C1C4C8 !important ; 
    }
.text-medium-bgdark {
    color: #C4C4C4 !important ;
    }
.text-hint-bgdark {
    color: #4C4C4C !important ;
    }
.text-brand {
    color: #621B6A !important ; 
    }
.text-brand-dark {
    color: #3F0F40 !important ; 
    }
.text-brand-medium {
    color: #B08DB3 !important ; 
    }
.text-brand-light {
    color: #D7C5D9 !important ; 
    }

.text-brand-bright {
    color: var(--brand-bright) !important ;
    }

.text-transparent {
    color: transparent !important ; 
    }

a {
    color: #007BFF ; 
    }
a:hover, a:focus {
    color: #0069D9 ; 
    }
a:active {
    color: #0062CC ; 
    }

.text-primary, .blue-link {
    color: var(--primary) !important ; }

    a.text-primary:hover, a.text-primary:focus, a.blue-link:hover, a.blue-link:focus {
        color: #0069D9 !important ; 
        }
    a.text-primary:active, a.blue-link:active {
        color: #0062CC !important ; 
        }

.blue-link {
    cursor: pointer;
    text-decoration: underline ; 
    } 

.text-secondary {
  color: var(--gray-600) !important; }

    a.text-secondary:hover, a.text-secondary:focus {
        color: #5E666D !important; 
        }
    a.text-secondary:active {
        color: #444A4F !important; 
        }

.text-success {
  color: #22B77B !important; }

a.text-success:hover, a.text-success:focus {
  color: #3a9d5d !important; }

.text-warning {
  color: #FFBF11 !important; }

a.text-warning:hover, a.text-warning:focus {
  color: #f5b813 !important; }

.text-danger {
  color: #FF1963 !important; }

a.text-danger:hover, a.text-danger:focus {
  color: #E21457 !important; }

.text-info {
  color: #23A9D1 !important; }

a.text-info:hover, a.text-info:focus {
  color: #39b2d5 !important; }

.text-light {
  color: #F8F9FA !important; }

.text-medium {
  color: #77838F !important; }

a.text-light:hover, a.text-light:focus,
a.text-medium:hover, a.text-medium:focus {
  color: var(--gray-600) !important; }

.text-dark {
  color: #1D1D1D !important; }

a.text-dark:hover, a.text-dark:focus {
  color: #151b1f !important; }

.text-white {
  color: #FFFFFF !important; }

a.text-white:hover, a.text-white:focus {
  color: #f4f4f4 !important; }

.text-blue {
  color: #20a8d8 !important; }

a.text-blue:hover, a.text-blue:focus {
  color: #1985ac !important; }

.text-indigo {
  color: #6610f2 !important; }

a.text-indigo:hover, a.text-indigo:focus {
  color: #510bc4 !important; }

.text-purple {
  color: #6f42c1 !important; }

a.text-purple:hover, a.text-purple:focus {
  color: #59339d !important; }

.text-pink {
  color: #e83e8c !important; }

a.text-pink:hover, a.text-pink:focus {
  color: #d91a72 !important; }

.text-red {
  color: #f86c6b !important; }

a.text-red:hover, a.text-red:focus {
  color: #f63c3a !important; }

.text-orange {
  color: #f8cb00 !important; }

a.text-orange:hover, a.text-orange:focus {
  color: #c5a100 !important; }

.text-yellow {
  color: #ffc107 !important; }

a.text-yellow:hover, a.text-yellow:focus {
  color: #d39e00 !important; }

.text-green {
  color: #4dbd74 !important; }

a.text-green:hover, a.text-green:focus {
  color: #3a9d5d !important; }

.text-teal {
  color: #20c997 !important; }

a.text-teal:hover, a.text-teal:focus {
  color: #199d76 !important; }

.text-cyan {
  color: #63c2de !important; }

a.text-cyan:hover, a.text-cyan:focus {
  color: #39b2d5 !important; }


.text-gray-100 {
  color: var(--gray-100) !important; }

a.text-gray-100:hover, a.text-gray-100:focus {
  color: #d1dbe1 !important; }

.text-gray-200 {
  color: var(--gray-200) !important; }

a.text-gray-200:hover, a.text-gray-200:focus {
  color: #a4b7c2 !important; }

.text-gray-300 {
  color: var(--gray-300) !important; }

a.text-gray-300:hover, a.text-gray-300:focus {
  color: #869fac !important; }

.text-gray-400 {
  color: var(--gray-400) !important; }

a.text-gray-400:hover, a.text-gray-400:focus {
  color: #688797 !important; }

.text-gray-500 {
  color: var(--gray-500) !important; }

a.text-gray-500:hover, a.text-gray-500:focus {
  color: #526d7a !important; }

.text-gray-600 {
  color: var(--gray-600) !important; }

a.text-gray-600:hover, a.text-gray-600:focus {
  color: #3e515b !important; }

.text-gray-700 {
  color: var(--gray-700) !important; }

a.text-gray-700:hover, a.text-gray-700:focus {
  color: #29363d !important; }

.text-gray-800 {
  color: #29363d !important; }

a.text-gray-800:hover, a.text-gray-800:focus {
  color: #151b1f !important; }

.text-gray-900 {
  color: #151b1e !important; }

a.text-gray-900:hover, a.text-gray-900:focus {
  color: black !important; }

.text-muted {
  color: #536c79 !important; }



/* Background Colors*/

.bg-transparent {
    background-color: transparent !important ; 
    }

.bg-primary {
    background-color: var(--primary) !important ; 
    }

.bg-brand-primary {
    background-color: #621B6A !important ; 
    }

.bg-brand-dark {
    background-color: #3F0F40 !important ; 
    }
.bg-brand-medium {
    background-color: #B08DB3 !important ; 
    }
.bg-brand-light {
    background-color: #D7C5D9 !important ; 
    }
.bg-brand-xlight {
    background-color: #f2e6f4 !important ; 
    }


.bg-success {
    background-color: var(--success) !important ; 
    }


.bg-light {
    background-color: #F8F9FA !important ; 
    }

.bg-medium-light {
    background-color: #ededed !important ; 
    }

.bg-medium {
    background-color: var(--gray-600) !important ; 
    }

.bg-gray-200 {
    background-color: var(--gray-200) !important ; 
    }

.bg-disabled {
    background-color: var(--disabled) !important ; 
    }

.bg-warning {
    background-color: #FFBF11 !important ; 
    }
.bg-warning-light {
    background-color: #ffdd81 !important ; 
    }

.bg-danger {
  background-color: #FF1963 !important; }

a.bg-danger:hover, a.bg-danger:focus,
button.bg-danger:hover,
button.bg-danger:focus {
  background-color: #E21457 !important; }


/*Navigation*/
/*
a.nav-link {
    color: #536c79; }
*/


/* Response Square DIV */
.square {
  position: relative;
  width: 100%;
}

.square:after {
  content: "";
  display: block;
  padding-bottom: 100%;
}

.square-content {
  position: absolute;
  width: 100%;
  height: 100%;
}



.mh300 {
    min-height: 300px;
    }
.mh400 {
    min-height: 400px;
    }
.mh500 {
    min-height: 500px;
    }

/*Global Buttons*/
.btn-med {
    height: 47px;
    }
.btn-tall {
    height: 60px;
    }
.btn-mw25, .mw25 {
    min-width: 25px;
    }
.btn-mw35, .mw35 {
    min-width: 35px;
    }
.btn-mw45, .mw45 {
    min-width: 45px;
    }
.btn-mw25, .mw25 {
    min-width: 25px;
    }
.btn-mw50, .mw50 {
    min-width: 50px;
    }
.btn-mw100, .mw100 {
    min-width: 100px;
    }
.btn-mw150, .mw150 {
    min-width: 150px;
    }
.btn-mw180, .mw180 {
    min-width: 180px;
    }
.btn-mw200, .mw200 {
    min-width: 200px;
    }
.btn-mw230, .mw230 {
    min-width: 230px;
    }
.btn-mw300, .mw300 {
    min-width: 300px;
    }
.btn-mw400, .mw400 {
    min-width: 400px;
    }
.btn-mw500, .mw500 {
    min-width: 500px;
    }

.btn-mw100p, .mw100p {
    min-width: 100%;
    }


/*MAX WIDTH*/
.btn-mxw50, .mxw50 {
    max-width: 50px;
    }
.btn-mxw80, .mxw80 {
    max-width: 80px;
    }
.btn-mxw100, .mxw100 {
    max-width: 100px;
    }
.btn-mxw150, .mxw150 {
    max-width: 150px;
    }
.btn-mxw180, .mxw180 {
    max-width: 180px;
    }
.mxw200 {
    max-width: 200px;
    }
.mxw250 {
    max-width: 250px;
    }
.mxw290, .mxw290p {
    max-width: 290px;
    }
.mxw580, .mxw580p {
    max-width: 580px;
    }
.mxw600, .mxw600p {
    max-width: 600px;
    }
.mxw650, .mxw650p {
    max-width: 650px;
    }
.mxw750,.mxw750p {
    max-width: 750px;
    }
.mxw1000, .mxw1000p {
    max-width: 1000px;
    }



.btn-mxw40pct, .mxw40pct {
    max-width: 40%;
    }

.btn-mxw50pct, .mxw50pct {
    max-width: 50%;
    }

.btn-mxw80pct, .mxw80pct {
    max-width: 80%;
    }

.btn-mxw100pct, .mxw100pct {
    max-width: 100% !important ;
    }


.border-rounded-none {
    border-radius: 0 !important;    
    }

.border-rounded, 
.btn-rounded, .badge-rounded,
.btn-rounded-3, .badge-rounded-3 {
    border-radius: 2px;     
    }
.btn-rounded-left, .badge-rounded-left {
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;     
    }
.btn-rounded-right, .badge-rounded-right {
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;     
    }
.btn-rounded-4, .badge-rounded-4 {
    border-radius: 4px;     
    }
.border-rounded-6, .btn-rounded-6, .badge-rounded-6 {
    border-radius: 6px ;  
    }

.border-rounded-10, .btn-rounded-10, .badge-rounded-10 {
    border-radius: 10px;     
    }

/** Custom Button **/
.btn {
    font-weight: 500 ; 
    }

.btn-new {
/*    font-family: 'Helvetica Neue','Source Sans Pro' ; */
    font-size: 14px !important;
    line-height: 24px !important;
    border-radius: 23px;
    }


/** Button Overrides **/
.btn-brand {
  color: #fff;
  background-color: #621B6A;
  border-color: #621B6A; }
  .btn-brand:hover {
    color: #fff;
    background-color: #3F0F40;
    border-color: #3F0F40; }
  .btn-brand:focus, .btn-brand.focus {
    box-shadow: 0 0 0 0.2rem rgba(32, 168, 216, 0.5); }
  .btn-brand.disabled, .btn-brand:disabled {
    color: #fff;
    background-color: #4C4C4C;
    border-color: #4C4C4C; }
  .btn-brand:not(:disabled):not(.disabled):active, .btn-brand:not(:disabled):not(.disabled).active,
  .show > .btn-brand.dropdown-toggle {
    color: #fff;
    background-color: #a22faf;
    border-color: #621B6A; }
    .btn-brand:not(:disabled):not(.disabled):active:focus, .btn-brand:not(:disabled):not(.disabled).active:focus,
    .show > .btn-brand.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem rgba(32, 168, 216, 0.5); }

.btn-brand-light {
  color: #621B6A;
  background-color: #F2F2F2;
  border-color: #F2F2F2; }
  .btn-brand-light:hover {
    color: #621B6A;
    background-color: #e8e8e8;
    border-color: #e8e8e8; }
  .btn-brand-light:focus, .btn-brand-light.focus {
    box-shadow: 0 0 0 0.2rem rgba(32, 168, 216, 0.5); }
  .btn-brand-light.disabled, .btn-brand-light:disabled {
    color: #fff;
    background-color: #4C4C4C;
    border-color: #4C4C4C; }
  .btn-brand-light:not(:disabled):not(.disabled):active, .btn-brand-light:not(:disabled):not(.disabled).active,
  .show > .btn-brand-light.dropdown-toggle {
    color: #fff;
    background-color: #621B6A;
    border-color: #621B6A; }
    .btn-brand-light:not(:disabled):not(.disabled):active:focus, .btn-brand-light:not(:disabled):not(.disabled).active:focus,
    .show > .btn-brand-light.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem rgba(32, 168, 216, 0.5); }


.btn-brand-light-inverse {
  color: #FFFFFF;
  background-color: #D7C5D9;
  border-color: #D7C5D9; }
  .btn-brand-light-inverse:hover {
    color: #621B6A;
    background-color: #e8e8e8;
    border-color: #e8e8e8; }
  .btn-brand-light-inverse:focus, .btn-brand-light-inverse.focus {
    box-shadow: 0 0 0 0.2rem rgba(32, 168, 216, 0.5); }
  .btn-brand-light-inverse.disabled, .btn-brand-light-inverse:disabled {
    color: #fff;
    background-color: #4C4C4C;
    border-color: #4C4C4C; }
  .btn-brand-light-inverse:not(:disabled):not(.disabled):active, .btn-brand-light-inverse:not(:disabled):not(.disabled).active,
  .show > .btn-brand-light-inverse.dropdown-toggle {
    color: #fff;
    background-color: #621B6A;
    border-color: #621B6A; }
    .btn-brand-light-inverse:not(:disabled):not(.disabled):active:focus, .btn-brand-light-inverse:not(:disabled):not(.disabled).active:focus,
    .show > .btn-brand-light-inverse.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem rgba(32, 168, 216, 0.5); }

.btn-brand-light-inverse-dark {
  color: #3F0F40;
  background-color: #D7C5D9;
  border-color: #D7C5D9; }
  .btn-brand-light-inverse-dark:hover {
    color: #621B6A;
    background-color: #e8e8e8;
    border-color: #e8e8e8; }
  .btn-brand-light-inverse-dark:focus, .btn-brand-light-inverse-dark.focus {
    box-shadow: 0 0 0 0.2rem rgba(32, 168, 216, 0.5); }
  .btn-brand-light-inverse-dark.disabled, .btn-brand-light-inverse-dark:disabled {
    color: #fff;
    background-color: #4C4C4C;
    border-color: #4C4C4C; }
  .btn-brand-light-inverse-dark:not(:disabled):not(.disabled):active, .btn-brand-light-inverse-dark:not(:disabled):not(.disabled).active,
  .show > .btn-brand-light-inverse-dark.dropdown-toggle {
    color: #fff;
    background-color: #621B6A;
    border-color: #621B6A; }
    .btn-brand-light-inverse-dark:not(:disabled):not(.disabled):active:focus, .btn-brand-light-inverse-dark:not(:disabled):not(.disabled).active:focus,
    .show > .btn-brand-light-inverse-dark.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem rgba(32, 168, 216, 0.5); }


.btn-pricing-light {
  color: #77838F;
  font-weight: 400 ; 
  background-color: #F2F2F2;
  border-color: #F2F2F2; }
/*
  .btn-light:hover {
    color: #621B6A;
    background-color: #e8e8e8;
    border-color: #e8e8e8; }
  .btn-light:focus, .btn-light.focus {
    box-shadow: 0 0 0 0.2rem rgba(240, 243, 245, 0.5); }
  .btn-light.disabled, .btn-light:disabled {
    color: #151b1e;
    background-color: var(--gray-100);
    border-color: var(--gray-100); }
  .btn-light:not(:disabled):not(.disabled):active, .btn-light:not(:disabled):not(.disabled).active,
  .show > .btn-light.dropdown-toggle {
    color: #151b1e;
    background-color: #d1dbe1;
    border-color: #cad4dc; }
    .btn-light:not(:disabled):not(.disabled):active:focus, .btn-light:not(:disabled):not(.disabled).active:focus,
    .show > .btn-light.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem rgba(240, 243, 245, 0.5); }
.btn-light.active {
  color: #621B6A;
    font-weight: 700 ; 
  background-color: #FFFFFF;
  border-color: #FFFFFF;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25) !important ;
    z-index: 10 !important;
    }
*/

.btn-primary {
  color: var(--white) ;
  background-color: var(--primary) ;
  border-color: var(--primary) ; }
  .btn-primary:hover {
    color: var(--white) ;
    background-color: var(--primary-100) ;
    border-color: var(--primary-100) ; }
  .btn-primary:focus, .btn-primary.focus {
    box-shadow: 0 0 0 0.2rem rgba(32, 168, 216, 0.5); }
  .btn-primary.disabled, .btn-primary:disabled {
    color: var(--white) ;
    background-color: var(--primary-150) ;
    border-color: var(--primary-150) ; }
  .btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active,
  .show > .btn-primary.dropdown-toggle {
    color: var(--white) ;
    background-color: var(--primary-150) ;
    border-color: var(--primary-150) ; }
    .btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus,
    .show > .btn-primary.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem rgba(32, 168, 216, 0.5); }


.btn-outline-primary {
  color: var(--primary) ;
  background-color: transparent;
  background-image: none;
  border-color: var(--primary) ; 
  font-weight: 500; 
  }
  .btn-outline-primary:hover {
    color: #fff;
    background-color: var(--primary-100) ;
    border-color: var(--primary-100) ; }
  .btn-outline-primary:focus, .btn-outline-primary.focus {
    box-shadow: 0 0 0 0.2rem rgba(32, 168, 216, 0.5); }
  .btn-outline-primary.disabled, .btn-outline-primary:disabled {
    color: var(--primary-150) ;
    background-color: transparent; }
  .btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active,
  .show > .btn-outline-primary.dropdown-toggle {
    color: #fff;
    background-color: var(--primary-150) ;
    border-color: var(--primary-150) ; }
    .btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus,
    .show > .btn-outline-primary.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem rgba(32, 168, 216, 0.5); }



.btn-light {
  color: var(--gray-600);
  background-color: var(--gray-100);
  border-color: var(--gray-300); 
  font-weight: 500; }
  .btn-light:hover {
    color: var(--brand);
    background-color: var(--gray-300);
    border-color: var(--gray-300); }
  .btn-light:focus, .btn-light.focus {
    box-shadow: 0 0 0 0.2rem rgba(240, 243, 245, 0.5); }
  .btn-light.disabled, .btn-light:disabled {
    color: #151b1e;
    background-color: var(--gray-100);
    border-color: var(--gray-100); }
  .btn-light:not(:disabled):not(.disabled):active, .btn-light:not(:disabled):not(.disabled).active,
  .show > .btn-light.dropdown-toggle {
    color: #3F0F40;
    background-color: #DAE0E5;
    border-color: var(--gray-300); }
    .btn-light:not(:disabled):not(.disabled):active:focus, .btn-light:not(:disabled):not(.disabled).active:focus,
    .show > .btn-light.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem rgba(240, 243, 245, 0.5); }


.btn-outline-light {
  color: var(--gray-600);
  background-color: transparent;
  background-image: none;
  border-color: var(--gray-350); 
  font-weight: 500; 
  }
  .btn-outline-light:hover {
    color: var(--gray-600);
    background-color: var(--gray-350);
    border-color: var(--gray-350); }
  .btn-outline-light:focus, .btn-outline-light.focus {
    box-shadow: 0 0 0 0.2rem rgba(240, 243, 245, 0.5); 
    }
  .btn-outline-light.disabled, .btn-outline-light:disabled {
    color: #151b1e;
    background-color: var(--gray-100);
    border-color: var(--gray-100); }
  .btn-outline-light:not(:disabled):not(.disabled):active, .btn-outline-light:not(:disabled):not(.disabled).active,
  .show > .btn-outline-light.dropdown-toggle {
    color: #3F0F40;
    background-color: #DAE0E5;
    border-color: var(--gray-600); }
    .btn-outline-light:not(:disabled):not(.disabled):active:focus, .btn-outline-light:not(:disabled):not(.disabled).active:focus,
    .show > .btn-outline-light.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem rgba(240, 243, 245, 0.5); }




.btn-secondary {
  color: var(--white);
  background-color: var(--gray-600);
  border-color: var(--gray-600) ; }
  .btn-secondary:hover {
    color: #fff;
    background-color: var(--gray-700);
    border-color: var(--gray-700) ; }
  .btn-secondary:focus, .btn-secondary.focus {
    box-shadow: 0 0 0 0.2rem rgba(163, 163, 163, 0.5); }
  .btn-secondary.disabled, .btn-secondary:disabled {
    color: var(--gray-200) ;
    background-color: var(--gray-400);
    border-color: var(--gray-400); }
  .btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active,
  .show > .btn-secondary.dropdown-toggle {
    color: var(--white);
    background-color: var(--gray-600);
    border-color: var(--gray-600); }
    .btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus,
    .show > .btn-secondary.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem rgba(163, 163, 163, 0.5); }



.btn-outline-secondary {
  color: var(--gray-600);
  background-color: transparent;
  background-image: none;
  border-color: var(--gray-600); 
  font-weight: 500; 
  }
  .btn-outline-secondary:hover {
    color: #FFFFFF;
    background-color: var(--gray-600);
    border-color: var(--gray-600); }
  .btn-outline-secondary:focus, .btn-outline-secondary.focus {
    box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5); }
  .btn-outline-secondary.disabled, .btn-outline-secondary:disabled {
    color: var(--gray-600);
    background-color: transparent; }
  .btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active,
  .show > .btn-outline-secondary.dropdown-toggle {
    color: #FFFFFF;
    background-color: var(--gray-600);
    border-color: var(--gray-600); }
    .btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .btn-outline-secondary:not(:disabled):not(.disabled).active:focus,
    .show > .btn-outline-secondary.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5); }


.btn-transparent-secondary {
  color: var(--gray-600);
  background-color: transparent;
  border-color: transparent; 
  font-weight: 500; }
  .btn-transparent-secondary:hover {
    color: #000000;
    background-color: var(--gray-600);
    border-color: var(--gray-600); }
  .btn-transparent-secondary:focus, .btn-transparent-secondary.focus {
    box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5); }
  .btn-transparent-secondary.disabled, .btn-transparent-secondary:disabled {
    color: var(--gray-600);
    background-color: transparent;
    border-color: transparent; }
  .btn-transparent-secondary:not(:disabled):not(.disabled):active, .btn-transparent-secondary:not(:disabled):not(.disabled).active,
  .show > .btn-transparent-secondary.dropdown-toggle {
    color: #000000;
    background-color: transparent;
    border-color: transparent; }
    .btn-transparent-secondary:not(:disabled):not(.disabled):active:focus, .btn-transparent-secondary:not(:disabled):not(.disabled).active:focus,
    .show > .btn-transparent-secondary.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5); }

.btn-outline-link {
  color: var(--primary);
  background-color: transparent;
  background-image: none;
  border-color: var(--gray-350); 
  font-weight: 500; 
  }
  .btn-outline-link:hover {
    color: #0069D9;
    background-color: transparent;
    border-color: var(--gray-200); 
    text-decoration: underline ;}
  .btn-outline-link:focus, .btn-outline-link.focus {
    box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5); }
  .btn-outline-link.disabled, .btn-outline-link:disabled {
    color: #0062CC;
    background-color: transparent; }
  .btn-outline-link:not(:disabled):not(.disabled):active, .btn-outline-link:not(:disabled):not(.disabled).active,
  .show > .btn-outline-link.dropdown-toggle {
    color: #FFFFFF;
    background-color: transparent;
    border-color: var(--gray-200); 
    text-decoration: underline ;}
    .btn-outline-link:not(:disabled):not(.disabled):active:focus, .btn-outline-link:not(:disabled):not(.disabled).active:focus,
    .show > .btn-outline-link.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5); }


.btn-link {
  font-weight: 400;
  color: #007BFF;
  background-color: transparent; }
  .btn-link:hover {
    color: #0069D9;
    text-decoration: underline;
    background-color: transparent;
    border-color: transparent; }
  .btn-link:focus, .btn-link.focus {
    text-decoration: underline;
    border-color: transparent;
    box-shadow: none; }
  .btn-link:disabled, .btn-link.disabled {
    color: #0062CC; }

.btn-link-white {
  font-weight: 400;
  color: #ffffff;
  background-color: transparent; }
  .btn-link-white:hover {
    color: #f0f0f0;
    text-decoration: underline;
    background-color: transparent;
    border-color: transparent; }
  .btn-link-white:focus, .btn-link-white.focus {
    text-decoration: underline;
    border-color: transparent;
    box-shadow: none; }
  .btn-link-white:disabled, .btn-link-white.disabled {
    color: #0062CC; }

.btn-link-secondary {
  font-weight: 400;
  color: var(--gray-600) !important ;
  background-color: transparent; }
  .btn-link-secondary:hover {
    color: #000000;
    text-decoration: none;
    background-color: transparent;
    border-color: transparent; }
  .btn-link-secondary:focus, .btn-link.focus {
    text-decoration: none;
    border-color: transparent;
    box-shadow: none; }
  .btn-link-secondary:disabled, .btn-link.disabled {
    color: var(--gray-600); }


.btn-link-black {
  font-weight: 400;
  color: #000000;
  background-color: transparent; }
  .btn-link-black:hover {
    color: #000000;
    text-decoration: none;
    background-color: transparent;
    border-color: transparent; }
  .btn-link-black:focus, .btn-link-black.focus {
    text-decoration: none;
    border-color: transparent;
    box-shadow: none; }
  .btn-link-black:disabled, .btn-link.disabled {
    color: #000000; }


.btn-success {
    color: #fff;
    background-color: #22B77B;
    border-color: #22B77B; 
    }

    .btn-success:hover {
        color: #fff;
        background-color: #1C9967;
        border-color: #1C9967; }
    .btn-success:focus, .btn-success.focus {
        box-shadow: 0 0 0 0.2rem rgba(77, 189, 116, 0.5); }
    .btn-success.disabled, .btn-success:disabled {
        color: #fff;
        background-color: #4dbd74;
        border-color: #4dbd74; }
    .btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active,
    .show > .btn-success.dropdown-toggle {
        color: #fff;
        background-color: #167B53;
        border-color: #167B53; }
    .btn-success:not(:disabled):not(.disabled):active:focus, .btn-success:not(:disabled):not(.disabled).active:focus,
    .show > .btn-success.dropdown-toggle:focus {
        box-shadow: 0 0 0 0.2rem rgba(77, 189, 116, 0.5); }

.btn-outline-success {
    color: #22B77B;
    border-color: #22B77B; 
    }
    .btn-outline-success:hover {
        color: #fff;
        background-color: #1C9967;
        border-color: #1C9967; }
    .btn-outline-success:focus, .btn-outline-success.focus {
        box-shadow: 0 0 0 0.2rem rgba(77, 189, 116, 0.5); }
    .btn-outline-success.disabled, .btn-outline-success:disabled {
        color: #4dbd74;
        }
    .btn-outline-success:not(:disabled):not(.disabled):active, .btn-outline-success:not(:disabled):not(.disabled).active,
    .show > .btn-outline-success.dropdown-toggle {
        color: #fff;
        background-color: #167B53;
        border-color: #167B53; }
    .btn-outline-success:not(:disabled):not(.disabled):active:focus, .btn-outline-success:not(:disabled):not(.disabled).active:focus,
    .show > .btn-outline-success.dropdown-toggle:focus {
        box-shadow: 0 0 0 0.2rem rgba(77, 189, 116, 0.5); }


.btn-warning {
  color: #FFFFFF;
  background-color: #FFBF11;
  border-color: #FFBF11; }
  .btn-warning:hover {
    color: #FFFFFF;
    background-color: rgb(245, 184, 19);
    border-color: #f5b813; }
  .btn-warning:focus, .btn-warning.focus {
    box-shadow: 0 0 0 0.2rem rgba(245, 184, 19, 0.5); }
  .btn-warning.disabled, .btn-warning:disabled {
    color: #FFFFFF;
    background-color: #d3a016;
    border-color: #d3a016; }
  .btn-warning:not(:disabled):not(.disabled):active, .btn-warning:not(:disabled):not(.disabled).active,
  .show > .btn-warning.dropdown-toggle {
    color: #FFFFFF;
    background-color: #ffc936;
    border-color: rgb(255, 201, 54); }
    .btn-warning:not(:disabled):not(.disabled):active:focus, .btn-warning:not(:disabled):not(.disabled).active:focus,
    .show > .btn-warning.dropdown-toggle:focus {
      color: #FFFFFF;
      box-shadow: 0 0 0 0.2rem rgba(255, 201, 54, 0.5); }


.btn-danger {
  color: #fff;
  background-color: #FF1963;
  border-color: #FF1963; }
  .btn-danger:hover {
    color: #fff;
    background-color: #E21457;
    border-color: #E21457; }
  .btn-danger:focus, .btn-danger.focus {
    box-shadow: 0 0 0 0.2rem rgba(248, 108, 107, 0.5); }
  .btn-danger.disabled, .btn-danger:disabled {
    color: #fff;
    background-color: #CB154F;
    border-color: #CB154F; }
  .btn-danger:not(:disabled):not(.disabled):active, .btn-danger:not(:disabled):not(.disabled).active,
  .show > .btn-danger.dropdown-toggle {
    color: #fff;
    background-color: #CB154F;
    border-color: #CB154F; }
    .btn-danger:not(:disabled):not(.disabled):active:focus, .btn-danger:not(:disabled):not(.disabled).active:focus,
    .show > .btn-danger.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem rgba(248, 108, 107, 0.5); }


.btn-outline-danger {
  color: #FF1963;
  background-color: transparent;
  background-image: none;
  border-color: #FF1963; }
  .btn-outline-danger:hover {
    color: #fff;
    background-color: #FF1963;
    border-color: #FF1963; }
  .btn-outline-danger:focus, .btn-outline-danger.focus {
    box-shadow: 231 232 237 0.2rem rgba(231, 232, 237, 0.5); }
  .btn-outline-danger.disabled, .btn-outline-danger:disabled {
    color: #FF1963;
    background-color: transparent; }
  .btn-outline-danger:not(:disabled):not(.disabled):active, .btn-outline-danger:not(:disabled):not(.disabled).active,
  .show > .btn-outline-danger.dropdown-toggle {
    color: #fff;
    background-color: #CB154F;
    border-color: #CB154F; }
    .btn-outline-danger:not(:disabled):not(.disabled):active:focus, .btn-outline-danger:not(:disabled):not(.disabled).active:focus,
    .show > .btn-outline-danger.dropdown-toggle:focus {
      box-shadow: 231 232 237 0.2rem rgba(231, 232, 237, 0.5); }




.btn-transparent-light {
  color: #000000;
  background-color: #F8F9FA;
  border-color: #F8F9FA; 
  font-weight: 500; }
  .btn-transparent-light:hover {
    color: #621B6A;
    background-color: #F8F9FA;
    border-color: #F8F9FA; }
  .btn-transparent-light:focus, .btn-transparent-light.focus {
    color: #621B6A;
    box-shadow: 0 0 0 0.2rem rgba(240, 243, 245, 0.5); 
    }
  .btn-transparent-light.disabled, .btn-transparent-light:disabled {
    background-color: var(--gray-100);
    border-color: var(--gray-100); }
  .btn-transparent-light:not(:disabled):not(.disabled):active, .btn-transparent-light:not(:disabled):not(.disabled).active,
  .show > .btn-transparent-light.dropdown-toggle {
    color: #621B6A;
    background-color: #F8F9FA;
    border-color: #F8F9FA; }
    .btn-transparent-light:not(:disabled):not(.disabled):active:focus, .btn-transparent-light:not(:disabled):not(.disabled).active:focus,
    .show > .btn-transparent-light.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem rgba(240, 243, 245, 0.5); }



.btn-white {
  color: var(--gray-600);
  background-color: transparent;
  border-color: transparent; 
  font-weight: 500; }
  .btn-white:hover {
    color: #1D1D1D;
    background-color: #F8F9FA;
    border-color: #F8F9FA; }
  .btn-white:focus, .btn-white.focus {
    color: #23A9D1;
    background-color: #F8F9FA;
    border-color: #F8F9FA;
    box-shadow: 0 0 0 0.2rem rgba(240, 243, 245, 0.5); }
  .btn-white.disabled, .btn-white:disabled {
    color: #23A9D1;
    background-color: #F8F9FA;
    border-color: #F8F9FA; }
  .btn-white:not(:disabled):not(.disabled):active, .btn-white:not(:disabled):not(.disabled).active,
  .show > .btn-white.dropdown-toggle {
    color: #23A9D1;
    background-color: #F8F9FA;
    border-color: #F8F9FA; }
    .btn-white:not(:disabled):not(.disabled):active:focus, .btn-white:not(:disabled):not(.disabled).active:focus,
    .show > .btn-white.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem rgba(240, 243, 245, 0.5); }


.btn-transparent-white {
  color: #FFFFFF;
  background-color: transparent;
  border-color: transparent; 
  font-weight: 500; }
  .btn-transparent-white:hover {
    color: #FFFFFF;
    background-color: transparent;
    border-color: #FFFFFF; }
  .btn-transparent-white:focus, .btn-transparent-white.focus {
    box-shadow: 0 0 0 0.2rem rgba(240, 243, 245, 0.5); }
  .btn-transparent-white.disabled, .btn-transparent-white:disabled {
    color: #151b1e;
    background-color: var(--gray-100);
    border-color: var(--gray-100); }
  .btn-transparent-white:not(:disabled):not(.disabled):active, .btn-transparent-white:not(:disabled):not(.disabled).active,
  .show > .btn-transparent-white.dropdown-toggle {
    color: #151b1e;
    background-color: #d1dbe1;
    border-color: #cad4dc; }
    .btn-transparent-white:not(:disabled):not(.disabled):active:focus, .btn-transparent-white:not(:disabled):not(.disabled).active:focus,
    .show > .btn-transparent-white.dropdown-toggle:focus {
      box-shadow: 0 0 0 0.2rem rgba(240, 243, 245, 0.5); }


.btn-outline-white {
    color: var(--white);
    border-color: var(--white); 
    background-color: transparent; 
    }
    .btn-outline-white:hover {
        color: var(--brand);
        background-color: var(--white);
        border-color: var(--white); }
    .btn-outline-white:focus, .btn-outline-white.focus {
        box-shadow: 0 0 0 0.2rem rgba(77, 189, 116, 0.5); }
    .btn-outline-white.disabled, .btn-outline-white:disabled {
        color: #d0d0d0;
        }
    .btn-outline-white:not(:disabled):not(.disabled):active, .btn-outline-white:not(:disabled):not(.disabled).active,
    .show > .btn-outline-white.dropdown-toggle {
        color: #fff;
        background-color: #f0f0f0;
        border-color: #f0f0f0; }
    .btn-outline-white:not(:disabled):not(.disabled):active:focus, .btn-outline-white:not(:disabled):not(.disabled).active:focus,
    .show > .btn-outline-white.dropdown-toggle:focus {
        box-shadow: 0 0 0 0.2rem rgba(77, 189, 116, 0.5); }


/*Circle Button Styles*/
.btn-circle {
  width: 45px;
  height: 45px;
  line-height: 45px;
  text-align: center;
  padding: 0;
  border-radius: 50%;
}

.btn-circle i {
  position: relative;
  top: -1px;
}

.btn-circle-sm {
  width: 35px;
  height: 35px;
  line-height: 35px;
  font-size: 0.9rem;
}

.btn-circle-lg {
  width: 55px;
  height: 55px;
  line-height: 55px;
  font-size: 1.1rem;
}

.btn-circle-xl {
  width: 70px;
  height: 70px;
  line-height: 70px;
  font-size: 1.3rem;
}
.btn-circle-xxl {
  width: 200px;
  height: 200px;
  line-height: 200px;
  font-size: 1.3rem;
}



/* Custom form & input styles */
.input-group-text {
    padding: 0 0 0 0 ;
/*    border: none ; */
    }

/* Honeypot form class */   
.form-sugar {
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    height: 0;
    width: 0;
    z-index: -1;
}

input[type=text].form-input-line {
    color: #1D1D1D ; 
    border-left: none !important; 
    border-top: none !important; 
    border-right: none !important; 
    border-bottom: 1px solid #dddddd !important ;    
    }
.form-borderless {
    margin-left: 0px !important ; 
    color: #1D1D1D ;
    border: 1px solid transparent !important ;
    outline: none ;
    }
    .form-borderless:hover, .form-borderless:active, .form-borderless:focus {
        color: #1D1D1D ;
        -webkit-box-shadow: none !important;  
        -moz-box-shadow: none !important;  
        box-shadow: none !important;  
        }
    .form-borderless.form-underline:hover, .form-borderless.form-underline:active, .form-borderless.form-underline:focus {
        border-bottom: 1px solid #C7C7C7 !important ; 
        }

.form-tall {
    height: 60px;
    }

.input-group-prepend .input-group-text-transparent {
    border-right: 1px solid transparent !important; 
    }
.form-control-transparent-x {
    border-left: 1px solid transparent !important; 
    border-right: 1px solid transparent !important; 
    }
.form-control-transparent-top {
    border-top: 1px solid transparent !important; 
    border-top-left-radius: 0px; 
    border-top-right-radius: 0px; 
    }
.form-control-transparent-bottom {
    border-bottom: 1px solid transparent !important; 
    border-bottom-left-radius: 0px; 
    border-bottom-right-radius: 0px; 
    }
.form-control-transparent-left {
    border-left: 1px solid transparent !important; 
    border-top-left-radius: 0px; 
    border-bottom-left-radius: 0px; 
    }
.form-control-transparent-right {
    border-right: 1px solid transparent !important; 
    border-top-right-radius: 0px; 
    border-bottom-right-radius: 0px; 
    }
.input-group-text-transparent {
    background-color: transparent !important ; 
    }

.input-group-append.disabled, .input-group-prepend.disabled {
    background-color: var(--gray-200);
    opacity: 1;
    }


/*Tables*/
/*Trick came from https://stackoverflow.com/questions/509711/why-does-overflowhidden-not-work-in-a-td to 
handle long content in a cell and ensure it doesn't push the table below the filter '*/
/*
td.table-cell-list-field {
    padding-top: 1rem !important;
    padding-left:    
    
    }
*/

span.table-cell-no-overflow,  div.table-cell-no-overflow {
    display:inline-block;
    white-space: nowrap;
    position:relative; /* must be relative */
    width:100%; /* fit to table cell width */
    margin-right:-1000px; /* technically this is a less than zero width object */
    overflow:hidden;   
    }
.wrap-normal {
    white-space: normal ; 
    }

.horizontal-scroll {
    overflow-x: scroll ;
    }


/*Badges Colors*/
.badge-primary {
    background-color: var(--primary) ; 
    }
.badge-outline-primary {
    background-color: transparent ;
    color: var(--primary) ; 
    border: 1px solid var(--primary) ; 
    }
.badge-danger {
    background-color: #FF1963; 
    }
.badge-danger[href]:hover, .badge-danger[href]:focus {
    background-color: #E21457; 
    }
.badge-light {
    color: var(--gray-600); 
    background-color: var(--gray-100); 
    }





/*Assets*/



/*Media embed styles moved to global_custom*/
.asset-container div.media-embed {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; 
    margin-bottom: 30px; 
    height: 0; 
    overflow: hidden;
    }

.asset-container .media-embed iframe,
.asset-container .media-embed object,
.asset-container .media-embed embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    }

/* Prevents long words from going outside of box */
.asset-sms-conversation {
    /* These are technically the same, but use both */
      overflow-wrap: break-word;
      word-wrap: break-word;

      -ms-word-break: break-all;
      /* This is the dangerous one in WebKit, as it breaks things wherever */
    /*      word-break: break-all;*/
      /* Instead use this non-standard one: */
      word-break: break-word;

      /* Adds a hyphen where the word breaks, if supported (No Blink) */
      -ms-hyphens: auto;
      -moz-hyphens: auto;
      -webkit-hyphens: auto;
      hyphens: auto;
    }
.asset-sms-conversation.outgoing {
    text-align: left; 
    }
.asset-sms-conversation a {
    color: var(--white) !important ;
    font-weight: bold; 
    text-decoration: underline ; 
    }