/*Old colors*/
/*#E55C3E; - Orange */
/*#E24928; - Orange Border Color*/
/*#D43D1C; - Orange Hover */
/*#B43418; - Orange Hover Border Color*/
/*#CCCCCC; - Grey */
/*#D0D0D0; - Grey Border Color*/
/*#A0A0A0; - Grey Hover */
/*#9A9A9A; - Grey Hover Border Color*/
/*#2EDAB8; - Green*/
/*#2ED6B4; - Green Border Color*/
/*#22A086; - Green Hover */
/*#209A82; - Green Hover Border Color*/
/*New colors*/

:root {
    --maisie-blue: #2e3192;
    --maisie-green: #0F9D58;
    --maisie-yellow: #F4B400;
    /*#2ED6B4; - Blue Border Color*/
    /*#22A086; - Blue Hover */
    /*#209A82; - Blue Hover Border Color*/
    --maisie-red: #FE4A49; /*#22A086; - Blue Hover */
    --maisie-red-hover: #FE4A49;
    --maisie-black: #161616;
    /*#ffffff; - Black Border Color*/
    /*#ffffff; - Black Hover */
    /*#ffffff; - Black Hover Border Color*/
    --maisie-dark-grey: #414141;
    --maisie-violet: #4c1bdf;
    /*#ffffff; - DarkGrey Border Color*/
    /*#ffffff; - DarkGrey Hover */
    /*#ffffff; - DarkGrey Hover Border Color*/
    --maisie-light-grey: #e5e5e5;
    --maisie-grey: #cccccc;
    --maisie-light-blue: #9fbdbb;
    --maisie--form-background: #E5E7EA;
    --maisie--form-background-white: white;
    /*#ffffff; - LightGrey Border Color*/
    /*#ffffff; - LightGrey Hover */
    /*#ffffff; - LightGrey Hover Border Color*/
}

/* Removed problematic global font-weight rule - use specific selectors instead */
body {
  font-weight: 400;
  font-family: 'IBM Plex Sans', 'Helvetica Neue', Arial, sans-serif;
}

body {
  color: var(--maisie-black);
  background: var(--maisie--form-background);
  min-height: 100vh;
}

.mini-sidebar .top-navbar .navbar-header {
  width: 150px;
}

.form-control, p {
  color: var(--maisie-dark-grey);
}

body .card-block {
  padding: 2rem;
}

.card.dashboard-card{
  height: 100%;
}

.card.dashboard-card >.card-block{
  height: 100%;
}

.left-dashboard-col, .right-dashboard-col{
  margin-bottom: 10px;
}

.left-dashboard-col {
    margin-right: 10px;
}

.statistic_wrapper__audience {
  margin-top: 20px;
  display: flex;
  justify-content: space-between;
}

.statistic__block__audience {
  text-align: center;
  width: 25%;
  margin-right: 20px;
  border-radius: 5px;
  padding: 15px;
  color: #fff;
  background: #5301bb;
}

.statistic__value__audience {
  font-size: 25px;
}

right-dashboard-col {
    margin-left: 10px;
}

h1.text-themecolor, h2.text-themecolor, h3.text-themecolor,
h4.text-themecolor, h5.text-themecolor, h6.text-themecolor {
  color: var(--maisie-black) !important;
}

small.text-themecolor {
  color: var(--maisie-violet) !important;
}

body a {
  color: var(--maisie-violet);
}

body a:hover, a:visited, a:active {
    color: var(--maisie-violet);
}

.mini-sidebar .sidebar-nav #sidebarnav > li:hover > a, .mini-sidebar .sidebar-nav #sidebarnav > li.active > a {
  background: var(--maisie-blue);
  border-color: var(--maisie-blue);
}

h1, h3, h4, h5, h6 {
  font-weight: 700 !important;
  color: var(--maisie-black);
}

h2 {
  font-weight: 500 !important;
  color: var(--maisie-black);
}

h1.heading, h2.heading, h3.heading, h4.heading, h5.heading, h6.heading {
  font-weight: 700 !important;
  font-family: "Domine", serif;
}

h1.sub-heading, h2.sub-heading, h3.sub-heading, h4.sub-heading, h5.sub-heading, h6.sub-heading {
  font-weight: 300 !important;
}

.card.dashboard-card {
  margin-bottom: 10px;
}

.filter-containers {
  display: inline-block;
}

.statistics-table {
  margin-left: 10px;
  border-spacing: 5px 0px;
  border-collapse: separate;
}

.statistics-table th {
   padding: 0 12px 0 6px;
}

.statistics-table td {
  padding: 0 12px 0 6px;
  text-align: left;
}

.statistics-table tr td:not(:last-child),
.statistics-table tr th:not(:last-child) {
  border-right: 1px solid lightgrey;
  padding-right: 5px;
}

@media (min-width: 768px) {
  .col-lg-5.col-md-6.left-dashboard-col {
    padding-right: 5px;
  }

  .col-lg-5.col-md-6.right-dashboard-col {
    padding-left: 5px;
  }
}

.help-link {
  color: #009efb !important;
}

.btn.btn-info {
  padding: 12px 24px;
  text-transform: uppercase;
  font-weight: 700 !important;
}

.bot-body-item.bot-body-item-buttons {
  margin-bottom: 0;
}

.btn.btn-block {
  font-weight: 700 !important;
  font-size: 1.08em;
  padding: 12px;
  color: white;
  margin-top: 1.5rem;
  text-transform: uppercase;
  max-width: 300px;
}

.btn.btn-block-custom {
  font-weight: 700 !important;
  color: white;
  margin-top: 1.5rem;
  max-width: 122px;
  white-space: unset !important;
}

.btn.btn-preview:focus {
  box-shadow: 0 0 0 0
}

.transactional-messages-wrapper {
  width: 100%;
}

.transactional-messages-wrapper img {
  max-width: 100%;
  height: auto;
  border-radius: 1.3em;
}

.transactional-fb-message-text-with-button {
  padding: 10px;
  background-color: #f1f0f0;
  border-top-left-radius: 1.3em;
  border-top-right-radius: 1.3em;
  margin: 10px;
}

.transactional-fb-message-text-without-button {
  background-color: #f1f0f0;
  border-radius: 1.3em;
  margin: 10px;
  padding: 10px;
}

.transactional-fb-message-button {
  padding: 10px;
  color: #2787ff;
  text-align: center;
  border-bottom-left-radius: 1.3em;
  border-bottom-right-radius: 1.3em;
  border: solid 1px #e5e5e5;
  background-color: white;
  margin: 10px;
}

.transactional-fb-message-QR {
  padding: 10px;
  width: 50%;
  color: #0099ff;
  text-align: center;
  border: solid 1px #0099ff;
  border-radius: 1.3em;
  background-color: white;
  margin-left: auto;
  margin-right: auto;
  margin-top: 10px;
}

.btn.btn-small {
  width: 66% !important;
  min-width: 140px;
  max-width: 170px;
  padding: 9px 18px;
  margin: 0.55rem auto 0;
}

.btn.btn-white {
  background-color: white;
  color: var(--maisie-violet);
  border: 0;
}

.btn.btn-violet {
  background-color: var(--maisie-violet);
  border: 0;
}

.btn.btn-violet {
    background-color: var(--maisie-violet);
    border: 0;
}

.btn.btn-violet-with-border {
    background-color: var(--maisie-violet);
    color: #fff;
    border-color: var(--maisie-violet);
}

.btn.btn-violet-with-border:focus {
    box-shadow: 0 0 0 3px #f4f2fa;
}

.btn.btn-violet:hover {
    background-color: #b3a7e7;
}

.btn.btn-grey {
  background-color: var(--maisie-light-grey);
  color: var(--maisie-dark-grey);
  /*font-weight: 300 !important;*/
  border: 0;
}

.btn.btn-green {
  background-color: #2ED6B4;
  border: 0;
}

.btn.btn-white:hover, .btn.btn-white:active, .btn.btn-white:focus {
  background-color: whitesmoke;
  border: 0;
  opacity: 1;
}

.btn.btn-violet:hover:not('disabled'), .btn.btn-violet:active:not('disabled'), .btn.btn-violet:focus:not('disabled') {
  background-color: var(--maisie-violet);
  border: 0;
  opacity: 1;
}

.btn.btn-grey:hover, .btn.btn-grey:active, .btn.btn-grey:focus {
  background-color: var(--maisie-light-grey);
  border: 0;
  opacity: 1;
}

.btn.btn-green:hover, .btn.btn-green:active, .btn.btn-green:focus {
  background-color: #22A086;
  border: 0;
  opacity: 1;
}

form .btn-grey:hover {
  background: var(--maisie-light-grey) !important;
}

.btn.btn-block.back {
  float: left;
}

.btn.btn-block.next, .btn.btn-block.refresh {
  float: right;
}

.text-success {
  color: var(--maisie-blue) !important;
}

.ondoarding-box {
  margin: 0 auto;
  max-width: 500px;
}

.ondoarding-box-large {
  margin: 0 auto;
  max-width: 1200px;
}

.list-style-none, .list-style-none ul {
  list-style: none;
}

.login-register {
    background-color: var(--maisie--form-background-white);
    position: relative;
    padding: 0;
}

div.login-register.maisie-login-container {
  width: 400px;
  height: 520px;
}

section.maisie-login-section {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 88vh;
}

.login-container {
  border-radius: 10px;
  max-width: 500px;
  min-height: 380px;
  border: 0;
  margin-bottom: 0 !important;
}

.sidebar-nav > ul > li > a.active i, .sidebar-nav > ul > li > a:hover i, .sidebar-nav > ul > li > a.active {
  /*color: white !important;*/
}

.card-no-border .sidebar-nav > ul > li > a.active {
  color: #FE4A49 !important;
}

.sidebar-nav ul li .active {
  color: #FE4A49 !important;
}

.sidebar-nav > ul > li > a > span {
  font-weight: bolder !important;
}

.scroll-sidebar {
  background-color: #f4f2fa;
}

.sidebar-nav ul li a {
  color: white;
}

.sidebar-nav ul li {
  background-color: var(--maisie-blue);
}

.sidebar-nav > ul > li > a i {
  /*color: white !important;*/
}

.sidebar-nav > ul > li > a {
  /*border-left: 3px solid #272c33;*/
}

.sidebar-nav > ul > li.active > a {
  /*color: #fbbc05 !important;*/
  /*font-weight: bolder !important;*/
  /*border-left: 3px solid white !important;*/
}

.mini-sidebar .sidebar-nav #sidebarnav > li.active > a.active, .sidebar-nav > ul > li > a.active, .sidebar-nav > ul > li > a:hover {
  /*border-color: white !important;*/
}

.footer {
  padding: 23px 15px;
  font-size: 0.8rem;
  border: hidden;
  background: white;
  left: 272px;
}

.card div.round.round-success {
    background: var(--maisie-violet);
}

.page-wrapper {
  min-height: 95vh !important;
}

.sidebar-footer {
  display: block !important;
}

.card .contact-list td {
  padding: 5px 10px;
  font-size: 0.9em;
}

#main-wrapper .card-item {
  border: 1px solid rgba(0, 0, 0, .15);
  height: 100%;
  overflow-x: scroll;
  align-items: center;
}

#main-wrapper .card-item img:first-of-type {
  border-bottom: 1px solid rgba(0, 0, 0, .15);
}

.footable-even td img {
  width: 70px;
}

#ad_preview {
  display: block !important;
}

/* .slideTwo */
.slidetwo {
  display: inline-block;
  position: relative;
  min-width: 115px;
}

.slidetwo label {
  display: block;
  position: absolute;
  top: 0px;
  left: 40px;
  color: var(--maisie-violet);
  text-decoration: underline;
}

.slidetwo label:before {
  position: absolute;
  /*font-family: FontAwesome;*/
  content: "Start";
  left: -36px;
  cursor: pointer;
  text-decoration: underline;
}

.slidetwo.post label:before {
  content: "Create" !important;
  left: -46px !important;
}

.slidetwo input[type=checkbox] {
  visibility: hidden;
  margin: 0 4px;
}

.slidetwo input[type=checkbox]:checked + label:before {
  content: "Pause";
  color: var(--maisie-violet);
  cursor: pointer;
  left: -45px;
  text-decoration: underline;
}

.slidetwo.post input[type=checkbox]:checked + label:before {
  content: "Don't" !important;
  left: -38px !important;
}

/*--------------------*/

.img-responsive-16by9 {
  display: block;
  height: 0;
  padding-bottom: 56.25%;
  overflow: hidden;
}

.card-header button.btn.btn-link.open.collapsed {
  display: none;
}

.card-header button.btn.btn-link.opend.collapsed {
  display: none;
}

.wizard-content .wizard > .steps > ul > li a {
  color: var(--maisie-dark-grey);
  cursor: default;
}

.wizard-content .wizard > .steps > ul > li.current > a {
  color: var(--maisie-black);
}

.panel-title > a:before {
    float: right !important;
    font-family: FontAwesome;
    content: "\f068";
    padding: 6px;
    font-weight: 300;
    font-size: 26px;
    color: var(--maisie-violet);
}

.panel-title > a.collapsed:before {
  float: right !important;
  content: "\f067";
  font-size: 28px;
}

.panel-title > a,
.panel-title > a:hover,
.panel-title > a:active,
.panel-title > a:focus {
  text-decoration: none;
  cursor: default;
  color: var(--maisie-black) !important;
}

.carousel .carousel-item img {
  max-height: 268px;
  min-width: inherit;
  display: block;
  margin: 0 auto;
}

.bootstrap-tagsinput {
  width: 100%;
}

.update-link {
  color: var(--maisie-violet);
  text-decoration: underline;
  font-size: 1rem;
  cursor: pointer;
}

#collapse3.show + p,
#collapse2.show + p {
  display: none;
}

.btn-text:not(.collapsed) .btn-text-edit {
  display: none
}

.btn-text.collapsed .btn-text-save {
  display: none
}

/* Media */

@media (max-width: 375px) {
  .btn.btn-block.back {
    min-width: 120px;
    padding: 12px 12px;
    width: 40%;
  }
}

@media (max-width: 1280px) {
  .btn.btn-block.back {
    min-width: 190px;
    padding: 12px 12px;
    width: 40%;
  }
}

@media (min-width: 576px) {
  .modal-dialog {
    max-width: 700px;
    margin: 30px auto;
  }
}

.collapse2-info span:not(.hide) {
  display: block;
}

.collapse2-info #saved_audience_name {
  display: initial;
}

.not-posted {
  background-color: #C1C4C2;
}

#edit_audience:disabled, #edit_budget:disabled, .post-button:disabled {
  background-color: darkgrey;
}

.sign-up-form {
  text-align: center;
}

h2.sign-up-form {
  font-weight: 500 !important;
}

h4.sign-up-form {
  font-weight: 300 !important;
}

.signup-top-info {
  text-align: center;
  padding-bottom: 5px;
}

.signup-top-info h2, .signup-top-info h4 {
  color: var(--maisie-blue);
  padding: 5px 0;
}

.signup-help-info {
  border-radius: 0;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  padding: 25px 15px 2%;
  background-color: #f2f2f2;
  max-width: 500px;
  margin-bottom: 0 !important;
  min-height: 380px;
}

.setup-main-card {
  display: flex;
  flex-direction: row;
  justify-content: center;
}

.new-setup {
  background-color: var(--maisie-blue);
  padding-top: 1% !important;
}

.setup-info-explanation {
  margin-left: 16px;
  font-size: small;
}

.onoffswitch {
    position: relative; width: 86px;
    -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
}
.onoffswitch-checkbox {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.onoffswitch-label {
    display: block; overflow: hidden; cursor: pointer;
    border-radius: 20px;
}
.onoffswitch-inner {
    display: block; width: 200%; margin-left: -100%;
    transition: margin 0.3s ease-in 0s;
}
.onoffswitch-inner:before, .onoffswitch-inner:after {
    display: block; float: left; width: 50%; height: 30px; padding: 0; line-height: 30px;
    font-size: 14px; color: white; font-family: Trebuchet, Arial, sans-serif; font-weight: bold;
    box-sizing: border-box;
}
.onoffswitch-inner:before {
    content: "ON";
    padding-right: 44px;
    background-color: #69cbcc; color: #FFFFFF;
}
.onoffswitch-inner:after {
    content: "OFF";
    padding-right: 10px;
    background-color: #835aff; color: #FFFFFF;
    text-align: right;
}
.onoffswitch-switch {
    display: block; width: 18px; margin: 6px;
    background: #FFFFFF;
    position: absolute; top: 0; bottom: 0;
    right: 56px;
    border-radius: 20px;
    transition: all 0.3s ease-in 0s;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
    margin-left: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
    right: 0px;
}
.disabled_onoffswitch:after {
    background-color: var(--maisie-grey);
    cursor: default;
}


.setup-explanation-item {
  margin-bottom: 0;
}

.container-setup {
    height: 100vh;
    color: var(--maisie-black) !important;
    background-color: var(--maisie--form-background-white) !important;
}

.number-circle {
  background-color: #ffffff !important;
  border-radius: 0.8em;
  -moz-border-radius: 0.8em;
  -webkit-border-radius: 0.8em;
  color: var(--maisie-blue);
  border: 2px solid var(--maisie-blue) !important;
  display: inline-block;
  font-weight: bold;
  line-height: 1.6em;
  text-align: center;
  width: 1.6em;
}

.number-circle-completed {
  background-color: var(--maisie-blue) !important;
  border-radius: 0.8em;
  -moz-border-radius: 0.8em;
  -webkit-border-radius: 0.8em;
  color: #ffffff !important;
  border: 2px solid var(--maisie-blue) !important;
  display: inline-block;
  font-weight: bold;
  line-height: 1.6em;
  text-align: center;
  width: 1.6em;
}

.onboarding-step-title {
  font-weight: 500 !important;
  text-align: center
}

@media (max-width: 768px) {
  .signup-help-info, .login-container {
    border-radius: 0;
  }

  .login-container {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
  }

  .signup-help-info {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
  }
}

.resize-button {
  width: 60%;
}

@media (max-width: 575px) {
  .order-12 {
    order: unset;
  }

  .resize-button {
    width: 90% !important;
  }

  .sign-up-btn {
    width: 100% !important;
    font-size: 0.8em !important;
    padding: 12px 4px !important;
  }
}

button.btn.sign-up-btn {
  font-weight: 700 !important;
  font-family: 'IBM Plex Sans', 'Helvetica Neue', Arial, sans-serif !important;
  color: var(--maisie-blue);
}

h4.card-title.heading.sign-up-form {
  font-weight: 300 !important;
  font-family: 'IBM Plex Sans', 'Helvetica Neue', Arial, sans-serif; !important;
}

.fb-setup {
  background-color: var(--maisie-blue);
}

@media (max-width: 768px) {
  h2.sign-up-form {
    font-size: 22px;
    font-weight: 400 !important;
  }

  h4.sign-up-form {
    font-size: 16px;
  }
}

.checkbox-toggle input[type="checkbox"] {
  display: none;
}

.checkbox-toggle label {
  width: 40px;
  height: 12px;
  position: relative;
  background: #d2d2d2;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  border: 1px solid #c2c2c2
}

.checkbox-toggle label:before {
  content: "";
  display: block;
  width: 24px;
  height: 24px;
  background-color: #fff;
  border: 1px solid #c2c2c2;
  border-radius: 50%;
  position: absolute;
  left: -3px;
  /*right: auto;*/
  top: 50%;
  transform: translate(0, -50%);
  -webkit-transition: all .2s ease-in;
  -moz-transition: all .2s ease-in;
  -ms-transition: all .2s ease-in;
  -o-transition: all .2s ease-in;
  transition: all .2s ease-in;
}

.checkbox-toggle input[type="checkbox"]:checked ~ label {
  background-color: #3fd156;
}

.checkbox-toggle input[type="checkbox"]:checked ~ label:before {
  left: -7px;
  transform: translate(100%, -50%)
}

.vertical-divider {
  margin-left: 15px;
  margin-right: 15px;
}

.bordered-checkbox-wrapper {
  border: 1px solid #c2c2c2;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  position: relative;
  padding-right: 65px;
}

.bordered-checkbox-wrapper .flex-wrapper {
  display: flex;
}

.bordered-checkbox-wrapper .flex-wrapper h5 {
  margin-right: 15px;
}

.bordered-checkbox-wrapper .flex-wrapper .checkbox-toggle {
  transform: scale(0.8);
  margin-top: 1px;
}

.bordered-checkbox-wrapper .checkbox-settings {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
}

.bordered-checkbox-wrapper .checkbox-settings a {
  color: #c2c2c2;
  font-size: 42px;
}

.f-w-400 {
  font-weight: 400 !important;
}

.abandoned-cart-messages-stat td, .abandoned-cart-messages-stat th {
  text-align: center;
}

.abandoned-cart-messages-stat th {
  color: #666666;
  text-transform: uppercase;
}

.abandoned-cart-messages-stat td:first-of-type, .abandoned-cart-messages-stat th:first-of-type {
  text-align: left;
  width: 60%;
}

.abandoned-cart-messages-stat td em {
  font-weight: 400 !important;
  font-style: normal;
}

.db-mm-wrapper {
  /* TODO: add 70/30 to columns*/
}

.checkbox-edit-form {
  max-width: 80%;
}

.checkbox-edit-form hr {
  margin: 30px 0;
}

.checkbox-edit-form .form-block label {
  font-weight: 400 !important;
  font-size: 14px;
  display: block;
}

.checkbox-edit-form .inline-label {
  display: inline-block !important;
}

.checkbox-edit-form .inline-form-block .inline-wrapper {
  display: flex;
  width: 100%;
}

.checkbox-edit-form .inline-form-block .inline-wrapper .form-group:first-of-type {
  margin-right: 15px;
}

.checkbox-edit-form .inline-form-block .inline-wrapper .form-group {
  width: 100%;
}

.table th,
.table td {
  padding: 0.75rem 0.75rem 0.75rem 30px;
  vertical-align: top;
  border-top: none;
  border-left: none;
}

.table tr.border-row td {
  border-top: 1px solid #dee2e6;
}

.table {
  border-collapse: unset;
}

.dashboard-card-wrapper {
  margin-bottom: 10px;
}

.post-message-wrapper {
  display: flex;
  justify-content: flex-start;
  align-items: stretch;
  margin-bottom: 30px;
}

.post-message-wrapper button {
  margin-top: 0 !important;
}

.post-message-wrapper textarea {
  margin-right: 30px;
  flex-shrink: 0.5;
}

.fb-posts .card-item {
  border: none !important;
  overflow: auto !important;
}

.fb-posts .card-block {
  max-height: calc(100vh - 70px - 25px - 36px - 34px - 20px - 70px - 50px);
  overflow-y: scroll;
}

/* TODO: remove after iframe fix*/
.temp-preview {
  width: 90%;
  display: block;
  margin: auto;
  max-width: 100%;
}

.posts-footer {
  position: absolute;
  bottom: 0;
  width: calc(100% - 60px);
  z-index: 100;
  background: #fff;
  height: 70px;
}

.posts-footer button.btn.btn-block.next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 30px;
  margin: 0;
}

@media (max-width: 768px) {
  .hidden-mobile {
    display: none;
  }
}

aside.left-sidebar {
  padding-top: 0;
}

.mobile-navbar {
  display: none;
}

@media (max-width: 767px) {
  .mobile-navbar {
    display: block;
  }

  aside.left-sidebar {
    padding-top: 70px;
  }

  .mini-sidebar div.page-wrapper {
    padding-top: 70px;
  }

  .posts-footer {
    width: 100%;
  }
}

@media (max-width: 1246px) {
  .post-message-wrapper button {
    min-width: unset !important;
  }
}

.preview-wrapper img {
  max-width: 100%;
}

.preview-wrapper iframe {
  max-width: 100%;
  margin: 0 !important;
  height: 274px !important;
}

@media (max-width: 921px) {
  .post-message-wrapper button {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .post-message-wrapper textarea {
    margin-right: 10px;
  }
}

@media (max-width: 935px) {
  .create-new-post {
    font-size: 14px !important;
    min-width: max-content !important;
  }
}

@media (max-width: 598px) {
  .create-new-post {
    font-size: 12px !important;

  }
}

@media (max-width: 426px) {
}

@media (max-width: 524px) {

  .fb-posts .row.page-titles .col-md-6 {
    min-width: 100%;
  }

  .fb-posts .card-block {
    padding: 1rem !important;
  }

  .fb-posts .card-block .container-fluid {
    padding: 0;
  }

  .create-new-post {
    position: relative;
    bottom: 0;
    margin: 10px auto 0;
    float: none !important;
  }

}

em.posts-counter {
  font-style: normal;
}

button:disabled {
  cursor: not-allowed;

}

ul#sidebarnav li i {
  min-height: 31px;
}

.opt-in-box-preview {
    border: 3px solid #f4f2fa;
    border-radius: 5px;
    border-bottom-width: 6px;
    padding: 10px 75px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.f-w-500 {
  font-weight: 500 !important;
}

.add-to-cart-button {
  text-align: center;
  text-transform: uppercase;
  border: 2px solid #c2c2c2;
  color: #c2c2c2;
  padding: 8px;
  border-radius: 5px;
  font-weight: 500 !important;
  margin-bottom: 10px;
  cursor: pointer;
  letter-spacing: 2px;
}

.send-to-messenger {
  display: flex;
  flex-direction: row;
  align-items: center;
  border: 1px solid #c2c2c2;
  border-radius: 10px;
}

.icon-preview {
  position: relative;
  padding: 12px 24px;
  background-color: #f7f7f7;
  border-right: 1px solid #c2c2c2;
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
}

.discount-ico-wrapper {
  display: block;
  width: 45px;
  height: 45px;
}

.discount-type {
  color: #fff;
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  font-weight: 800 !important;
  font-size: 24px;
}

.checkbox-preview {
  padding: 10px;
}

.checkbox-preview .checkbox-wrapper label {
  margin-bottom: 0;
}

.checkbox-preview .checkbox-wrapper label .mdi {
  color: #2aa6fd;
}

.opt-in-box-preview p.checkbox-text {
  margin-bottom: 8px;
  font-size: 14px;
}

.get-your-discount {
  margin-top: 10px;
  margin-bottom: 40px;
  padding: 10px 25px;
  border: 1px solid #c2c2c2;
  border-radius: 8px;
  background: #f7f7f7;
  font-weight: 400 !important;
}

.checkbox-preview small i {
  color: #a1a1a1;
  font-style: normal;
}

.checkbox-preview small em a {
  color: #a1a1a1 !important;
  text-decoration: underline;
  font-style: normal;
}

.checkbox-edit-form .form-control {
  margin-bottom: 10px;
}

.messages-config .bordered-checkbox-wrapper:first-of-type {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.messages-config .bordered-checkbox-wrapper:last-of-type {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.messages-config .bordered-checkbox-wrapper:not(:last-of-type) {
  border-bottom: none;
}

.messages-config .checkbox-toggle {
  top: 50%;
  position: absolute;
  right: 80px;
  transform: translateY(-50%);
  margin-top: 8px;
}

.bordered-checkbox-wrapper .flex-wrapper, .bordered-checkbox-wrapper small {
  max-width: 80%;
  display: block;
}

.reminder-message-form label {
  font-weight: 400 !important;
  display: block;
}

.reminder-message-form .form-block {
  margin-bottom: 10px;
}

.reminder-message-form .half-width {
  width: 40%;
  display: block;
}

.reminder-preview-wrapper {
  /*background: url(../images/iphone_preview.png) no-repeat 0 0;*/
  width: 98%;
  background-size: contain;
  margin: auto;
}

.reminder-preview-wrapper .content,
.reminder-preview-wrapper .content .absolute-content {
  width: 100%;
}

.reminder-preview-wrapper .content img {
  max-width: 90%;
  min-width: 90%;
  display: block;
  border-radius: 10px;
  margin: auto auto 10px;
}

.reminder-preview-wrapper .content .message-preview {
  background-color: #f7f7f7;
  font-size: 12px;
  border-radius: 10px;
  max-width: 90%;
  min-width: 90%;
  margin: 10px auto;
  padding: 10px;
  word-break: break-word;
}

.reminder-preview-wrapper .content .checkout-btn {
  max-width: 90%;
  width: 90%;
  margin: auto;
  text-align: center;
  font-size: 13px;
  font-weight: 500 !important;
  padding: 5px 15px;
  border: 1px solid #f2f2f2;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}

.reminder-preview-wrapper .content .checkout-btn a {
  color: #36456f;
}

.absolute-content {
  /*    position: absolute;
      top: 110px;
      left: 50%;
      min-width: 50%;
      -webkit-transform: translateX(-50%);
      -moz-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      -o-transform: translateX(-50%);
      transform: translateX(-50%);*/
}

@media (max-width: 1246px) {
  .absolute-content {
    min-width: 60%;
    top: 90px;
  }

}

@media (max-width: 1071px) {
  .absolute-content {
    top: 80px;
  }
}

@media (max-width: 1071px) {
  .message-preview, .checkout-btn a {
    font-size: 10px !important;
  }
}

@media (max-width: 992px) {
  .absolute-content {
    top: 110px;
  }
}

@media (max-width: 351px) {
  .absolute-content {
    top: 60px;
  }
}

@media (max-width: 1711px) and (min-width: 1443px) {
  .opt-in-box-preview {
    padding: 10px 30px;
  }
}

@media (max-width: 1443px) and (min-width: 1321px) {
  .opt-in-box-preview {
    padding: 10px 10px;
  }
}

@media (max-width: 1321px) and (min-width: 1200px) {
  .configure-opt-box-form {
    max-width: 60%;
  }

  .configure-opt-box-preview {
    max-width: 40%;
    min-width: 40%;
  }

  .opt-in-box-preview {
    padding: 10px 20px;
  }
}

@media (max-width: 1179px) and (min-width: 991px) {
  .opt-in-box-preview {
    padding: 10px 30px;
  }
}

@media (max-width: 991px) {
  .configure-opt-box-preview {
    min-width: 100%;
  }
}

@media (max-width: 573px) {
  .opt-in-box-preview {
    padding: 10px;
  }
}

.chat-widget-preview .preview-header {
  font-weight: 400 !important;
}

.chat-widget-preview .widget-block {
  border: 1px solid #c2c2c2;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
}

.chat-widget-preview .widget-block .widget-body {
  padding: 10px;
  border-bottom: 1px solid #c2c2c2;
  position: relative;
}

.chat-widget-preview .widget-block .widget-body p {
  font-weight: 400 !important;
  margin-bottom: 10px;
  max-width: calc(100% - 70px);

}

.chat-widget-preview .widget-block .widget-body small {
  font-weight: 400 !important;
  margin-left: 25px;
  opacity: 0.6;
  max-width: calc(100% - 70px);
}

.chat-widget-preview .widget-block .widget-body small img {
  width: 28px;
  margin-right: 5px;
}

.chat-widget-preview .widget-block .widget-body .location-pic {
  background: #c4cce0;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);

}

.chat-widget-preview .widget-block .widget-body .mdi-close {
  background: #c2c2c2;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  position: relative;
  display: inline-block;
  vertical-align: text-bottom;
  margin-right: 5px;
}

.chat-widget-preview .widget-block .widget-body .mdi-close:before,
.chat-widget-preview .big-fb-icon .mdi-facebook-messenger:before {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}

.chat-widget-preview .widget-block .widget-bottom {
  padding: 10px;
  text-align: center;
  color: #2aa6fd;
  font-weight: 500 !important;
}

.chat-widget-preview .big-fb-icon {
  margin-top: 10px;
  text-align: right;
}

.chat-widget-preview .big-fb-icon .mdi-facebook-messenger {
  font-size: 44px;
  color: white;
  background: #2aa6fd;
  border-radius: 50%;
  width: 48px;
  height: 48px;
  display: inline-block;
  position: relative;
  right: 0;
}

.chat-widget-preview .big-fb-icon .mdi-facebook-messenger:before {
  margin-top: 2px;
}

.chat-widget-preview .widget-block .widget-body .location-pic svg {
  width: 40px;
  height: 40px;
}

.font-header-color {
  color: var(--maisie-violet) !important;
}

.maisie-tr-head > th, .maisie-tr-head > div {
  color: var(--maisie-blue);
  font-weight: 700 !important;
  padding: 12px;
}

.card-no-border .sidebar-nav > ul > li > a.active > svg {
  fill: #FE4A49 !important;
  stroke-width: 2px;
}

.card-no-border .sidebar-nav > ul > li > a:hover > svg {
  fill: #FE4A49 !important;
  stroke-width: 2px;
}

.subscribers-table thead tr th,
.subscribers-table tbody tr td {
  padding: 10px;
}

.customtab li a.nav-link.active[role='tab'],
.customtab li a.nav-link[role='tab']:hover {
  color: var(--maisie-violet);
  border-color: var(--maisie-violet);
}

.campaigns-table-row > div {
  background-color: white;
}

.campaigns-table-row > div:hover {
  background-color: #efefef;
}

.campaigns-table-row .campaigns-table-row--accordion {
  background-color: #efefef;
}

.card #loadingSpinner {
  position: absolute;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  background-color: rgba(0, 0, 0, 0.0);
  border-radius: .25rem;
}

.card #loadingSpinner > div {
  position: absolute;
  left: calc(50% - 34px);
  top: calc(50% - 34px)
}

.broadcast-message {
  background: white;
  border-radius: 0.25rem;
  margin: 15px 15px 10px 15px;
  border: 1px solid grey;
  box-shadow: none;
  color: grey;
}

.broadcast-message:focus {
  outline: none;
  box-shadow: none;
}

.broadcast-message.broadcast-message--selected {
  color: rgb(66, 133, 244);
  border-color: rgb(66, 133, 244);
}

.slide-enter {
  opacity: 0;
}

.slide-enter-active {
  animation: slide-in 0.75s ease-out forwards;
  transition: opacity 0.75s;
}

.slide-leave {
}

.slide-leave-active {
  animation: slide-out 0.75s ease-out forwards;
  transition: opacity 0.75s;
  opacity: 0;
}

@keyframes slide-in {
  from {
    transform: translateY(20px);
  }
  to {
    transform: translateY(0);
  }
}

@keyframes slide-out {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(20px);
  }
}


.trial-expired-container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-top: 0;
    z-index: 999;
    height: 60px;
    width: 100%;
    top: 0;
    position: fixed;
    box-shadow: 0 0 0, 0 0 5px #cecece;
    background-color: #FFFFFFFF;
    color: var(--maisie-blue);
}

.current-tab{
    margin-left: 84px;
    display: flex;
    text-align: center;
    align-items: baseline;
    display: flex;
    align-items: center;
}

.tab-name{
    font-size: 22px;
    font-weight: 400 !important;
    line-height: 30px;

    margin-left: 10px;
}


.avatar {
  width: 35px;
  height: 35px;
  background: #e5e5e5; /* primary-200 */
  opacity: 1;
  margin-right: 24px;
  margin-left: 10px;
  overflow: hidden;
  border-radius: 18px;
}

.avatar-logo {
  width: 35px;
  height: 35px;
  background-color: #e5e5e5;
  color: #2e3192;
  border-radius: 50%;
  text-align: center;
  line-height: 35px;
  font-size: 0
}
dt.avatar-logo::first-letter {
  font-size: 16px;
  text-transform: uppercase;
}

.top-profile-body {
    position: absolute;
    top: 48px;
    width: 256px;
    right: 3px;
    height: 303px;
    z-index: 9999;
    background: #FFFFFFFF;
    border-radius: 4px;
    box-shadow: 0px 4px 9px #171a1f, 0px 0px 2px #171a1f;
}

.trial-expired-container .trial-expired-button-container {
  padding: 10px
}

.trial-expired-button-container a[type="button"] {
    margin: 0;
    height: 40px;
    background-color: #69CBCCFF;
    font-weight: 700 !important;
    font-size: 14px;
    color: #1B4F50FF;
    padding: 8px;
    text-transform: uppercase;
    min-width: 200px;
    line-height: unset;
    max-width: 300px;
    -webkit-appearance: none;
}
.trial-expired-text-container{
  display: flex;
  font-family: Open Sans; /* Body */
  font-size: 16px;
  align-items: center;
  line-height: 22px;
  color: #171A1FFF;
}

.profile-card {
    top: 60px;
    right: 0;
    z-index: 9999;
    position: absolute;
    font-size: 15px;
    font-family: Arial, sans-serif;
    background-color: white;
    padding: 20px 20px 0px 20px;
    border: 1px solid #ccc;
    box-shadow: 0 2px 5px rgb(0 0 0 / 20%);
}

.avatar-profile {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    margin-bottom: 10px;
}

.user-info {
    display: flex;
    align-items: center;
}
.user-details{
  margin-left: 5px;
}
.tab-icon{
  font-size: 22px;
  display: flex;
  align-items: center;
}

.name {
    font-weight: bold;
}
.email {
  font-size: 12px;
  color: #9095A1FF;
  margin-top: 7px;
}

.divider {
    border-top: 1px solid #ccc;
    margin: 10px 0;
}

.description {
    margin: 10px 0;
    color: rgb(86, 93, 109);
    display: flex;
    line-height: 22px;
    padding: 9px;
    cursor: pointer;
}

/*.trial-expired-button-container a[type="button"]:hover {*/
/*  border: 1px solid white;*/
/*}*/

@media (max-width: 767px) {
  .trial-expired-container {
    padding-top: 70px;
  }

  div.page-wrapper[data-platform="Shopify"] {
    padding-top: 0;
  }
}

@media (max-width: 480px) {
  .trial-expired-container {
    flex-direction: column;
    padding-top: 85px;
  }
}

.store-login-card {
  border-radius: 15px;
  margin-bottom: 15px;
  background-color: #fff;
}

.store-login-card:hover {
    background: #F1F8FE;
}

.store-login-card a {
    display: block;
    position: relative;
}

.store-detail {
    height: 100%;
    width: 100%;
    padding: 15px;
}

.store-detail p {
    padding: 0;
}

.limited-field-wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.limited-field-wrapper span {
  color: var(--maisie-violet);
  width: 32%;
  margin: 0 20px;
  font-size: 0.7em;
}

label.required:after {
  color: var(--maisie-violet);
  content:" *";
}

.onoffswitch {
    position: relative;
    width: 90px;
    margin: auto;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}
.onoffswitch-checkbox {
    display: none;
}
.onoffswitch-label {
    display: block;
    overflow: hidden;
    cursor: pointer;
    border: 2px solid #FFFFFF;
    border-radius: 20px;
}
.onoffswitch-inner {
    display: block;
    width: 200%;
    margin-left: -100%;
    transition: margin 0.3s ease-in 0s;
}
.onoffswitch-inner:before, .onoffswitch-inner:after {
    display: block;
    float: left;
    width: 50%;
    height: 30px;
    padding: 0;
    line-height: 30px;
    font-size: 14px;
    color: white;
    font-family: Trebuchet, Arial, sans-serif;
    font-weight: bold;
    box-sizing: border-box;
}
.onoffswitch-inner:before {
    content: "ON";
    padding-left: 10px;
    background-color: #69cbcc;
    color: #FFFFFF;
}
.onoffswitch-inner:after {
    content: "OFF";
    padding-right: 10px;
    background-color: #835aff;
    color: #FFFFFF;
    text-align: right;
}

.disabled-onoffswitch:after {
    background-color: var(--maisie-grey);
    cursor: default;
}

.disabled_onoffswitch:before {
    background-color: var(--maisie-grey);
    cursor: default;
}

.notification-toggle-container {
  display: flex;
  flex-direction: column;
  /*align-items: flex-end;*/
  margin-left: auto
}

.notification-toggle-container-grid {
  display: grid;
  grid-template-columns: 55px 100px 65px 90px;
  font-size: 15px;
  grid-gap: 0px 1px
}

.onoffswitch-switch {
    display: block;
    width: 18px;
    margin: 6px;
    background: #FFFFFF;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 56px;
    border: 2px solid #FFFFFF;
    border-radius: 20px;
    transition: all 0.3s ease-in 0s;
    height: 22px;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
    margin-left: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
    right: 0px;
}

.error-span {
  color: var(--maisie-violet);
  width: 32%;
  font-size: .7em;
  margin-left: 5px
}
.error-span-red {
  color: red;
  width: 32%;
  font-size: .7em;
  margin-left: 5px
}

.ask-for-draft-name-modal > * {
  width: 100%;
  margin: 1rem 0;
}

.ask-for-draft-name-modal input {
  border: 1px solid rgba(0,0,0,.15) !important;
  border-radius: .3rem;
  line-height: 1.5;
  padding: .5rem 1rem;
  font-size: 1.25rem;
}

.save-draft-button {
  border: 2px solid white !important;
  margin: 1rem 0 !important;
  font-weight: 700 !important;
  font-size: 1.08em;
}

.currentdraft {
  background-color: #D3D3D3;
}

.accordion-tab-content > table {
    background: #fff;
    border-radius: .25rem;
    background-clip: border-box;
    table-layout: fixed;
    overflow: hidden;
    word-wrap: break-word;
    width: 100%;
}

.accordion-tab-content>table td, .accordion-tab-content>table th {
  text-align: left;
  vertical-align: middle;

}

.accordion-tab-content>table .cell.big-cell {
  width: 200px;
}

.accordion-tab-content>table .cell.icon-cell {
  width: 90px;
}

.accordion-tab-content>table .cell.icon-cell button {
  border: 0;
  padding-top: 0;
  background-color: inherit;
}

.accordion-tab-content>table th {
  font-size: 15px;
  font-weight: 600 !important;
}

.accordion-tab-content>table td {
  font-size: 14px;
  font-weight: 300 !important;
}


input[type="file"]#chat-logo  {
  display: none;
}

.file-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}

.file-container .invalid-feedback {
  display: block;
}

.logo-preview {
  height: 64px;
  width: 64px;
  cursor: pointer;
}

.admin-dashboard-button{
  height: 80%;
  padding: 10px;
  background: var(--maisie-light-grey);
  align-content: center;
  border-radius: 8px;
  border-color: transparent;
}
.admin-dashboard-button:hover{
  background: var(--maisie-grey);
}

.admin-dashboard-button:disabled{
  background: var(--maisie-grey);
}

.qr-stats > th, .qr-stats > th{
  padding-left: 30px;
}

.qr-bot-preview .bot-wrapper{
  margin-top: 0;
}

.payment-plans-block {
    width: 100%;
    border: 2px solid var(--maisie-black);
    border-radius: 5px;
    padding-left: 16px;
}

.payment-plan {
    padding: 24px;
    border-bottom: 2px solid var(--maisie-black);
}

.payment-plan-title {
    font-size: 24px;
    font-weight: bold;
}

.payment-plan-button {
    min-width: 150px;
    background-color: var(--maisie-violet);
}

.payment-plan-progressbar {
    height: 16px;
    border: 2px solid var(--maisie-violet);
    border-radius: 3px;
}

.payment-plan-progressbar-progress {
    background-color: var(--maisie-violet);
    height: 100%;
}

.payment-plan-text {
    color: var(--maisie-dark-grey);
}

.payment-plans-block:last-child {
    border-bottom: 0;
}

.payment {
    text-align: center;
}

.payment > .title, .payment > .price {
    margin: 15px 10px;
    font-weight: 700 !important;
    font-size: 22px !important;
}

.payment > .description {
    margin: 15px 10px;
}

.payment > a {
    align-self: center;
}

.daterangepicker .btn-success {
  background: var(--maisie-violet)!important;;
}

/*#create-stripe-customer, #subscription-form {*/
/*    background-color: white;*/
/*}*/

.customer-row {
    border-radius: 5px;
    padding: 5px;
}

.card-focus, .card-empty {
    background-image: linear-gradient(#009efb, #009efb), linear-gradient(#d9d9d9, #d9d9d9);
    border: 0 none;
    border-radius: 0;
    box-shadow: none;
    float: none;

    color: var(--maisie-dark-grey);

    background-color: transparent;
    background-position: center bottom, center calc(100% - 1px);
    background-repeat: no-repeat;
    background-size: 0 2px, 100% 1px;
    padding: 0;
    transition: background 0s ease-out 0s;
    min-height: 38px;
    display: initial;
    font-size: 1.25rem;
    line-height: 1.5;
    width: 100%;
    background-clip: padding-box;
    font-weight: 400 !important;
    font-family: 'IBM Plex Sans', 'Helvetica Neue', Arial, sans-serif;
    overflow: visible;
    margin: 0;
    touch-action: manipulation;
}

.card-invalid {

}

.card-empty::placeholder {
    color: #868e96;
    opacity: 1;
}

#card-expire > div > iframe > html > form >  .InputContainer{
    padding: 25px;
    color: #868e96;
    opacity: 1;
}

.light-gray-border {
  border: 1px solid lightgrey;
  border-radius: 5px;
}

.light-violet-border {
  border: 1px solid #f4f2fa;
  border-radius: 5px;
}

.bold-light-violet-border {
  border: 3px solid #f4f2fa !important;
  border-radius: 5px;
}

.go-back-button {
    display: flex;
    align-content: center;
}

.go-back-button:hover {
    color: var(--maisie-violet);
}

.custom-btn-violet_cancel {
    background-color: #fff;
    color: #472cbc !important;
    border: 1px solid #472cbc;
}

.custom-btn-violet_save {
    background-color: #472cbc;
    border: 1px solid #472cbc;
    color: #fff !important;
}

.selected-custom-module {
  background-color: #f4f2fa;
  border-color: #f4f2fa;
}

.node-editing-wrapper {
    background: #f4f2fa;
    margin: 10px 10px 20px 10px;
    padding: 15px;
}

.statistics-table th h5 {
    color: #472cbc !important;
}

.convo-name {
  font-weight: 600 !important;
  margin-bottom: 10px;
}

.convo-container {
 display: flex;
  flex-direction: row;
  margin-bottom: 10px;
  box-shadow: 0 4px 15px 0 rgba(71, 44, 188, 0.06), 0 2px 2px 0 rgba(71, 44, 188, 0.08);
  border-radius: 15px;
}

.convo-detail-container {
  display: flex;
  flex-direction: row;
  border: 3px solid #f4f2fa;
  padding: 20px 10px 0px 0px;
  border-radius: 15px 0px 0px 15px;
  position: relative;
  width: 100%;
}

.convo-actions-container {
  padding: 20px 0px 0px 0px;
  border: 3px solid #f4f2fa;
  border-radius: 0px 15px 15px 0px;
  overflow: hidden;
  min-width: 50px;
  display: flex;
  flex-direction: column;
  border-left: none;
}

.toggle-switch {
  position: relative;
  display: inline-block;
  width: 45px;
  height: 24px;
}

.toggle-switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.toggle-slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--maisie-violet);
  -webkit-transition: .4s;
  transition: .4s;
}

.toggle-slider:before {
  position: absolute;
  content: "ON";
  height: 20px;
  width: 20px;
  left: 2px;
  bottom: 2px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .toggle-slider {
  background-color: #55ce63;
}

input:focus + .toggle-slider {
  box-shadow: 0 0 1px #55ce63;
}

input:checked + .toggle-slider:before {
  -webkit-transform: translateX(21px);
  -ms-transform: translateX(21px);
  transform: translateX(21px);
}

/* Rounded sliders */
.toggle-slider.round-toggle {
  border-radius: 34px;
}

.toggle-slider.round-toggle:before {
  border-radius: 50%;
}

#live_chat_app{
  margin: -25px -30px
}

#id_captcha_1 {
  border: 1px solid rgba(0,0,0,.15);
}

@media screen and (max-width: 768px){
    #live_chat_app{
        position: relative;
        top: 70px;
        width: calc(100vw - 60px);
        margin: -25px -30px
    }
}
@media screen and (min-width:769px) and (max-width: 1020px){
    #live_chat_app{
        position: relative;
        width: calc(100vw - 60px);
        margin: -25px -30px
    }
}

.trial-onoffswitch {
    position: relative;
    width: 54px;
    margin-left: 22px;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select: none;
}
.trial-onoffswitch-checkbox {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.trial-onoffswitch-label {
    display: block; overflow: hidden; cursor: pointer;
    border-radius: 20px;
    margin-bottom: 0;
}
.trial-onoffswitch-inner {
    display: block; width: 200%; margin-left: -100%;
    transition: margin 0.3s ease-in 0s;
}
.trial-onoffswitch-inner:before, .trial-onoffswitch-inner:after {
  display: block;
  float: left;
  width: 50%;
  height: 25px;
  padding: 0;
  line-height: 27px;
  font-size: 12px;
  color: white;
  font-family: Trebuchet, Arial, sans-serif;
  font-weight: bold;
  box-sizing: border-box;
}
.trial-onoffswitch-inner:before {
    content: " ";
    padding-right: 31px;
    background-color: #69cbcc; color: #FFFFFF;
}
.trial-onoffswitch-inner:after {
    content: " ";
    padding-right: 8px;
    background-color: #835aff; color: #FFFFFF;
    text-align: right;
}
.trial-onoffswitch-switch {
  display: block;
   width: 16px;
  margin: 6px;
  background: #FFFFFF;
  position: absolute;
  top: -2px;
  bottom: 0;
  right: 28px;
  height: 18px !important;
  border-radius: 20px;
  transition: all 0.3s ease-in 0s;
}
.trial-onoffswitch-checkbox:checked + .trial-onoffswitch-label .trial-onoffswitch-inner {
    margin-left: 0;
}
.trial-onoffswitch-checkbox:checked + .trial-onoffswitch-label .trial-onoffswitch-switch {
    right: 0px;
}
.trial_disabled_onoffswitch:after {
    background-color: var(--maisie-grey);
    cursor: default;
}