@charset "UTF-8";
/*
* Transparent
*/
/*
* Transparent
*/
.btn:hover {
  opacity: 0.7;
}

#contentWrapper {
  height: 100%;
}

.vg-header-popup-call {
  padding: 9px 13px;
}

@font-face {
  font-family: "NexaLight";
  src: url("../fonts/nexa/NexaLight.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "NexaHeavy";
  src: url("../fonts/nexa/NexaHeavy.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "NexaBold";
  src: url("../fonts/nexa/NexaBold.otf") format("opentype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "SfprodMedium";
  src: url("../fonts/sfprod/SFPRODISPLAYMEDIUM.OTF") format("opentype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "SfprodRegular";
  src: url("../fonts/sfprod/SFPRODISPLAYREGULAR.OTF") format("opentype");
  font-weight: normal;
  font-style: normal;
}
.size-danger {
  color: #dc3545 !important;
  font-size: 27px;
  position: relative;
  top: 12px;
  left: 4px;
}

.flag-option {
  padding-left: 30px; /* Ajustez l'espace pour le drapeau */
}

.flag-icon {
  width: 24px;
  height: 24px;
  margin-right: 10px; /* Ajustez l'espacement entre le drapeau et le texte */
}

h2 {
  font-family: "NexaBold", sans-serif;
}

button,
span,
label,
p {
  font-family: "NexaLight", sans-serif;
  font-weight: lighter;
}

.dash-number span {
  font-family: "NexaBold", sans-serif;
}

.stat-dash {
  font-family: "NexaBold", sans-serif;
}

#bl-login {
  background-image: url("../img/bg-twifone.svg");
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
}

.h-100-pr {
  height: 100%;
}

.iti {
  width: 100%;
}

#title-note {
  border-bottom: 1px solid #ededed;
  font-size: 16px;
  padding-bottom: 12px;
}

#action_btn_keyboard,
#action_btn_setting {
  padding: 45px 22px !important;
  height: 47vh;
}

.btn-primary {
  background: #44cba3 !important;
  border: none !important;
}
.btn-primary:hover {
  background: #38b08c !important;
  color: #fff;
}

.hv-trans {
  transition: 0.4s;
  cursor: pointer;
}

.p-all {
  padding: 14px 20px;
}

.h-100 {
  height: 100vh !important;
}

.vg-section-send {
  display: none;
}

.vg-container {
  display: flex;
  overflow: hidden;
  /*
  * Side nav left
  */
  /*
  * Wrapper
  */
}
.vg-container .side-nav {
  background-color: #0C0C53;
  z-index: 2;
  width: 16%;
  transition: 0.5s !important;
}
.vg-container .vg-wrapper {
  width: 86%;
  transition: 0.5s;
}
.vg-container .vg-wrapper .vg-header {
  background: white;
  box-shadow: -4px -20px 23px 2px #000;
  display: flex;
  justify-content: space-between;
  padding: 20px 17px;
  align-items: center;
  z-index: 1;
  position: relative;
}
.vg-container .vg-wrapper .vg-header .vg-left-header {
  position: relative;
}
.vg-container .vg-wrapper .vg-header .vg-left-header i {
  position: absolute;
  top: 2px;
  left: 11px;
  color: #2f2fc9;
}
.vg-container .vg-wrapper .vg-header .vg-right-header {
  display: flex;
  align-items: center;
  gap: 22px;
}
.vg-container .vg-wrapper .vg-header .vg-right-header .vg-lang select {
  background: #eeeeee;
  border: none;
  font-size: 14px;
  padding: 10px 38px;
}
.vg-container .vg-wrapper .vg-header .vg-right-header .vg-header-profil {
  display: flex;
  gap: 10px;
}
.vg-container .vg-wrapper .vg-header .vg-right-header .vg-header-profil .fa-user {
  color: #d6d6d8;
  border: 1px solid #eaeaea;
  padding: 8px 10px;
  border-radius: 27px;
  margin-right: 6px;
}
.vg-container .vg-wrapper .vg-content-wrapper {
  padding: 22px 30px;
  height: 90vh;
  overflow-y: auto;
}
.vg-container .vg-wrapper .vg-content-wrapper::before {
  content: "";
  position: absolute;
  z-index: 0;
}
.vg-container .vg-wrapper .vg-wrapper-left {
  border-radius: 9px;
  background-color: white;
  z-index: 1;
  height: 95vh;
}
.vg-container .vg-wrapper .vg-wrapper-left .vg-head-wrapper-left {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #fbf0f0;
  padding-bottom: 15px;
}
.vg-container .vg-wrapper .vg-wrapper-right {
  border-radius: 9px;
  background-color: rgba(255, 255, 255, 0.49);
  z-index: 1;
  height: 95vh;
  overflow: hidden;
}
.vg-container .vg-wrapper .vg-wrapper-right .vg-head-wrapper-right {
  background: white;
  border-radius: 10px;
  display: flex;
  justify-content: space-between;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  height: 72px;
  align-items: center;
}
.vg-container .vg-wrapper .vg-wrapper-right .vg-head-wrapper-right .vg-profile-head {
  display: grid;
  grid-template-columns: 60px 2fr;
}
.vg-container .vg-wrapper .vg-wrapper-right .vg-head-wrapper-right .vg-profile-head .vg-profile {
  background: rgba(210, 231, 61, 0.568627451);
  width: 46px;
  height: 46px;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 500;
  font-size: 15px;
  color: #363636;
}
.vg-container .vg-wrapper .vg-wrapper-right .vg-head-wrapper-right .vg-profile-head .vg-info-profile label {
  white-space: nowrap;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 0;
  line-height: 1;
}
.vg-container .vg-wrapper .vg-wrapper-right .vg-head-wrapper-right .vg-profile-head .vg-info-profile p {
  color: #969696;
  font-size: 14px;
  margin-bottom: 0;
}
.vg-container .vg-wrapper .vg-wrapper-right .vg-content-discu {
  height: calc(95vh - 141px);
}
.vg-container .vg-wrapper .vg-wrapper-right .vg-content-discu ul {
  list-style: none;
  padding: 28px 23px;
  height: 100%;
  overflow-y: scroll;
}
.vg-container .vg-wrapper .vg-wrapper-right .vg-content-discu ul li .vg-row-discu {
  display: grid;
  grid-template-columns: 38px 21vw;
}
.vg-container .vg-wrapper .vg-wrapper-right .vg-content-discu ul li .vg-row-discu .vg-content-message {
  padding: 8px 16px;
  background: #ffffff;
  margin: 0 10px;
  font-size: 14px;
  border-radius: 7px;
  color: rgba(37, 38, 94, 0.6588235294);
  box-shadow: 0 0 18px -12px rgba(0, 0, 0, 0.2196078431);
}
.vg-container .vg-wrapper .vg-wrapper-right .vg-content-discu ul li .vg-row-discu label {
  font-size: 12px;
  float: right;
  margin: 7px 11px;
  color: #44a085;
}
.vg-container .vg-wrapper .vg-wrapper-right .vg-content-discu ul li .vg-user-message {
  font-size: 16px;
  background: #ffffff;
  text-align: center;
  color: rgba(37, 38, 94, 0.5411764706);
  padding: 6.3px 0;
  border-radius: 100%;
  height: fit-content;
}
.vg-container .vg-wrapper .vg-wrapper-right .vg-content-discu ul li.vg-outbound-api {
  display: flex;
  justify-content: end;
}
.vg-container .vg-wrapper .vg-wrapper-right .vg-content-discu ul li.vg-outbound-api .vg-user-message {
  background: #0C0C53;
  color: white;
}
.vg-container .vg-wrapper .vg-wrapper-right .vg-content-discu ul li.vg-outbound-api .vg-content-message {
  background: #0C0C53;
  color: white;
}
.vg-container .vg-wrapper .vg-wrapper-right .vg-footer-action {
  background: white;
  display: grid;
  grid-template-columns: 2fr 65px;
  width: 100%;
  height: 69px;
}
.vg-container .vg-wrapper .vg-wrapper-right .vg-footer-action .btn-send-sms {
  background: #0C0C53;
  border-color: #0C0C53;
  height: 35px;
  width: 35px;
  border-radius: 50%;
  color: #fff;
  padding: 0;
  margin-left: 16px;
}
.vg-container .vg-wrapper .vg-wrapper-right .vg-action-discu #sendNotif,
.vg-container .vg-wrapper .vg-wrapper-right .vg-action-discu #sendNotifGrp {
  position: absolute;
  /* background: red; */
  width: 100%;
  height: 18px;
  top: -32px;
  display: flex;
}
.vg-container .vg-wrapper .vg-wrapper-right .vg-action-discu #sendNotif .vg-send-loading,
.vg-container .vg-wrapper .vg-wrapper-right .vg-action-discu #sendNotifGrp .vg-send-loading {
  position: relative;
  left: 50%;
}
.vg-container .vg-wrapper .vg-wrapper-right .vg-action-discu #sendNotif .vg-send-success,
.vg-container .vg-wrapper .vg-wrapper-right .vg-action-discu #sendNotif .vg-send-error,
.vg-container .vg-wrapper .vg-wrapper-right .vg-action-discu #sendNotifGrp .vg-send-success,
.vg-container .vg-wrapper .vg-wrapper-right .vg-action-discu #sendNotifGrp .vg-send-error {
  top: -19px;
  position: relative;
}

x .vg-title-section {
  color: var(--secondary-color);
  font-size: 16px;
  margin: 0;
}
x .vg-title-section .vg-title {
  color: #2f2fc2 !important;
  font-size: 30px !important;
}

.vg-section-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
  margin-top: 4px;
}
.vg-section-title .vg-title {
  color: #2f2fc2 !important;
  margin: 0;
  text-wrap: nowrap;
}
.vg-section-title span {
  width: 178px;
  font-size: 14px;
  color: #2f2fc2;
  font-weight: bolder;
}

.vg-btn-icon {
  background: #f5f5f1;
  font-size: 12px;
}

.vg-section-list {
  padding: 0;
  list-style: none;
  margin-top: 9px;
  height: 70vh;
  overflow-y: scroll;
}
.vg-section-list li.vg-list {
  position: relative;
  padding: 11px 20px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.0392156863);
  overflow: hidden;
}
.vg-section-list li.vg-list:hover {
  cursor: pointer;
  background: rgba(68, 203, 163, 0.1215686275);
  transition: 0.4s;
  border-bottom: 1px solid transparent !important;
}
.vg-section-list li.vg-list .vg-list-content {
  display: flex;
  gap: 13px;
  align-items: center;
}
.vg-section-list li.vg-list .vg-list-content .vg-profile {
  background: rgba(210, 231, 61, 0.568627451);
  width: 46px;
  height: 46px;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 500;
  font-size: 15px;
  color: #363636;
}
.vg-section-list li.vg-list .vg-list-content .vg-info-profile label {
  white-space: nowrap;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 0;
  line-height: 1;
}
.vg-section-list li.vg-list .vg-list-content .vg-info-profile p {
  white-space: nowrap;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  overflow: hidden;
  margin-bottom: 0;
  color: #969696;
  font-size: 14px;
}
.vg-section-list li.vg-list .vg-list-content .vg-count-sms {
  height: fit-content;
}

.vg-list .ico-inbound-sms {
  position: absolute;
  right: -3px;
  top: -16px;
  transform: rotate(-45deg);
  background: #0eae0f;
  padding: 14px 5px;
  color: #fff;
  font-size: 13px;
}
.vg-list .ico-outbound-sms {
  position: absolute;
  right: -3px;
  top: -16px;
  transform: rotate(-45deg);
  background: rgba(228, 167, 14, 0.6784313725);
  padding: 14px 5px;
  color: #fff;
  font-size: 13px;
}

.vg-search {
  display: grid;
  grid-template-columns: 39px 2fr;
  padding-bottom: 23px;
  padding-top: 23px;
}
.vg-search i {
  background-color: #f5f5f1;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #25265e;
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
}
.vg-search input {
  font-size: 14px;
  padding: 5px 13px;
  background: rgba(235, 235, 235, 0.3215686275);
  border: 1px solid #f7f6f6;
}
.vg-search input::placeholder {
  color: #b0b0b0;
}

.search {
  position: relative;
}
.search i.fa.fa-search {
  position: absolute;
  top: 8px;
  right: 10px;
}
.search input {
  background: #f5f5f1;
  padding: 5px 19px 8px 43px;
  border-radius: 9px;
  border: none;
  width: 24vw;
}

.vg-tab-sms {
  display: grid;
  grid-template-columns: 2fr 2fr;
  text-align: center;
  box-shadow: 0 4px 13px -9px rgba(0, 0, 0, 0.2196078431);
}
.vg-tab-sms .vg-inbox-sms,
.vg-tab-sms .vg-send-sms {
  font-size: 14px;
  padding: 5px 0;
  background: #fff;
}
.vg-tab-sms .vg-inbox-sms:hover,
.vg-tab-sms .vg-send-sms:hover {
  color: white !important;
  background: #2d9c7b !important;
}
.vg-tab-sms .vg-inbox-sms.m-active,
.vg-tab-sms .vg-send-sms.m-active {
  background: #ebebeb !important;
  color: #25265e !important;
  font-size: 14px;
}

.vg-modal .modal-header {
  background: #25265e;
  padding: 8px 20px;
  color: #fff;
}
.vg-modal .modal-header h5 {
  font-size: 14px;
}
.vg-modal .modal-header .btn-close {
  background: #44cba3;
  color: #fff !important;
  opacity: 1;
  position: relative;
  right: -51px;
  top: 0px;
}
.vg-modal .modal-header .btn-close i {
  position: relative;
  top: -4px;
}
.vg-modal .modal-body {
  padding: 25px 20px 15px !important;
}
.vg-modal .modal-footer {
  justify-content: space-between !important;
}
.vg-modal .modal-footer button {
  font-size: 12px;
}

.vg-form input {
  border: none;
  border-bottom: 1px solid rgba(37, 38, 94, 0.3411764706);
  padding: 3px 10px 9px;
  font-size: 14px;
  width: 100%;
}
.vg-form input:focus {
  color: #212529;
  background-color: #fff;
  border-color: transparent;
  outline: 0;
  box-shadow: none;
  border-bottom: 1px solid #44cba3;
}
.vg-form .vg-form-group {
  display: block;
  position: relative;
  margin: 40px 0px;
}
.vg-form .form-txt {
  position: absolute;
  top: -36px;
  padding: 10px 0;
  font-size: 14px;
  transition: ease 0.3s;
}
.vg-form .form-group-active {
  top: -32px;
}

label.form-label {
  color: rgba(37, 38, 94, 0.6392156863);
  font-size: 14px;
  margin-bottom: 0;
  margin-top: 13px;
}

.vg-btn-flottant {
  position: fixed;
  background: #2f2fc9;
  z-index: 6;
  right: 0;
  width: 36px;
  padding: 4px 2px 9px 0px;
  top: 38vh;
  border-top-left-radius: 11px;
  border-bottom-left-radius: 11px;
}
.vg-btn-flottant a {
  color: #fff;
  padding: 0px 0 0 10px;
}
.vg-btn-flottant:hover {
  background: #25265e;
}

.width-btn-number-call-live {
  max-width: 45px;
  max-height: 45px;
  width: 45px;
  height: 45px;
  display: flex;
  justify-content: center;
  padding: 9px;
  font-size: 14px;
  border: 1px solid #ffffff;
  color: #8a8a8a;
  margin: 10px;
  background: #ededed;
  border-radius: 3.3rem;
}

.width-btn-number-call-live:hover {
  background-color: #3d63fe;
  color: white;
  border: 1px solid #3d63fe;
}

#modal-02 {
  position: fixed !important;
  width: 100%;
  height: 100%;
  right: 0px !important;
  left: inherit !important;
  background-color: rgba(0, 0, 0, 0.2) !important;
  overflow-y: auto;
  z-index: 9999;
  opacity: 1;
  animation-duration: 0.6s;
  box-shadow: 0 0 44px -3px rgba(255, 255, 255, 0.44);
  bottom: 0 !important;
  top: auto !important;
  border-radius: 0;
  bottom: 0 !important;
  top: auto !important;
}
#modal-02 .content-modal {
  width: 360px;
  margin-left: auto;
  height: 100%;
  background-color: #fff;
}
#modal-02 .modal-content {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  pointer-events: auto;
  background-color: #fff;
  background-clip: padding-box;
  border: 0;
  border-radius: 0.3rem;
  outline: 0;
  justify-content: center;
}
#modal-02 #btn-close-modal {
  width: 30px;
  background: #ffffff;
  padding: 1px 4px 1px 8px;
  color: #ec363b;
  position: absolute;
  right: 26px;
  z-index: 1;
  border-radius: 18px;
  top: 28px;
  border: 2px solid #ec363b;
}
#modal-02 #btn-close-modal:hover {
  opacity: 0.7;
  cursor: pointer;
  transition: 0.4s;
  color: #fff;
  background: #ec363b;
}
#modal-02 .width-btn-number {
  max-width: 45px;
  max-height: 45px;
  width: 45px;
  height: 45px;
  display: flex;
  justify-content: center;
  padding: 9px;
  font-size: 14px;
  color: #8a8a8a;
  margin: 15px 18px;
  background: #ededed;
  box-shadow: none !important;
  border-radius: 35px;
  font-family: "SfprodRegular", sans-serif;
}
#modal-02 .width-btn-number:hover {
  background-color: rgba(38, 199, 126, 0.3019607843);
  color: #188e58;
  border: 1px solid rgba(8, 8, 32, 0);
}
#modal-02 .delete-btn,
#modal-02 #start-call {
  box-shadow: none !important;
}
#modal-02 .delete-btn {
  background: rgba(255, 0, 0, 0.1294117647);
}
#modal-02 .delete-btn i {
  font-size: 22px;
  color: #ff512e;
}

.vg-content-new-sms i {
  background: #44cba3;
  border-color: #44cba3;
  height: 56px;
  width: 58px;
  border-radius: 50%;
  color: #fff;
  padding: 0;
  margin-left: 16px;
  padding: 16px;
  font-size: 22px;
  opacity: 0.7;
}

.form-control:disabled {
  background-color: rgba(37, 38, 94, 0.0392156863) !important;
  border: 1px solid #e4e4e4 !important;
  color: rgba(37, 38, 94, 0.5411764706) !important;
}

#sendNotif,
#sendNotifGrp {
  width: 100%;
  font-size: 12px;
}

.vg-send-success {
  background-color: rgba(38, 168, 42, 0.1803921569);
  padding: 8px 11px;
  width: 100%;
  border-radius: 6px;
  text-align: -webkit-left;
}

.vg-send-error {
  background-color: rgba(255, 34, 34, 0.18);
  padding: 8px 11px;
  width: 100%;
  border-radius: 6px;
  text-align: -webkit-left;
}

.vg-send-loading {
  position: relative;
  top: -1px;
  margin: 20px 0;
  text-align: center;
  display: flex;
  justify-content: center;
  left: -23px;
}

.vg-show-hide-column,
.vg-popup-call {
  display: none;
}

.vg-section-compte,
.vg-section-config-profile,
.vg-section-config-voice-recording,
.vg-section-reset-pass {
  opacity: 1;
  background: white;
  padding: 21px 33px;
}
.vg-section-compte h5,
.vg-section-config-profile h5,
.vg-section-config-voice-recording h5,
.vg-section-reset-pass h5 {
  font-size: 16px;
  color: #0C0C53;
  /* background: rgb(37 38 94 / 1%); */
  padding: 9px 0;
  margin: 0 0 12px;
}
.vg-section-compte .vg-form,
.vg-section-config-profile .vg-form,
.vg-section-config-voice-recording .vg-form,
.vg-section-reset-pass .vg-form {
  padding: 14px 26px;
  border-radius: 7px;
}

.vg-section-compte {
  height: 82vh;
}

.vg-section-config-profile {
  height: 82vh;
}
.vg-section-config-profile .vg-form-contact {
  display: flex;
  align-items: center;
  gap: 45px;
}
.vg-section-config-profile .vg-form-contact .fa-user {
  font-size: 15vw;
  color: #efefef;
  border: 1px solid #efefef;
  padding: 30px 33px;
}
.vg-section-config-profile .vg-form-contact .right-profile {
  width: 100% !important;
}

.vg-section-config-voice-recording {
  height: 82vh;
}

p.dateSent {
  font-size: 12px !important;
  margin-bottom: 0 !important;
  text-align: end !important;
  color: #c6c2c2 !important;
}

.text-message {
  margin-bottom: 0 !important;
  background: #fdfdfd !important;
  border: 1px solid #e3e3e3 !important;
  height: 100% !important;
}

.vg-footer-action #sendNotif,
.vg-footer-action #sendNotifGrp {
  position: relative;
  top: 0;
}
.vg-footer-action #sendNotif .vg-send-loading,
.vg-footer-action #sendNotifGrp .vg-send-loading {
  position: relative;
  top: -24px;
  width: 100%;
  margin: auto;
  left: 0;
  top: -23px;
}
.vg-footer-action .vg-send-success {
  background-color: rgba(38, 168, 42, 0.1803921569);
  padding: 8px 11px;
  width: 100%;
  border-radius: 6px;
  text-align: -webkit-left;
  width: 172px;
  text-align: center;
  margin: auto;
}

.overlay-params {
  position: absolute;
  z-index: 999;
  width: 100%;
  height: 100vh;
  background: rgba(0, 0, 0, 0.4117647059);
}
.overlay-params .config-account-overlay {
  /* position: relative;
  // top: 32%;
  top: 17%;
  left: 6%; */
  position: relative;
  top: 25%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.overlay-params .config-account-overlay img {
  width: 100px;
}
.overlay-params .config-account-overlay p.content {
  background: white;
  width: 600px;
  padding: 20px 22px;
  border-radius: 35px;
  -webkit-border-radius: 35px;
  -moz-border-radius: 35px;
  -ms-border-radius: 35px;
  -o-border-radius: 35px;
}
.overlay-params .config-account-overlay p.content span {
  color: #0C0C53;
}
.overlay-params .config-account-overlay p.content label {
  padding-bottom: 11px;
  font-size: 14px;
}

.act-section {
  filter: none;
  pointer-events: all;
}

/**
* Notif SMS incoming
*/
/**
* STYLE NOTIF
*/
#notification-sms {
  position: fixed;
  bottom: 5px;
  right: 15px;
  z-index: 9999;
  overflow-y: auto;
  max-height: 90%;
  padding: 20px;
}
#notification-sms .head-message {
  background: #56cca8;
  padding: 6px 15px;
  display: flex;
  justify-content: space-between;
}
#notification-sms .head-message .txt-success {
  color: white;
  font-size: 14px;
}
#notification-sms .head-message button {
  border: none;
  background: transparent;
  margin: 0;
  position: relative;
  right: -8px;
  color: #fff;
  padding: 5px 9px 0;
  box-shadow: none;
}
#notification-sms .head-message button:hover {
  cursor: pointer;
  color: #25265e;
  transition: 0.4s;
}

#notification-sms .notif-message {
  background-color: rgb(8, 8, 32);
  width: 500px;
  bottom: 12px;
  box-shadow: 0 0 128px 98px rgba(215, 215, 215, 0.2196078431);
  border-radius: 20px;
  padding: 0;
  margin-bottom: -2px;
  z-index: 2;
  position: relative;
  overflow: hidden;
}

.notif-message .new-message {
  display: flex;
  padding: 12px 13px 14px;
  background: transparent;
}

.notif-message .new-message .sym-sms i.in-sms {
  top: -28px !important;
}

.notif-message .new-message .about {
  width: 100%;
  padding: 0 26px;
}

.notif-message .new-message .status {
  font-size: 16px;
  font-weight: 500;
}

.notif-message .new-message .dateIn {
  color: #343434;
  width: 100%;
  /* border-top: 1px solid #e9e9e9; */
  /* padding: 7px 9px 0 0; */
  /* display: flex; */
  /* justify-content: end; */
  /* align-items: baseline; */
  position: absolute;
  top: 3px;
  z-index: 1;
  right: 6px;
  text-align: end;
}

.notif-message .new-message .dateIn button {
  background: rgba(42, 42, 42, 0);
  border: 0px;
  color: #fff;
  padding: 5px 3px 5px !important;
  border-radius: 100%;
  font-size: 22px;
}

.notif-message .new-message .dateIn button:hover {
  transition: 0.4s;
  cursor: pointer;
  /* background: #aa639f;*/
}

.body-notif p {
  color: #fff;
  font-size: 12px;
}

.header-notification {
  position: relative;
}

.badge-cust {
  position: absolute;
  top: -8px;
  color: white;
  background: red;
  left: 25px;
}

.header-notification:hover {
  cursor: pointer;
}

.header-notification {
  padding: 0 13px;
}

.vg-action-recording h5 {
  margin: 0 !important;
}

.form-check-input:checked {
  background-color: #2c9c7b;
  border-color: #2c9c7b;
}

.lab {
  font-family: "NexaBold", sans-serif;
  color: #2e2fc8;
  font-size: 14px;
}

.date-filter {
  background: #f5f5f1;
  color: #060606;
  padding: 7px 21px;
  color: #818080;
  border: 1px solid #e8e8e8;
  margin-left: 19px;
}

.mb {
  margin-bottom: 34px;
}

.vg-lab-user {
  font-size: 12px;
  color: #000122;
  font-family: "NexaBold", sans-serif;
  margin-right: 49px;
}

.vg-table-content {
  height: calc(100% - 200px) !important;
  transition: 0.5;
}

.dataTables_length,
.dataTables_filter {
  position: fixed;
  z-index: 999;
  bottom: 1.6rem;
  font-size: 14px;
}
.dataTables_length label,
.dataTables_filter label {
  display: flex !important;
  gap: 21px;
}

.dataTables_filter {
  display: none;
}

div#table_contact_wrapper,
div#table_member_wrapper,
div#table_groupe_wrapper,
div#table_status_wrapper,
div#table_priorite_wrapper,
div#table_sentiment_wrapper,
div#table_sentiment_wrapper,
div#table_contact_team_wrapper {
  height: calc(100% - 1px) !important;
  overflow-x: auto;
}

div#table_member_wrapper {
  height: 53vh;
}

table th,
table td {
  white-space: nowrap;
}

#table_contact_filter,
#table_groupe_filter {
  display: none;
}

table#table_contact,
table#table_member,
table#table_groupe,
table#table_status,
table#table_priorite,
table#table_sentiment,
table#table_contact_team {
  min-width: 100%;
  width: auto !important;
}
table#table_contact thead,
table#table_member thead,
table#table_groupe thead,
table#table_status thead,
table#table_priorite thead,
table#table_sentiment thead,
table#table_contact_team thead {
  top: 0;
  background-color: #f5f5f1 !important;
  position: sticky;
  top: 0;
  z-index: 4;
}
table#table_contact thead tr,
table#table_member thead tr,
table#table_groupe thead tr,
table#table_status thead tr,
table#table_priorite thead tr,
table#table_sentiment thead tr,
table#table_contact_team thead tr {
  box-shadow: 0 10px 12px -14px rgba(0, 0, 0, 0.231372549);
}
table#table_contact thead tr th,
table#table_member thead tr th,
table#table_groupe thead tr th,
table#table_status thead tr th,
table#table_priorite thead tr th,
table#table_sentiment thead tr th,
table#table_contact_team thead tr th {
  padding: 10px 28px 9px !important;
  font-size: 10px;
  letter-spacing: 2px;
  font-weight: 400 !important;
  border-bottom: none !important;
  border-bottom: none !important;
}
table#table_contact thead tr th.sticky-2,
table#table_member thead tr th.sticky-2,
table#table_groupe thead tr th.sticky-2,
table#table_status thead tr th.sticky-2,
table#table_priorite thead tr th.sticky-2,
table#table_sentiment thead tr th.sticky-2,
table#table_contact_team thead tr th.sticky-2 {
  padding: 10px 28px 9px 20px !important;
}
table#table_contact thead tr th.th-action-table,
table#table_member thead tr th.th-action-table,
table#table_groupe thead tr th.th-action-table,
table#table_status thead tr th.th-action-table,
table#table_priorite thead tr th.th-action-table,
table#table_sentiment thead tr th.th-action-table,
table#table_contact_team thead tr th.th-action-table {
  width: 284px !important;
}
table#table_contact tbody tr td,
table#table_member tbody tr td,
table#table_groupe tbody tr td,
table#table_status tbody tr td,
table#table_priorite tbody tr td,
table#table_sentiment tbody tr td,
table#table_contact_team tbody tr td {
  padding: 3px 18px;
  font-size: 12px;
  border: none !important;
  box-shadow: none !important;
  min-height: 20px;
}
table#table_contact tbody tr td .arrow-down,
table#table_member tbody tr td .arrow-down,
table#table_groupe tbody tr td .arrow-down,
table#table_status tbody tr td .arrow-down,
table#table_priorite tbody tr td .arrow-down,
table#table_sentiment tbody tr td .arrow-down,
table#table_contact_team tbody tr td .arrow-down {
  color: #2f2fc2;
  font-size: 7px;
  position: relative;
  left: 5px;
}
table#table_contact tbody tr td .no-td-data,
table#table_member tbody tr td .no-td-data,
table#table_groupe tbody tr td .no-td-data,
table#table_status tbody tr td .no-td-data,
table#table_priorite tbody tr td .no-td-data,
table#table_sentiment tbody tr td .no-td-data,
table#table_contact_team tbody tr td .no-td-data {
  color: #2f2fc2 !important;
  font-size: 13px;
  font-weight: bold;
}
table#table_contact tbody tr td .no-td-data .arrow-down,
table#table_member tbody tr td .no-td-data .arrow-down,
table#table_groupe tbody tr td .no-td-data .arrow-down,
table#table_status tbody tr td .no-td-data .arrow-down,
table#table_priorite tbody tr td .no-td-data .arrow-down,
table#table_sentiment tbody tr td .no-td-data .arrow-down,
table#table_contact_team tbody tr td .no-td-data .arrow-down {
  font-size: 7px;
  position: relative;
  left: 5px;
}
table#table_contact tbody tr td .td-data-warning,
table#table_member tbody tr td .td-data-warning,
table#table_groupe tbody tr td .td-data-warning,
table#table_status tbody tr td .td-data-warning,
table#table_priorite tbody tr td .td-data-warning,
table#table_sentiment tbody tr td .td-data-warning,
table#table_contact_team tbody tr td .td-data-warning {
  color: #fb8e00 !important;
  font-size: 12px;
}
table#table_contact tbody tr td.action-table,
table#table_member tbody tr td.action-table,
table#table_groupe tbody tr td.action-table,
table#table_status tbody tr td.action-table,
table#table_priorite tbody tr td.action-table,
table#table_sentiment tbody tr td.action-table,
table#table_contact_team tbody tr td.action-table {
  box-shadow: none !important;
  display: table-cell;
  align-items: center;
  height: 100%;
  width: auto !important;
}
table#table_contact tbody tr td.action-table .action-group,
table#table_member tbody tr td.action-table .action-group,
table#table_groupe tbody tr td.action-table .action-group,
table#table_status tbody tr td.action-table .action-group,
table#table_priorite tbody tr td.action-table .action-group,
table#table_sentiment tbody tr td.action-table .action-group,
table#table_contact_team tbody tr td.action-table .action-group {
  display: flex;
  gap: 10px;
  width: 100%;
}
table#table_contact tbody tr td.action-table .action-group .td-share-contact,
table#table_member tbody tr td.action-table .action-group .td-share-contact,
table#table_groupe tbody tr td.action-table .action-group .td-share-contact,
table#table_status tbody tr td.action-table .action-group .td-share-contact,
table#table_priorite tbody tr td.action-table .action-group .td-share-contact,
table#table_sentiment tbody tr td.action-table .action-group .td-share-contact,
table#table_contact_team tbody tr td.action-table .action-group .td-share-contact {
  background: #6565c9 !important;
  color: white;
  padding: 0 12px !important;
  border-radius: 100% !important;
}
table#table_contact tbody tr:hover,
table#table_member tbody tr:hover,
table#table_groupe tbody tr:hover,
table#table_status tbody tr:hover,
table#table_priorite tbody tr:hover,
table#table_sentiment tbody tr:hover,
table#table_contact_team tbody tr:hover {
  transition: 0.4s;
  cursor: pointer;
}

table#table_groupe thead,
table#table_status thead,
table#table_sentiment thead,
table#table_priorite thead {
  top: 0;
  background-color: #fff;
}
table#table_groupe thead tr,
table#table_status thead tr,
table#table_sentiment thead tr,
table#table_priorite thead tr {
  box-shadow: 0 10px 12px -14px rgba(0, 0, 0, 0.231372549);
}
table#table_groupe thead tr th,
table#table_status thead tr th,
table#table_sentiment thead tr th,
table#table_priorite thead tr th {
  padding: 10px 28px 9px !important;
  font-size: 12px;
  letter-spacing: 2px;
  font-weight: 400 !important;
  border-bottom: none !important;
}
table#table_groupe tbody tr td,
table#table_status tbody tr td,
table#table_sentiment tbody tr td,
table#table_priorite tbody tr td {
  padding: 14px 27px 15px !important;
  font-size: 12px;
  border: none !important;
  box-shadow: none !important;
}
table#table_groupe tbody tr td.action-table,
table#table_status tbody tr td.action-table,
table#table_sentiment tbody tr td.action-table,
table#table_priorite tbody tr td.action-table {
  box-shadow: none !important;
}

div#table_contact_info,
div#table_call_history_info,
div#table_member_info,
div#table_groupe_info,
div#table_status_info,
div#table_priorite_info,
div#table_sentiment_info,
div#table_contact_team_info {
  display: none;
}

div#table_contact_paginate,
div#table_call_history_paginate,
div#table_member_paginate,
div#table_groupe_paginate,
div#table_status_paginate,
div#table_priorite_paginate,
div#table_sentiment_paginate,
div#table_contact_team_paginate {
  position: fixed;
  z-index: 999;
  bottom: 1.3rem;
  right: 37px;
}

div.dataTables_paginate.paging_simple_numbers span a.paginate_button {
  background: red !important;
  background: #ffffff !important;
  border-radius: 24px !important;
  padding-bottom: 5px !important;
  box-shadow: 0 0 14px -9px black;
  margin: 0 7px;
  font-size: 14px;
}
div.dataTables_paginate.paging_simple_numbers span a.paginate_button:hover {
  background: rgba(48, 50, 200, 0.2196078431) !important;
  color: #3032c8 !important;
  border: 1px solid rgba(48, 50, 200, 0.168627451);
  cursor: pointer;
  transition: 0.4s;
}
div.dataTables_paginate.paging_simple_numbers span a.paginate_button.current {
  background: #2f32c8 !important;
  color: #fff !important;
  border-radius: 24px !important;
  padding: 4px 10px 1px !important;
  position: relative;
  top: 3px;
}
div.dataTables_paginate.paging_simple_numbers a#table_contact_previous.paginate_button,
div.dataTables_paginate.paging_simple_numbers a#table_contact_next,
div.dataTables_paginate.paging_simple_numbers a#table_call_history_previous.paginate_button,
div.dataTables_paginate.paging_simple_numbers a#table_call_history_next,
div.dataTables_paginate.paging_simple_numbers div#table_member_next,
div.dataTables_paginate.paging_simple_numbers div#table_member_previous.paginate_button,
div.dataTables_paginate.paging_simple_numbers div.table_groupe_next,
div.dataTables_paginate.paging_simple_numbers div#table_groupe_previous.paginate_button,
div.dataTables_paginate.paging_simple_numbers div.table_status_next,
div.dataTables_paginate.paging_simple_numbers div#table_status_previous.paginate_button,
div.dataTables_paginate.paging_simple_numbers div.table_priorite_next,
div.dataTables_paginate.paging_simple_numbers div#table_priorite_previous.paginate_button,
div.dataTables_paginate.paging_simple_numbers div.table_status_next,
div.dataTables_paginate.paging_simple_numbers div#table_status_previous.paginate_button,
div.dataTables_paginate.paging_simple_numbers div.table_sentiment_next,
div.dataTables_paginate.paging_simple_numbers div#table_sentiment_previous.paginate_button,
div.dataTables_paginate.paging_simple_numbers div#table_contact_team_previous.paginate_button,
div.dataTables_paginate.paging_simple_numbers div#table_contact_team_next {
  font-size: 14px;
  border-radius: 24px !important;
  background: #fcfcfc !important;
}
div.dataTables_paginate.paging_simple_numbers a#table_contact_previous.paginate_button:hover,
div.dataTables_paginate.paging_simple_numbers a#table_contact_next:hover,
div.dataTables_paginate.paging_simple_numbers a#table_call_history_previous.paginate_button:hover,
div.dataTables_paginate.paging_simple_numbers a#table_call_history_next:hover,
div.dataTables_paginate.paging_simple_numbers div#table_member_next:hover,
div.dataTables_paginate.paging_simple_numbers div#table_member_previous.paginate_button:hover,
div.dataTables_paginate.paging_simple_numbers div.table_groupe_next:hover,
div.dataTables_paginate.paging_simple_numbers div#table_groupe_previous.paginate_button:hover,
div.dataTables_paginate.paging_simple_numbers div.table_status_next:hover,
div.dataTables_paginate.paging_simple_numbers div#table_status_previous.paginate_button:hover,
div.dataTables_paginate.paging_simple_numbers div.table_priorite_next:hover,
div.dataTables_paginate.paging_simple_numbers div#table_priorite_previous.paginate_button:hover,
div.dataTables_paginate.paging_simple_numbers div.table_status_next:hover,
div.dataTables_paginate.paging_simple_numbers div#table_status_previous.paginate_button:hover,
div.dataTables_paginate.paging_simple_numbers div.table_sentiment_next:hover,
div.dataTables_paginate.paging_simple_numbers div#table_sentiment_previous.paginate_button:hover,
div.dataTables_paginate.paging_simple_numbers div#table_contact_team_previous.paginate_button:hover,
div.dataTables_paginate.paging_simple_numbers div#table_contact_team_next:hover {
  background: transparent !important;
  color: #3032c8 !important;
  cursor: pointer;
  transition: 0.4s;
  border: 1px solid rgba(48, 50, 200, 0.168627451);
}

.dataTables_empty {
  font-size: 12px;
  color: #b0b0b0;
  display: table-cell;
  padding: 3% 0 !important;
  background-color: white !important;
  font-size: 14px;
}

.action-title {
  display: flex;
  align-items: center;
  gap: 26px;
}

button.export-file {
  background: #099b1d;
  color: #ffffff;
}
button.export-file:hover {
  transition: 0.4;
  cursor: pointer;
  opacity: 0.7;
}

button.vg-btn-grey:hover {
  transition: 0.4;
  cursor: pointer;
  opacity: 0.7;
}

button {
  font-weight: 500;
  padding: 5px 28px;
  border-radius: 6px;
  font-size: 14px;
  box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.0588235294);
}

.g-button {
  display: flex;
  gap: 17px;
  margin: 0 0 23px;
  justify-content: flex-start;
}

.m-right {
  margin-right: 17px !important;
}

.l-space {
  font-size: 14px;
  letter-spacing: 1.5px;
}
.l-space:hover {
  cursor: pointer;
  opacity: 0.7;
}

.input-filter-cust {
  background-color: #f5f5f1;
  border: none;
  font-size: 14px;
}

#table_call_history {
  border-collapse: separate;
  border-spacing: 20px;
  border-bottom: 0px solid transparent !important;
}
#table_call_history thead {
  display: none;
}
#table_call_history tr td {
  font-family: "SfprodRegular", sans-serif;
  background: white !important;
  box-shadow: none;
  border-top: 0px solid transparent !important;
  border-bottom: 0px solid transparent !important;
  line-height: normal;
}
#table_call_history tr td span,
#table_call_history tr td label {
  font-family: "SfprodRegular", sans-serif !important;
}
#table_call_history tr td span {
  color: #939393;
}
#table_call_history tr td span i {
  color: #ec363b;
}

.call-profile-list label {
  font-size: 14px;
  color: #363333;
  font-weight: 500;
}
.call-profile-list span {
  font-size: 12px;
}

td.call-status-history {
  border-left: 1px solid #eaeaea !important;
  padding-left: 30px !important;
}
td.call-status-history label {
  font-size: 14px;
  color: #363333;
  font-weight: 500;
}
td.call-status-history span {
  font-size: 12px;
}
td.call-status-history span.missed {
  color: #ec363b !important;
}
td.call-status-history span.completed {
  color: #24bf7a !important;
}

td.call-time-history {
  border-left: 1px solid #eaeaea !important;
  padding-left: 30px !important;
}
td.call-time-history span {
  font-size: 12px;
  font-weight: 500;
}
td.call-time-history span i {
  color: #363333 !important;
}

td.call-to-history {
  border-left: 1px solid #eaeaea !important;
  padding-left: 30px !important;
}
td.call-to-history span,
td.call-to-history label {
  font-size: 12px;
}
td.call-to-history label {
  color: #2f2fc2;
  font-weight: 500;
}

#table_call_history_wrapper {
  height: calc(100vh - 278px);
  overflow-x: scroll;
}

.bg-input {
  background-color: #f5f5f1;
}

svg.w-svg g path {
  fill: #fff !important;
}

button:hover {
  opacity: 0.7;
  cursor: pointer;
}

#checkboxCount {
  color: #ec363b;
  font-size: 14px;
  position: relative;
  top: 3px;
}

th.checkbox.sticky-1,
td.checkbox.sticky-1 {
  width: 20px !important;
  background-color: #f4f9ff !important;
  text-align: center !important;
}

th.checkbox.sticky-1.col-check {
  width: 0px !important;
}

.my-notes {
  padding: 1rem 0 1rem !important;
}
.my-notes .status-note {
  width: 8px;
  height: 8px;
  background-color: #24bf7a;
  border-radius: 100%;
  position: relative;
  top: 4px;
}
.my-notes .day-note {
  font-size: 12px;
  width: 50%;
  color: #939393;
}
.my-notes .edit {
  background: #acb5b2;
  padding: 1px 7px;
  border-radius: 27px;
}
.my-notes .delete {
  background: #ec363b;
  padding: 1px 3px;
  border-radius: 27px;
}
.my-notes .head-note {
  display: flex;
  gap: 5px;
  margin-top: 12px;
}
.my-notes .content-note {
  font-size: 12px !important;
  margin: 6px 0 21px !important;
  line-height: 1.3;
}
.my-notes .note-footer {
  justify-content: initial !important;
  gap: 5px;
  color: #6565c9;
  font-family: "SfprodRegular", sans-serif !important;
}
.my-notes .album-details {
  padding: 4px 20px !important;
}
.my-notes .album-details p {
  font-size: 14px;
  margin-top: 12px;
}
.my-notes .album-item {
  height: 300px !important;
  margin-bottom: 0 !important;
}

.the-note h6 {
  color: #2f2fc2;
  font-size: 14px;
  margin-bottom: 4px;
  margin-top: 6px;
}
.the-note #album-rotator-holder {
  height: auto !important;
}

.sort-by {
  width: 163px;
  display: flex;
  align-items: baseline;
  position: relative;
}
.sort-by i {
  position: absolute;
  right: 12px;
  top: 7px;
  z-index: -1;
}
.sort-by select {
  background-color: rgba(245, 245, 241, 0);
}
.sort-by select:focus {
  outline: none;
  box-shadow: none !important;
  background-color: transparent;
}
.sort-by span {
  width: 103px;
}

.switch {
  position: relative;
  display: inline-block;
  width: 34px;
  height: 20px;
  top: 4px;
  margin-right: 26px !important;
  /* Rounded sliders */
}
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}
.switch .slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: -12px;
  bottom: 0;
  background-color: #ec363b;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.switch .slider::before {
  position: absolute;
  content: "";
  height: 12px;
  width: 12px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.switch input:checked + .slider {
  background-color: #24bf7a;
}
.switch input:focus + .slider {
  box-shadow: 0 0 1px #24bf7a;
}
.switch input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}
.switch .slider.round {
  border-radius: 34px;
}
.switch .slider.round:before {
  border-radius: 50%;
}

.dsp-none {
  display: none !important;
}

.count {
  background-color: red;
  color: white;
  border: none;
  border-radius: 20px;
  position: relative;
  left: 72px;
  padding: 3px 7px 0px 7px;
  font-size: 12px;
  width: 11px;
}

table {
  border-bottom: 0px solid rgba(0, 0, 0, 0.3) !important;
}
table tbody tr.even {
  background: #fff !important;
  border: 1px solid #eeecec;
  border-left: none;
  border-right: none;
}
table tbody tr.odd {
  background: #fbfbfb !important;
}
table tbody td {
  background: transparent !important;
  border-top: 0px solid transparent !important;
}
table tbody td.td-action {
  padding-top: 12px !important;
  padding-bottom: 9px !important;
}
table tbody td .td-ico-call svg {
  width: 14px;
}
table tbody td .td-ico-sms svg {
  width: 18px;
  position: relative;
  top: 3px;
}
table tbody td .td-ico-lkd svg {
  width: 16px;
}

.bg-success {
  background-color: transparent !important;
  padding: 5px 12px 5px !important;
  color: #099b1d;
  border-radius: 12px;
  font-size: 12px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.bg-danger {
  background-color: transparent !important;
  padding: 5px 12px 5px !important;
  color: #ec363b;
  border-radius: 12px;
  font-size: 12px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.bg-warning {
  background-color: transparent !important;
  padding: 5px 12px 3px !important;
  color: #fb8e00;
  border-radius: 12px;
  font-size: 12px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.bg-primary {
  background-color: transparent !important;
  padding: 5px 12px 3px !important;
  color: #2f2fc2;
  border-radius: 12px;
  font-size: 12px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.bg-red {
  background-color: transparent !important;
  color: red;
  padding: 5px 12px 3px !important;
  border-radius: 12px;
  font-size: 12px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.bg-orange {
  background-color: transparent !important;
  color: orange;
  padding: 5px 12px 3px !important;
  border-radius: 12px;
  font-size: 12px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.bg-yellow {
  background-color: transparent;
  color: yellow;
  padding: 5px 12px 3px !important;
  border-radius: 12px;
  font-size: 12px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.bg-green {
  background-color: transparent !important;
  color: green;
  padding: 5px 12px 3px !important;
  border-radius: 12px;
  font-size: 12px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.bg-blue {
  background-color: transparent !important;
  color: blue;
  padding: 5px 12px 3px !important;
  border-radius: 12px;
  font-size: 12px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.bg-indigo {
  background-color: transparent !important;
  color: indigo;
  padding: 5px 12px 3px !important;
  border-radius: 12px;
  font-size: 12px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.bg-purple {
  background-color: transparent !important;
  color: purple;
  padding: 5px 12px 3px !important;
  border-radius: 12px;
  font-size: 12px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#sendNotifAnswer {
  position: absolute;
  bottom: 12vh !important;
  text-align: -webkit-center !important;
  left: 4vh;
}
#sendNotifAnswer .vg-send-loading {
  top: 0;
  margin: 0 !important;
  left: 0 !important;
  width: 45px;
  font-size: 12px !important;
  color: #1c8d5b !important;
  background: white;
  height: 41px;
  border-radius: 12px;
}
#sendNotifAnswer .vg-send-loading .lds-ring {
  left: -20px;
  position: relative;
}
#sendNotifAnswer .vg-send-success {
  top: 0 !important;
  margin: 0 !important;
  left: 0 !important;
  width: fit-content !important;
  font-size: 12px !important;
  color: #1c8d5b !important;
  background-color: #fff !important;
}
#sendNotifAnswer .vg-send-error {
  font-size: 12px !important;
  color: #b40b0b !important;
  background-color: #fff !important;
}

.tab-new-sms {
  display: flex;
  gap: 12px;
}
.tab-new-sms .sms-single:hover,
.tab-new-sms .sms-group:hover {
  cursor: pointer;
  transition: 0.4s;
  color: #24bf7a !important;
}

.r-btn {
  padding: 7px 13px 5px;
  text-decoration: none;
  font-size: 14px;
  border-radius: 3px;
}

.tab-menu {
  background: none;
  box-shadow: none;
  padding: 0;
  margin-right: 13px;
}
.tab-menu.btn-active {
  border-bottom: 2px solid #dc3545 !important;
  color: #0C0C53 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none;
  padding-bottom: 8px;
}

#numberList li {
  list-style: none;
}
#numberList b {
  font-size: 12px;
}

table.dataTable.display > tbody > tr.odd > * {
  box-shadow: none !important;
}

.btn-cst {
  background-color: #24bf7a;
  color: #fff;
  padding: 6px 16px 4px;
}

.ui-tooltip {
  padding: 6px 20px !important;
  border-radius: 20px !important;
  font-size: 12px !important;
  box-shadow: inset 0 0 15px 0px rgba(0, 0, 0, 0.11) !important;
  border: 1px solid rgba(0, 0, 0, 0.111) !important;
  max-width: 200px !important;
}

td .bg-warning {
  white-space: nowrap;
}

.label-note-GRP {
  background: #ffc008;
  padding: 4px 12px 2px;
  font-size: 12px !important;
  color: #fff !important;
  border-radius: 14px;
  margin-top: 17px;
}

.btn-active {
  background: #2f2fc2 !important;
  color: #fff !important;
}

.select-act {
  margin: -7px 0 14px !important;
}

.vg-section-pass {
  height: 65vh;
  overflow-x: auto;
}

.badge-notif {
  position: absolute;
  right: -12px;
  top: 9px;
}

.badge-notif-sms,
.badge-notif-call {
  background-color: #dc3545 !important;
  padding: 3px 7px 0;
  color: #fff;
  font-size: 12px;
  border-radius: 10px;
}

.dt-note {
  display: flex;
  justify-content: space-between;
  margin-top: 12px;
}

.pr-note {
  color: #1c1e4f;
}

#modalNoteContact #description_note {
  font-size: 14px;
  background: rgba(239, 221, 147, 0.1490196078);
  padding: 17px 19px;
  border-radius: 12px;
  margin: 16px 0 20px;
}
#modalNoteContact .note-footer {
  position: relative;
}
#modalNoteContact .note-footer i {
  color: #45cbe7 !important;
  margin-right: 10px !important;
}
#modalNoteContact .st-note {
  width: 10px;
  height: 10px;
  background: #31bf23;
  position: absolute;
  top: 8px;
  border-radius: 15px;
}

#modalViewNote #view_note_description {
  font-size: 14px;
  background: rgba(239, 221, 147, 0.1490196078);
  padding: 17px 19px;
  border-radius: 12px;
  margin: 16px 0 20px;
}
#modalViewNote .note-footer {
  position: relative;
}
#modalViewNote .note-footer i {
  color: #45cbe7 !important;
  margin-right: 10px !important;
}
#modalViewNote .st-note {
  width: 10px;
  height: 10px;
  background: #31bf23;
  position: absolute;
  top: 8px;
  border-radius: 15px;
}

.placeholder_input_table {
  height: 26px;
  background-color: #f8f8f8;
  border-radius: 14px;
  padding-left: 10px;
}

/*Style boutton dataTable visible column*/
.dt-buttons {
  height: auto;
}
.dt-buttons .dt-button {
  background-color: #2f2fc2;
  border-radius: 20px;
  color: white;
}

.dt-button:hover {
  background-color: #2f2fc2;
  color: white;
}

/* Styles pour le bouton ColVis */
.buttons-colvis {
  background-color: #007bff; /* Couleur de fond */
  color: #fff; /* Couleur du texte */
  border: none; /* Supprimez la bordure */
  border-radius: 4px; /* Coins arrondis */
  padding: 5px 10px; /* Espacement intérieur */
  cursor: pointer; /* Curseur au survol */
}

/* Styles pour le menu de sélection des colonnes */
.DTTT_dropdown {
  background-color: #fff; /* Couleur de fond */
  border: 1px solid #ddd; /* Bordure */
  border-radius: 4px; /* Coins arrondis */
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); /* Ombre */
}

.DTTT_dropdown a {
  color: #333; /* Couleur du texte */
  text-decoration: none; /* Supprimez la décoration du texte */
  display: block; /* Afficher en tant que bloc */
  padding: 5px 15px; /* Espacement intérieur */
}

.DTTT_dropdown a:hover {
  background-color: #007bff; /* Couleur de fond au survol */
  color: #ae2424; /* Couleur du texte au survol */
}

.border-radius {
  border-radius: 20px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  -o-border-radius: 20px;
}

.fieldset {
  border: none;
}

#table_guideMe {
  display: flex;
  justify-content: space-around;
  width: 100%;
}

.sidebar-transition {
  /* .vg-grid{
    display: inline-block;
    .grid-col{
        margin-top: 10px;
    }
  }*/
}
.sidebar-transition .logo-twif {
  display: block;
}
.sidebar-transition .vg-logo {
  display: none;
}
.sidebar-transition .rs-title {
  font-size: 21px;
}
.sidebar-transition .side-nav {
  transition: 0.5s;
  z-index: 999;
  min-width: 56px !important;
  width: 56px !important;
}
.sidebar-transition .side-nav .vg-menu {
  padding: 0 0px;
}
.sidebar-transition .side-nav ul {
  height: auto !important;
}
.sidebar-transition .side-nav ul li {
  padding: 11px 0 6px 0 !important;
}
.sidebar-transition .side-nav ul li label {
  display: none;
}
.sidebar-transition .side-nav ul li .badge-notif {
  position: absolute;
  right: 0;
  top: -3px;
}
.sidebar-transition .vg-wrapper {
  width: 96.6%;
  transition: 0.5s;
}
.sidebar-transition .vg-grid {
  grid-template-rows: 161px !important;
}
.sidebar-transition .vg-grid .grid-col {
  height: 162px !important;
}
.sidebar-transition .vg-guide {
  display: flex;
  justify-content: center;
}
.sidebar-transition .vg-version {
  font-size: 9px;
}
.sidebar-transition #language-select {
  font-size: 14px;
  padding: 6px;
}
.sidebar-transition .select2-search {
  display: none;
}
.sidebar-transition .show-search-icon .select2-search {
  display: block;
}
.sidebar-transition .select2-container--open .select2-dropdown {
  max-height: 200px;
}

.rtc-wrapper {
  overflow-x: initial;
  position: initial;
}

#historiqueFiltre {
  display: flex;
  align-items: center;
  gap: 5px;
  flex-wrap: wrap;
}
#historiqueFiltre .tag {
  padding: 5px 12px 3px !important;
  color: black;
  border-radius: 12px;
  font-size: 10px;
  background-color: #c2e7ff !important;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.returnButton {
  transform: rotate(-90deg);
}

#album-rotator-profileNote {
  width: 100%;
  float: left;
  /* white-space: nowrap; */
  /* white-space-collapse: collapse; */
  /* text-wrap: nowrap; */
  /* overflow: scroll; */
  position: relative;
  word-break: keep-all;
  height: 54vh;
  padding: 1rem 0 2rem;
  overflow-y: scroll;
}
#album-rotator-profileNote #album-rotator-holder {
  display: flex;
  flex-wrap: wrap;
  gap: 25px;
}
#album-rotator-profileNote .album-item {
  margin: 0;
}

.btn-note-menu-contact {
  background-color: rgb(102, 201, 232);
  color: #fff;
  padding: 4px 10px 0;
}

.btn-call .bg-light {
  color: black;
  background-color: #eaeaea !important;
  font-size: 10px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 5px 10px !important;
}

.btn-sms .bg-light {
  color: black;
  background-color: #eaeaea !important;
  font-size: 10px;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 5px 10px !important;
}

/* Largeur de la barre de défilement */
::-webkit-scrollbar {
  width: 8px; /* pour les navigateurs Webkit (Chrome, Safari, etc.) */
}

::-webkit-scrollbar-horizontal {
  width: 8px; /* Hauteur de la barre de défilement horizontale */
}

/* Piste de la barre de défilement (arrière-plan) */
::-webkit-scrollbar-track {
  background: #f1f1f1; /* couleur d'arrière-plan de la piste */
}

/* Curseur de la barre de défilement (la partie que vous faites glisser) */
::-webkit-scrollbar-thumb {
  background: rgba(5, 5, 5, 0.168627451);
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
}

/* Lorsque vous survolez la barre de défilement */
::-webkit-scrollbar-thumb:hover {
  background: #555; /* couleur du curseur en survol */
}

::-webkit-scrollbar:horizontal {
  height: 8px;
}

::-webkit-scrollbar-thumb:horizontal {
  background: rgba(5, 5, 5, 0.168627451);
  border-radius: 10px;
}

table#table_contact th,
table#table_contact_team th {
  border-left: none;
  border-right: solid;
  border-width: 2px;
  border-top: none;
  border-color: #eaeaea;
}

table#table_contact,
table#table_member,
table#table_groupe,
table#table_status,
table#table_priorite,
table#table_sentiment,
table#table_contact_team {
  min-width: 100%;
  width: auto !important;
}
table#table_contact th,
table#table_member th,
table#table_groupe th,
table#table_status th,
table#table_priorite th,
table#table_sentiment th,
table#table_contact_team th {
  text-align: center;
}

#columnFilter {
  display: flex;
  gap: 5px;
}

.vg-form input[type=radio] {
  width: initial !important;
}

.filter-tag {
  padding: 5px 12px 3px !important;
  color: black;
  border-radius: 12px;
  font-size: 10px;
  background-color: #c2e7ff !important;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.filter-tag-red {
  padding: 5px 12px 3px !important;
  color: #f5504e;
  border-radius: 12px;
  font-size: 10px;
  background-color: #ffe6e6 !important;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border: 1px solid #f5504e;
}

.filter-tag-green {
  padding: 5px 12px 3px !important;
  color: #2c7a7b;
  border-radius: 12px;
  font-size: 10px;
  background-color: #e6fffa !important;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border: 1px solid #2c7a7b;
}

div#table_contact_wrapper {
  width: auto !important;
  overflow-y: unset;
  overflow-x: scroll;
}

.domain-expansion {
  position: relative;
  translate: 0px 6px;
  background: white;
  z-index: 9;
  font-size: 12px;
  border-radius: 20px;
}

.rtc-wrapper {
  height: 100%;
}

.select2 {
  width: 100% !important;
}

/*.btn-filter-details {
  color: $purpleColor;
  background-color: $white-color;
  border-color: #e6e6e6;
  box-shadow: none;
  font-size: 14px;
  padding: 7px 13px 4px;
  position: relative;
  top: -3px;
} */
.btn-filter-details {
  color: #2f2fc2;
  background-color: #fff;
  border-color: #e6e6e6;
  box-shadow: none;
  font-size: 12px;
  padding: 7px 13px 4px;
  position: relative;
}

.btn-filter-details:hover {
  opacity: 0.8;
  cursor: pointer;
  transition: 0.4s;
  -webkit-transition: 0.4s;
  -moz-transition: 0.4s;
  -ms-transition: 0.4s;
  -o-transition: 0.4s;
}

svg.add {
  width: 16px;
  height: auto;
  position: relative;
  top: -1px;
  margin-right: 10px;
}
svg.add circle,
svg.add path {
  stroke: #3d63fe;
}

.dropdown-item {
  font-size: 12px;
}

.help_ {
  box-shadow: none;
  padding: 0;
  color: #383857;
  transform: translate(5px, -2px);
}

.divider {
  background: #aeadad;
  border-top: 0;
  margin: 27px 0 20px;
}

.divider-sous-menu {
  background: #aeadad;
  border-top: 0;
  margin: 15px 0;
}

.dr-rt {
  background: #fff;
  height: 100%;
  width: 350px;
  position: fixed;
  top: 0;
  z-index: 1059;
  right: -400px;
  transition: 0.5s;
  box-shadow: -9px 0 17px -3px rgba(0, 0, 0, 0.07);
  border-right: 1px solid #d6d6d6;
}
.dr-rt .p-v {
  padding: 0 20px !important;
}
.dr-rt.showDr {
  transition: 0.5s;
  right: 0;
}
.dr-rt.showDr2 {
  right: calc(100% - 500px);
  transition: 0.7s;
}
.dr-rt .dr-head-action-rt {
  display: flex;
  flex-direction: column;
  gap: 7px;
  position: absolute;
  top: 14px;
  left: -38px;
}
.dr-rt .dr-head-action-rt button {
  padding: 0;
  width: 35px;
  height: 34px;
  padding-top: 4px;
  border-radius: 100%;
  background: #fff;
}
.dr-rt .dr-head-rt h2 {
  padding: 24px 0 0px;
  font-size: 16px;
  font-weight: 500;
}
.dr-rt .dr-content-rt .dr-user-info {
  display: flex;
  gap: 12px;
  margin-bottom: 19px;
  margin-top: 17px;
}
.dr-rt .dr-content-rt .dr-avatar {
  background: #2f2fc2;
  width: fit-content;
  padding: 13px 13px 0px;
  border-radius: 5px;
  color: #fff;
}
.dr-rt .dr-content-rt .dr-info .dr-name {
  font-weight: 500;
  font-size: 15px;
}
.dr-rt .dr-content-rt .dr-info .dr-info-phone {
  color: #aeadad;
  font-size: 15px;
}
.dr-rt .dr-content-rt .dr-user {
  font-size: 12px;
  border: 1px solid #e6e6e6;
  padding: 7px 8px;
  color: #ec363b;
  border-radius: 5px;
}
.dr-rt .dr-content-rt .dr-mail {
  font-size: 12px;
  border: 1px solid #e6e6e6;
  padding: 7px 8px;
  color: #ec363b;
  margin-left: 4px;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
}
.dr-rt .dr-content-rt .dr-mail-disabled {
  font-size: 12px;
  border: 1px solid #e6e6e6;
  padding: 7px 8px;
  color: #bababa;
  border-radius: 5px;
  margin-left: 4px;
}
.dr-rt .dr-content-rt .dr-linkedin {
  font-size: 12px;
  border: 1px solid #e6e6e6;
  padding: 6px 8px 5px;
  color: #3d63fe;
  border-radius: 5px;
  margin-left: 4px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
}
.dr-rt .dr-content-rt .dr-linkedin-disabled {
  font-size: 15px;
  border: 1px solid #e6e6e6;
  padding: 6px 8px 5px;
  color: #bababa;
  border-radius: 5px;
}
.dr-rt .dr-content-rt .dr-phone {
  font-size: 12px;
  border: 1px solid #e6e6e6;
  padding: 9px 8px 5px;
  color: #099b1d;
  border-radius: 5px;
  position: relative;
  top: 2px;
}
.dr-rt .dr-content-rt .dr-sms {
  font-size: 12px;
  border: 1px solid #e6e6e6;
  padding: 9px 2px 5px 6px;
  color: #0C0C53;
  border-radius: 5px;
  position: relative;
  top: 2px;
  margin-left: 4px;
}
.dr-rt .dr-content-rt .dr-book {
  font-size: 12px;
  border: 1px solid #e6e6e6;
  padding: 9px 10px 5px;
  margin-left: 4px;
  color: #fb8e00;
  border-radius: 5px;
  position: relative;
  top: 2px;
}
.dr-rt .dr-content-rt .dr-other-action {
  margin-bottom: 25px;
}
.dr-rt .dr-content-rt .dr-other-action span:hover {
  background: #f3f3ff;
  cursor: pointer;
  transition: 0.4s;
}
.dr-rt .dr-content ul {
  padding: 0;
  list-style: none;
}
.dr-rt .dr-content ul li {
  margin-bottom: 10px;
}
.dr-rt .dr-content ul li p {
  margin: 0;
  font-size: 14px;
}
.dr-rt .dr-content ul li .label {
  color: #000;
}
.dr-rt .dr-content ul li input {
  color: #888888;
  font-size: 14px;
  width: 84%;
  padding: 6px 0;
}
.dr-rt .dr-content ul li .in-edit:hover .fa-pen {
  opacity: 1;
  background: #efefff;
  cursor: pointer;
  transition: 0.4s;
}
.dr-rt .dr-content ul li .in-edit:hover .fa-phone {
  opacity: 1;
  background: #efefff;
  cursor: pointer;
  transition: 0.4s;
}
.dr-rt .dr-content ul li .fa-pen {
  opacity: 0;
  font-size: 12px;
  color: #2f2fc2;
  padding: 7px 8px;
  border-radius: 5px;
}
.dr-rt .dr-content ul li .fa-phone {
  opacity: 0;
  font-size: 12px;
  color: #099b1d;
  padding: 7px 8px;
  border-radius: 5px;
}
.dr-rt .dr-content .update-button {
  display: flex;
  justify-content: center;
}
.dr-rt .dr-content .update-button button {
  border: 1px solid #2f2fc2;
  background: transparent;
  color: #0c0c53;
  border: 1px solid #2f2fc2;
  width: fit-content;
  padding: 8px 20px 5px;
  font-size: 12px;
  margin: 13px 0px 42px;
}

.dr-rt-other {
  position: fixed;
  background: #fff;
  top: 0;
  z-index: 9899;
  height: 100%;
  width: calc(100% - 500px);
  right: calc(100% - 168in);
  transition: 0.2s;
  box-shadow: 0 0 11px -3px rgba(0, 0, 0, 0.2588235294);
  padding: 0;
}
.dr-rt-other.showDrOther {
  transition: 0.5s;
  right: 0;
}
.dr-rt-other .dr-head-rt h2 {
  padding: 24px 0 0px;
  font-size: 16px;
  font-weight: 500;
}
.dr-rt-other .dr-filter-rt {
  background: #F5F9FA;
  padding: 7px 17px;
  display: flex;
  align-items: baseline;
  gap: 18px;
  justify-content: space-between;
}
.dr-rt-other .dr-filter-rt i {
  color: #aeadad;
}
.dr-rt-other .dr-filter-rt div {
  display: flex;
  align-items: baseline;
}
.dr-rt-other .info-tab {
  margin-top: 21px;
  padding: 0;
}
.dr-rt-other .info-tab li {
  list-style: none;
  display: inline;
  padding: 16px;
  font-size: 14px;
  color: #aeadad;
}
.dr-rt-other .info-tab li.active {
  position: initial;
  border-bottom: 2px solid #dc3545;
  color: #000;
}
.dr-rt-other .info-tab li:hover {
  cursor: pointer;
  color: #2f2fc2;
  transition: 0.4s;
}
.dr-rt-other .dr-content-timeline ul li {
  list-style: none;
  display: inline;
}

.dr-content-timeline {
  padding: 16px 0;
  height: calc(100% - 134px) !important;
  overflow-y: scroll;
}
.dr-content-timeline ul {
  padding: 0 30px;
}
.dr-content-timeline ul .tm-history {
  position: relative;
}
.dr-content-timeline ul .tm-history i.icon-call-status {
  background: #099b1d;
  color: #fff;
}
.dr-content-timeline ul .tm-history i.ico-in {
  background: #3d63fe;
  color: #fff;
}
.dr-content-timeline ul .tm-history i.icon-call-no-answer {
  background: #ec363b;
  color: #fff;
}
.dr-content-timeline ul .tm-history i.icon-call {
  background: #3d63fe;
  color: #fff;
}
.dr-content-timeline ul .tm-history i.icon-book {
  background: #fb8e00;
  color: #fff;
}
.dr-content-timeline ul .tm-history i.icon-no-book {
  background: #d5d5d5;
  color: #5b5b5b;
}
.dr-content-timeline ul .tm-history i.icon-edit {
  background: #fb8e00;
  color: #fff;
}
.dr-content-timeline ul .tm-history i.icon-delete {
  background: #ec363b;
  color: #fff;
}
.dr-content-timeline ul .tm-history i.fa-phone-slash {
  background: #ec363b;
  color: #fff !important;
}
.dr-content-timeline ul .tm-history .tm-ico {
  /*  position: absolute;
    left: -13px;
    top: 18px;*/
}
.dr-content-timeline ul .tm-call-activity i {
  background: #099b1d;
  color: #fff;
}
.dr-content-timeline ul .tm-linkedin i {
  background: #3d63fe;
  color: #fff;
}
.dr-content-timeline ul .tm-sms i {
  background: #2f2fc2;
  color: #fff;
}
.dr-content-timeline ul .tm-prospect i {
  background: #5968a2;
  color: #fff;
}
.dr-content-timeline ul .tm-edit i {
  background: #fb8e00;
  color: #fff;
}
.dr-content-timeline ul li.tm-note i {
  background: #fb8e00;
  color: #fff;
}
.dr-content-timeline ul li {
  position: relative;
}
.dr-content-timeline ul li i.icon-edit {
  background: #fb8e00;
  color: #fff;
}
.dr-content-timeline ul li i.icon-delete {
  background: #ec363b;
  color: #fff;
}
.dr-content-timeline ul .tm-call {
  position: relative;
}
.dr-content-timeline ul .tm-call i.icon-call-status {
  background: #099b1d;
  color: #fff;
}
.dr-content-timeline ul .tm-call i.ico-in {
  background: #3d63fe;
  color: #fff;
}
.dr-content-timeline ul .tm-call i.icon-call-no-answer {
  background: #ec363b;
  color: #fff;
}
.dr-content-timeline ul .tm-call i.icon-call {
  background: #3d63fe;
  color: #fff;
}
.dr-content-timeline ul .tm-call i.icon-book {
  background: #fb8e00;
  color: #fff;
}
.dr-content-timeline ul .tm-call i.icon-no-book {
  background: #d5d5d5;
  color: #5b5b5b;
}
.dr-content-timeline ul .tm-call i.icon-edit {
  background: #fb8e00;
  color: #fff;
}
.dr-content-timeline ul .tm-call i.icon-delete {
  background: #ec363b;
  color: #fff;
}
.dr-content-timeline ul .tm-call i.fa-phone-slash {
  padding: 7px 6px;
  border-radius: 23px;
  background: #ec363b;
  color: #fff !important;
}
.dr-content-timeline ul .tm-call .tm-ico {
  position: absolute;
  left: -13px;
  top: 18px;
}
.dr-content-timeline ul li {
  align-items: start;
  padding-bottom: 19px;
  border-left: 1px solid #ebebeb;
}
.dr-content-timeline ul li i {
  /*padding: 7px;
  font-size: 12px;
  border-radius: 23px;
  */
  padding: 6px;
  font-size: 8px;
  border-radius: 30px;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  -ms-border-radius: 30px;
  -o-border-radius: 30px;
}
.dr-content-timeline ul li i.time {
  background: transparent !important;
  color: #aeadad;
}
.dr-content-timeline ul li .tm-content {
  position: relative;
  left: 30px;
  width: 96% !important;
}
.dr-content-timeline ul li .tm-content .sect-call-list {
  margin-left: auto;
  width: 100%;
}
.dr-content-timeline ul li .tm-content .action-list-dr {
  display: flex;
  width: auto;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}
.dr-content-timeline ul li .tm-content p {
  font-size: 12px;
  margin: 0;
}
.dr-content-timeline ul li .tm-content p b {
  color: #3d63fe;
}
.dr-content-timeline ul li .tm-content .tm-date {
  font-size: 12px;
  position: relative;
  left: -5px;
}
.dr-content-timeline ul li .tm-content .tm-date .time-call {
  color: #000;
}
.dr-content-timeline ul li .tm-content i.tm-ico {
  position: absolute;
  left: -25px;
}
.dr-content-timeline ul li .tm-ico {
  transform: translate(-9px, 17px);
}

.dr-content-timeline-sms {
  padding: 16px 0;
  height: calc(100% - 134px) !important;
  overflow-y: scroll;
}
.dr-content-timeline-sms ul {
  padding: 0 30px;
}
.dr-content-timeline-sms ul li.tm-sms i {
  background: #2f2fc2;
  color: #fff;
}
.dr-content-timeline-sms ul li.tm-note i {
  background: #fb8e00;
  color: #fff;
}
.dr-content-timeline-sms ul li i.icon-edit {
  background: #fb8e00;
  color: #fff;
}
.dr-content-timeline-sms ul li i.icon-delete {
  background: #ec363b;
  color: #fff;
}
.dr-content-timeline-sms ul li.tm-call-in i.icon-call-status {
  background: #099b1d;
  color: #fff;
}
.dr-content-timeline-sms ul li.tm-call-in i.icon-call-no-answer {
  background: #ec363b;
  color: #fff;
}
.dr-content-timeline-sms ul li.tm-call-in i.icon-call {
  background: #3d63fe;
  color: #fff;
}
.dr-content-timeline-sms ul li.tm-call-in i.icon-book {
  background: #fb8e00;
  color: #fff;
}
.dr-content-timeline-sms ul li.tm-call-in i.icon-no-book {
  background: #f5f5f1;
  color: #000;
}
.dr-content-timeline-sms ul li.tm-call-in i.icon-edit {
  background: #fb8e00;
  color: #fff;
}
.dr-content-timeline-sms ul li.tm-call-in i.icon-delete {
  background: #ec363b;
  color: #fff;
}
.dr-content-timeline-sms ul li.tm-call-out i.icon-call-status {
  background: #3d63fe;
  color: #fff;
}
.dr-content-timeline-sms ul li.tm-call-out i.icon-call {
  background: #3d63fe;
  color: #fff;
}
.dr-content-timeline-sms ul li.tm-call-out i.icon-edit {
  background: #fb8e00;
  color: #fff;
}
.dr-content-timeline-sms ul li.tm-call-out i.icon-book {
  background: #fb8e00;
  color: #fff;
}
.dr-content-timeline-sms ul li.tm-call-out i.icon-no-book {
  background: #f5f5f1;
  color: #000;
}
.dr-content-timeline-sms ul li.tm-call-out i.icon-delete {
  background: #ec363b;
  color: #fff;
}
.dr-content-timeline-sms ul li {
  display: flex !important;
  align-items: start;
  padding-bottom: 19px;
}
.dr-content-timeline-sms ul li i {
  padding: 7px;
  font-size: 12px;
  border-radius: 23px;
}
.dr-content-timeline-sms ul li .tm-ico {
  position: relative;
  left: -13px;
}
.dr-content-timeline-sms ul li i.time {
  background: transparent !important;
  color: #aeadad;
}
.dr-content-timeline-sms ul li .tm-content p {
  font-size: 14px;
  margin: 0;
}
.dr-content-timeline-sms ul li .tm-content p b {
  color: #3d63fe;
}
.dr-content-timeline-sms ul li .tm-content .tm-date {
  font-size: 12px;
  position: relative;
  left: -5px;
}

.new-form {
  position: relative;
  left: 13px;
}
.new-form .tm-ico {
  position: absolute;
  left: -40px;
}

.sticky-1,
.sticky-odd-1 {
  position: sticky !important;
  left: 0px;
  z-index: 3;
  background: #e4edf9;
  margin-right: 10px;
}

.sticky-2,
.sticky-even-2 {
  position: sticky !important;
  left: 0;
  background: #f5f5f1;
  z-index: 3;
  text-align: start !important;
  margin-right: 10px;
}

th.sticky-2,
td.sticky-2 {
  left: 71px !important;
  background-color: #f4f9ff !important;
}

.sticky-odd-1 {
  background: #fff !important;
}

.sticky-even-2 {
  background: #f8f8f8 !important;
}

.rtc-handle-container {
  width: auto;
  overflow-x: auto;
}

#table_contact_wrapper {
  overflow-x: auto !important;
}

.filter-tab {
  padding-left: 0;
  display: block;
  margin: 0 0 12px;
  padding-top: -9px;
  position: relative;
  top: -8px;
  font-size: 14px;
}

.dr-action-active {
  background-color: #3d63fe;
  color: white;
}

.action-boutton-content-volet {
  display: flex;
  width: auto;
  justify-content: space-between;
  align-items: center;
}

.update-button-standard {
  margin-top: 4px;
  display: flex;
  justify-content: center;
}
.update-button-standard button.edit {
  margin-left: 4px;
  margin-right: 4px;
  background-color: #3d63fe;
  color: white;
}
.update-button-standard button.delete {
  margin-left: 4px;
  margin-right: 4px;
  background-color: #ec363b;
  color: white;
}

.status-completed {
  color: #099b1d;
}

.status-no-answer {
  color: #ec363b;
}

.status-busy {
  color: #ec363b;
}

.status-refused {
  color: #ec363b;
}

/*-------------------- CSS Dropdown dans la liste contact -------------------*/
.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #ffffff;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
}

.dropdown-content p {
  color: #000000;
  text-decoration: none;
  padding: 1px 16px;
  display: block;
}

.dropdown-content p:hover {
  background-color: #f5f5f5;
}

.dropdown:hover .dropdown-content {
  display: block;
}

.btn-call-standard {
  background-color: #24bf7a;
  color: #fff;
  padding: 3px 5px;
  border-radius: 23px;
}

.btn-standard-update {
  background-color: #3d63fe;
  color: white;
}

.vg-table-content #list-member {
  height: calc(100vh - 312px) !important;
}

.dropdown-toggle {
  cursor: pointer;
}

.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  border-radius: 0.25rem;
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

.dropdown-menu.show {
  display: block;
}

.dropdown-item {
  padding: 0.25rem 1rem;
  color: #212529;
  text-decoration: none;
  transition: all 0.2s ease-in-out;
}

.dropdown-item:hover {
  background-color: #f8f9fa;
}

.input-invalid {
  border: 1px solid #ec363b !important;
}

#list-sentiment {
  height: calc(100% - 105px) !important;
}
#list-sentiment table tbody tr td {
  max-height: 30px;
  min-height: 30px !important;
  height: 30px;
  padding: 0 !important;
}

#list-history {
  height: calc(100vh - 315px) !important;
}

table#table_member tbody tr td {
  min-height: 45px !important;
}

#show-list-history-team #table_call_history_wrapper {
  height: calc(100vh - 346px);
}

table thead th {
  text-transform: uppercase;
  text-align: left;
}
table thead th span {
  text-align: left;
}

table.align-cust thead th {
  text-align: center !important;
}
table.align-cust thead th span {
  text-align: center !important;
}

.dataTables_length label {
  align-items: center;
}

.pagination-custom-per-page {
  list-style: none;
  display: inline-flex;
  gap: 9px;
}
.pagination-custom-per-page li {
  background: #fff !important;
  color: #878787 !important;
  border-radius: 24px !important;
  padding: 3px 10px 3px !important;
  position: relative;
  top: 3px;
  border: 1px solid #dbdbdf;
  font-size: 14px;
}
.pagination-custom-per-page li:hover {
  cursor: pointer;
  transition: 0.4s;
  background: #2f32c8 !important;
  color: #fff !important;
}
.pagination-custom-per-page li.current {
  background: #2f32c8 !important;
  color: #fff !important;
}

table tr td {
  font-family: "NexaLight", sans-serif;
}

.vg-table-content.custom-table-content {
  transition: 0.5;
  height: calc(100% - 77px) !important;
}
.vg-table-content.custom-table-content .action-table button {
  padding: 3px 6px !important;
  height: fit-content;
}
.vg-table-content.custom-table-content .action-table button svg {
  width: 15px;
  height: 15px;
}
.vg-table-content.custom-table-content .action-table button i {
  font-size: 11px;
}
.vg-table-content.custom-table-content .btn-sms svg {
  width: 13px;
  height: 15px;
}
.vg-table-content.custom-table-content .btn-sms svg {
  width: 13px;
  height: 15px;
}
.vg-table-content.custom-table-content button.btn-note-menu-contact {
  padding: 3px 9px !important;
}
.vg-table-content.custom-table-content tbody tr td {
  padding: 1px 18px !important;
}

.vg-table-content.custom-table-content-reduce.custom-table-content {
  transition: 0.5;
  height: calc(100% - 77px) !important;
}
.vg-table-content.custom-table-content-reduce.custom-table-content .action-table button {
  padding: 6px 6px !important;
  height: fit-content;
}
.vg-table-content.custom-table-content-reduce.custom-table-content .action-table button svg {
  width: 15px;
  height: 15px;
}
.vg-table-content.custom-table-content-reduce.custom-table-content .action-table button i {
  font-size: 11px;
}
.vg-table-content.custom-table-content-reduce.custom-table-content .btn-sms svg {
  width: 13px;
  height: 15px;
}
.vg-table-content.custom-table-content-reduce.custom-table-content .btn-sms svg {
  width: 13px;
  height: 15px;
}
.vg-table-content.custom-table-content-reduce.custom-table-content button.btn-note-menu-contact {
  padding: 6px 9px !important;
}
.vg-table-content.custom-table-content-reduce.custom-table-content tbody tr td {
  padding: 1px 18px !important;
}

/*
* Style loading
*/
.lds-grid {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}

.lds-grid div {
  position: absolute;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #0C0C53;
  animation: lds-grid 1.2s linear infinite;
}

.lds-grid div:nth-child(1) {
  top: 8px;
  left: 8px;
  animation-delay: 0s;
}

.lds-grid div:nth-child(2) {
  top: 8px;
  left: 32px;
  animation-delay: -0.4s;
}

.lds-grid div:nth-child(3) {
  top: 8px;
  left: 56px;
  animation-delay: -0.8s;
}

.lds-grid div:nth-child(4) {
  top: 32px;
  left: 8px;
  animation-delay: -0.4s;
}

.lds-grid div:nth-child(5) {
  top: 32px;
  left: 32px;
  animation-delay: -0.8s;
}

.lds-grid div:nth-child(6) {
  top: 32px;
  left: 56px;
  animation-delay: -1.2s;
}

.lds-grid div:nth-child(7) {
  top: 56px;
  left: 8px;
  animation-delay: -0.8s;
}

.lds-grid div:nth-child(8) {
  top: 56px;
  left: 32px;
  animation-delay: -1.2s;
}

.lds-grid div:nth-child(9) {
  top: 56px;
  left: 56px;
  animation-delay: -1.6s;
}

@keyframes lds-grid {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.2;
  }
}
.vg-loading {
  display: flex;
  justify-content: center;
  align-items: center;
}

.d-contents {
  display: contents !important;
}

/*** *******************$ LOADING SEND SMS *********************/
.lds-ring div {
  box-sizing: border-box;
  display: block;
  position: absolute;
  width: 20px;
  height: 20px;
  margin: 8px;
  border: 3px solid rgb(68, 203, 163);
  border-radius: 50%;
  animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  border-color: rgb(68, 203, 163) transparent transparent transparent;
}

.lds-ring div:nth-child(1) {
  animation-delay: -0.45s;
}

.lds-ring div:nth-child(2) {
  animation-delay: -0.3s;
}

.lds-ring div:nth-child(3) {
  animation-delay: -0.15s;
}

@keyframes lds-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/*
* Loading page global
*/
/* Style pour la page de chargement */
#loading {
  display: none !important;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  z-index: 9999;
  flex-direction: column;
  gap: 19px;
  /* Style pour l'animation de chargement */
}
#loading .loader {
  border: 5px solid #e9e9e9;
  border-top: 5px solid #0C0C53;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  animation: spin 0.8s linear infinite;
}
#loading p {
  color: #8a8a8a;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/* Masquer la page de chargement lorsque la page est entièrement chargée */
#loading.hide {
  display: none;
}

.mediaViewInfo {
  --web-view-name: Twifone_dashboard;
  --web-view-id: Twifone_dashboard;
  --web-scale-on-resize: true;
  --web-enable-deep-linking: true;
}

:root {
  --web-view-ids: Twifone_dashboard;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  border: none;
}

#Twifone_dashboard {
  position: absolute;
  width: 1920px;
  height: 1080px;
  background-color: rgb(255, 255, 255);
  overflow: hidden;
  --web-animation: fadein undefineds undefined;
  --web-action-type: page;
  --web-action-target: Twifone_contact.html;
  cursor: pointer;
  --web-view-name: Twifone_dashboard;
  --web-view-id: Twifone_dashboard;
  --web-scale-on-resize: true;
  --web-enable-deep-linking: true;
}

#navigation {
  position: absolute;
  width: 1660px;
  height: 115px;
  left: 262px;
  top: 0px;
  overflow: visible;
}

#navigation_bx {
  fill: rgb(255, 255, 255);
}

.navigation_bx {
  filter: drop-shadow(5px 3px 6px rgba(0, 0, 0, 0.161));
  position: absolute;
  overflow: visible;
  width: 1678px;
  height: 133px;
  left: 0px;
  top: 0px;
}

#Frame_427322004 {
  fill: rgb(255, 255, 255);
  stroke: rgba(17, 17, 17, 0.102);
  stroke-width: 1px;
  stroke-linejoin: miter;
  stroke-linecap: butt;
  stroke-miterlimit: 4;
  shape-rendering: auto;
}

.Frame_427322004 {
  display: none;
  position: absolute;
  overflow: visible;
  width: 1620.019px;
  height: 100px;
  left: -2.019px;
  top: 2px;
}

#search {
  position: absolute;
  width: 831px;
  height: 44px;
  left: 56px;
  top: 30px;
  overflow: visible;
}

#Frame_427321987 {
  position: absolute;
  width: 831px;
  height: 44px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_427321987_b {
  fill: rgb(245, 245, 240);
}

.Frame_427321987_b {
  filter: drop-shadow(0px 2px 20px rgba(61, 6, 75, 0.102));
  position: absolute;
  overflow: visible;
  width: 891px;
  height: 104px;
  left: 0px;
  top: 0px;
}

#Frame {
  position: absolute;
  width: 20px;
  height: 20px;
  left: 14px;
  top: 12px;
  overflow: visible;
}

#Frame_b {
  fill: transparent;
}

.Frame_b {
  position: absolute;
  overflow: visible;
  width: 20px;
  height: 20px;
  left: 0px;
  top: 0px;
}

#Vector {
  fill: rgb(0, 0, 0);
}

.Vector {
  overflow: visible;
  position: absolute;
  width: 16.268px;
  height: 16.268px;
  left: 1.858px;
  top: 1.858px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Search_something {
  left: 46px;
  top: 13.039px;
  position: absolute;
  overflow: visible;
  width: 772px;
  height: 19px;
  line-height: 19px;
  margin-top: -1.5px;
  text-align: left;
  font-family: SF Pro Display;
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  color: rgba(17, 17, 17, 0.502);
}

#Frame_427321945 {
  position: absolute;
  width: 414px;
  height: 63px;
  left: 1146px;
  top: 23px;
  overflow: visible;
}

#user {
  position: absolute;
  width: 21px;
  height: 21px;
  left: 393px;
  top: 22px;
  overflow: visible;
}

#Frame_ca {
  position: absolute;
  width: 21px;
  height: 21px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_cb {
  fill: transparent;
}

.Frame_cb {
  position: absolute;
  overflow: visible;
  width: 21px;
  height: 21px;
  left: 0px;
  top: 0px;
}

#Vector_ca {
  fill: rgb(48, 48, 48);
}

.Vector_ca {
  overflow: visible;
  position: absolute;
  width: 14.392px;
  height: 7.851px;
  left: 3.271px;
  top: 7.195px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#John_Doe {
  left: 290px;
  top: 24px;
  position: absolute;
  overflow: visible;
  width: 91px;
  white-space: nowrap;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: bold;
  font-size: 20px;
  color: rgb(74, 74, 74);
}

#alexander-hipp-iEEBWgY_6lA-uns {
  position: absolute;
  width: 63px;
  height: 63px;
  left: 213px;
  top: 0px;
  overflow: visible;
}

#Groupe_6 {
  position: absolute;
  width: 180px;
  height: 60px;
  left: 0px;
  top: 2px;
  overflow: visible;
}

#Rectangle_5 {
  fill: rgb(232, 232, 232);
}

.Rectangle_5 {
  position: absolute;
  overflow: visible;
  width: 180px;
  height: 60px;
  left: 0px;
  top: 0px;
}

#ENG {
  left: 77px;
  top: 21px;
  position: absolute;
  overflow: visible;
  width: 43px;
  white-space: nowrap;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: bold;
  font-size: 20px;
  color: rgb(74, 74, 74);
}

#Plan_de_travail_8 {
  position: absolute;
  width: 31px;
  height: 31px;
  left: 24px;
  top: 14px;
  overflow: visible;
}

#Frame_ch {
  position: absolute;
  width: 21px;
  height: 21px;
  left: 131px;
  top: 20px;
  overflow: visible;
}

#Frame_ci {
  fill: transparent;
}

.Frame_ci {
  position: absolute;
  overflow: visible;
  width: 21px;
  height: 21px;
  left: 0px;
  top: 0px;
}

#Vector_cj {
  fill: rgb(48, 48, 48);
}

.Vector_cj {
  overflow: visible;
  position: absolute;
  width: 14.392px;
  height: 7.851px;
  left: 3.271px;
  top: 7.195px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Frame_427322007 {
  position: absolute;
  width: 329px;
  height: 50px;
  left: 325px;
  top: 129.348px;
  overflow: visible;
}

#Frame_427322006 {
  position: absolute;
  width: 329px;
  height: 50px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Call_Analytics {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 330px;
  height: 50px;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: bold;
  font-size: 50px;
  color: rgb(47, 47, 201);
}

#Frame_427322029 {
  width: 100%;
  height: 347.2px;
  overflow: visible;
}

#Frame_427322017 {
  position: absolute;
  width: 218.136px;
  height: 163.602px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_427322017_cp {
  fill: rgb(34, 179, 113);
}

.Frame_427322017_cp {
  overflow: visible;
  position: absolute;
  width: 218.136px;
  height: 163.602px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Frame_427322015 {
  position: absolute;
  width: 179.708px;
  height: 72.944px;
  left: 18px;
  top: 13.292px;
  overflow: visible;
}

#Group_427319782 {
  position: absolute;
  width: 55px;
  height: 54px;
  left: 0px;
  top: 10.708px;
  overflow: visible;
}

#Ellipse_1936 {
  fill: rgb(255, 255, 255);
}

.Ellipse_1936 {
  position: absolute;
  overflow: visible;
  width: 55px;
  height: 54px;
  left: 0px;
  top: 0px;
}

#Frame_ct {
  position: absolute;
  width: 29px;
  height: 29px;
  left: 13px;
  top: 13px;
  overflow: visible;
}

#Frame_cu {
  fill: transparent;
}

.Frame_cu {
  position: absolute;
  overflow: visible;
  width: 29px;
  height: 29px;
  left: 0px;
  top: 0px;
}

#Vector_cv {
  fill: rgb(27, 143, 90);
}

.Vector_cv {
  display: none;
  overflow: visible;
  position: absolute;
  width: 22.722px;
  height: 22.722px;
  left: 3.538px;
  top: 2.083px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#appelentrant {
  position: absolute;
  width: 27.467px;
  height: 26.873px;
  left: 1px;
  top: 1px;
  overflow: visible;
}

#Trac_40 {
  fill: rgb(27, 143, 90);
}

.Trac_40 {
  overflow: visible;
  position: absolute;
  width: 26.334px;
  height: 26.333px;
  left: 0px;
  top: 0.54px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Trac_41 {
  fill: rgb(27, 143, 90);
}

.Trac_41 {
  overflow: visible;
  position: absolute;
  width: 10.222px;
  height: 9.621px;
  left: 17.245px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Frame_427322014 {
  position: absolute;
  width: 105px;
  height: 72.944px;
  left: 74.708px;
  top: 0px;
  overflow: visible;
}

#n_2 {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 106px;
  height: 51px;
  line-height: 71px;
  margin-top: -10.5px;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: bold;
  font-size: 50px;
  color: rgb(255, 255, 255);
}

#Onbound_Calls {
  left: 0px;
  top: 57.944px;
  position: absolute;
  overflow: visible;
  width: 106px;
  height: 15px;
  line-height: 24px;
  margin-top: -5px;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: bold;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.698);
}

#Vector_2172 {
  fill: transparent;
  stroke: rgba(255, 255, 255, 0.149);
  stroke-width: 1px;
  stroke-linejoin: miter;
  stroke-linecap: butt;
  stroke-miterlimit: 4;
  shape-rendering: auto;
}

.Vector_2172 {
  overflow: visible;
  position: absolute;
  width: 181.78px;
  height: 0px;
  transform: translate(0px, 0px) matrix(1, 0, 0, 1, 18.178, 102.4785) rotate(0deg);
  transform-origin: center;
  left: 0px;
  top: 0px;
}

#Frame_427322016 {
  position: absolute;
  width: 181.78px;
  height: 27.267px;
  left: 18.178px;
  top: 121.632px;
  overflow: visible;
}

#Frame_427322018 {
  position: absolute;
  width: 181.78px;
  height: 27.267px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_427322018_c {
  fill: rgb(245, 245, 240);
}

.Frame_427322018_c {
  position: absolute;
  overflow: visible;
  width: 181.78px;
  height: 27.267px;
  left: 0px;
  top: 0px;
}

#AVG_DURATION {
  left: 9.089px;
  top: 7.639px;
  position: absolute;
  overflow: visible;
  width: 165px;
  height: 12px;
  line-height: 18px;
  margin-top: -3px;
  text-align: center;
  font-family: Nexa;
  font-style: normal;
  font-weight: normal;
  font-size: 12px;
  color: rgb(74, 74, 74);
}

#Frame_427322017_c {
  position: absolute;
  width: 218.136px;
  height: 163.602px;
  left: 0px;
  top: 183.598px;
  overflow: visible;
}

#Frame_427322017_da {
  fill: rgb(37, 199, 126);
}

.Frame_427322017_da {
  overflow: visible;
  position: absolute;
  width: 218.136px;
  height: 163.602px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Frame_427322015_c {
  position: absolute;
  width: 179.708px;
  height: 72.944px;
  left: 18px;
  top: 13.292px;
  overflow: visible;
}

#Group_427319782_da {
  position: absolute;
  width: 55px;
  height: 55px;
  left: 0px;
  top: 10.11px;
  overflow: visible;
}

#Ellipse_1936_db {
  fill: rgb(255, 255, 255);
}

.Ellipse_1936_db {
  position: absolute;
  overflow: visible;
  width: 55px;
  height: 55px;
  left: 0px;
  top: 0px;
}

#Frame_dc {
  position: absolute;
  width: 29px;
  height: 29px;
  left: 13px;
  top: 13px;
  display: none;
  overflow: visible;
}

#Frame_dd {
  fill: transparent;
}

.Frame_dd {
  position: absolute;
  overflow: visible;
  width: 29px;
  height: 29px;
  left: 0px;
  top: 0px;
}

#Vector_de {
  fill: rgb(27, 143, 90);
}

.Vector_de {
  overflow: visible;
  position: absolute;
  width: 22.722px;
  height: 22.722px;
  left: 3.538px;
  top: 2.681px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#message {
  fill: rgb(27, 143, 90);
}

.message {
  overflow: visible;
  position: absolute;
  width: 36.596px;
  height: 21.19px;
  left: 9px;
  top: 18px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Frame_427322014_dg {
  position: absolute;
  width: 105px;
  height: 72.944px;
  left: 74.708px;
  top: 0px;
  overflow: visible;
}

#n_2_dh {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 106px;
  height: 51px;
  line-height: 71px;
  margin-top: -10.5px;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: bold;
  font-size: 50px;
  color: rgb(255, 255, 255);
}

#Onbound_Calls_di {
  left: 0px;
  top: 57.944px;
  position: absolute;
  overflow: visible;
  width: 106px;
  height: 15px;
  line-height: 24px;
  margin-top: -5px;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: bold;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.698);
}

#Vector_2172_dj {
  fill: transparent;
  stroke: rgba(255, 255, 255, 0.149);
  stroke-width: 1px;
  stroke-linejoin: miter;
  stroke-linecap: butt;
  stroke-miterlimit: 4;
  shape-rendering: auto;
}

.Vector_2172_dj {
  overflow: visible;
  position: absolute;
  width: 181.78px;
  height: 0px;
  transform: translate(0px, 0px) matrix(1, 0, 0, 1, 18.178, 102.4785) rotate(0deg);
  transform-origin: center;
  left: 0px;
  top: 0px;
}

#Frame_427322016_dk {
  position: absolute;
  width: 181.78px;
  height: 27.267px;
  left: 18.178px;
  top: 121.632px;
  overflow: visible;
}

#Frame_427322018_dl {
  position: absolute;
  width: 181.78px;
  height: 27.267px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_427322018_dm {
  fill: rgb(245, 245, 240);
}

.Frame_427322018_dm {
  position: absolute;
  overflow: visible;
  width: 181.78px;
  height: 27.267px;
  left: 0px;
  top: 0px;
}

#AVG_DURATION_dn {
  left: 9.089px;
  top: 7.639px;
  position: absolute;
  overflow: visible;
  width: 165px;
  height: 12px;
  line-height: 18px;
  margin-top: -3px;
  text-align: center;
  font-family: Nexa;
  font-style: normal;
  font-weight: normal;
  font-size: 12px;
  color: rgb(74, 74, 74);
}

#Frame_427322017_do {
  position: absolute;
  width: 218.136px;
  height: 163.602px;
  left: 236.314px;
  top: 0px;
  overflow: visible;
}

#Frame_427322017_dp {
  fill: rgb(47, 47, 201);
}

.Frame_427322017_dp {
  overflow: visible;
  position: absolute;
  width: 218.136px;
  height: 163.602px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Frame_427322015_dq {
  position: absolute;
  width: 193.204px;
  height: 70.443px;
  left: 17.686px;
  top: 15.793px;
  overflow: visible;
}

#Group_427319782_dr {
  position: absolute;
  width: 55px;
  height: 55px;
  left: 0px;
  top: 2.207px;
  overflow: visible;
}

#Ellipse_1936_ds {
  fill: rgb(255, 255, 255);
}

.Ellipse_1936_ds {
  position: absolute;
  overflow: visible;
  width: 55px;
  height: 55px;
  left: 0px;
  top: 0px;
}

#Frame_dw {
  position: absolute;
  width: 29px;
  height: 29px;
  left: 13px;
  top: 13px;
  display: none;
  overflow: visible;
}

#Frame_dx {
  fill: transparent;
}

.Frame_dx {
  position: absolute;
  overflow: visible;
  width: 29px;
  height: 29px;
  left: 0px;
  top: 0px;
}

#Vector_dy {
  fill: rgb(47, 47, 201);
}

.Vector_dy {
  overflow: visible;
  position: absolute;
  width: 22.722px;
  height: 22.722px;
  left: 3.852px;
  top: 2.63px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Frame_dw {
  position: absolute;
  width: 29px;
  height: 29px;
  left: 13px;
  top: 13px;
  display: none;
  overflow: visible;
}

#Frame_dx {
  fill: transparent;
}

.Frame_dx {
  position: absolute;
  overflow: visible;
  width: 29px;
  height: 29px;
  left: 0px;
  top: 0px;
}

#Vector_dy {
  fill: rgb(47, 47, 201);
}

.Vector_dy {
  overflow: visible;
  position: absolute;
  width: 22.722px;
  height: 22.722px;
  left: 3.852px;
  top: 2.63px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#aoppelsortant {
  position: absolute;
  width: 28.161px;
  height: 27px;
  left: 13px;
  top: 14px;
  overflow: visible;
}

#Trac_42 {
  fill: rgb(47, 47, 201);
}

.Trac_42 {
  overflow: visible;
  position: absolute;
  width: 27.023px;
  height: 27px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Trac_43 {
  fill: rgb(47, 47, 201);
}

.Trac_43 {
  overflow: visible;
  position: absolute;
  width: 10.473px;
  height: 9.857px;
  left: 17.688px;
  top: 1.955px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Frame_427322014_d {
  position: absolute;
  width: 120px;
  height: 70.443px;
  left: 73.204px;
  top: 0px;
  overflow: visible;
}

#n_2_d {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 119px;
  height: 51px;
  line-height: 71px;
  margin-top: -10.5px;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: bold;
  font-size: 50px;
  color: rgb(255, 255, 255);
}

#Onbound_Calls_d {
  left: 0px;
  top: 55.443px;
  position: absolute;
  overflow: visible;
  width: 121px;
  height: 15px;
  line-height: 24px;
  margin-top: -5px;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: bold;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.698);
}

#Vector_2172_d {
  fill: transparent;
  stroke: rgba(255, 255, 255, 0.149);
  stroke-width: 1px;
  stroke-linejoin: miter;
  stroke-linecap: butt;
  stroke-miterlimit: 4;
  shape-rendering: auto;
}

.Vector_2172_d {
  overflow: visible;
  position: absolute;
  width: 181.78px;
  height: 0px;
  transform: translate(0px, 0px) matrix(1, 0, 0, 1, 18.178, 102.7057) rotate(0deg);
  transform-origin: center;
  left: 0px;
  top: 0px;
}

#Frame_427322016_d {
  position: absolute;
  width: 182px;
  height: 27px;
  left: 17.686px;
  top: 122px;
  overflow: visible;
}

#Frame_427322018_d {
  position: absolute;
  width: 182px;
  height: 27px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_427322018_ea {
  fill: rgb(245, 245, 240);
}

.Frame_427322018_ea {
  position: absolute;
  overflow: visible;
  width: 182px;
  height: 27px;
  left: 0px;
  top: 0px;
}

#AVG_DURATION_d {
  left: 9.581px;
  top: 7.431px;
  position: absolute;
  overflow: visible;
  width: 165px;
  height: 12px;
  line-height: 18px;
  margin-top: -3px;
  text-align: center;
  font-family: Nexa;
  font-style: normal;
  font-weight: normal;
  font-size: 12px;
  color: rgb(48, 48, 48);
}

#Frame_427322017_ea {
  position: absolute;
  width: 218.136px;
  height: 163.602px;
  left: 236.314px;
  top: 183.598px;
  overflow: visible;
}

#Frame_427322017_eb {
  fill: rgb(101, 101, 201);
}

.Frame_427322017_eb {
  overflow: visible;
  position: absolute;
  width: 218.136px;
  height: 163.602px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Frame_427322015_ec {
  position: absolute;
  width: 193.204px;
  height: 70.443px;
  left: 17.686px;
  top: 15.793px;
  overflow: visible;
}

#Group_427319782_ed {
  position: absolute;
  width: 55px;
  height: 54px;
  left: 0px;
  top: 2.609px;
  overflow: visible;
}

#Ellipse_1936_ee {
  fill: rgb(255, 255, 255);
}

.Ellipse_1936_ee {
  position: absolute;
  overflow: visible;
  width: 55px;
  height: 54px;
  left: 0px;
  top: 0px;
}

#Frame_ei {
  position: absolute;
  width: 29px;
  height: 29px;
  left: 13px;
  top: 13px;
  display: none;
  overflow: visible;
}

#Frame_ej {
  fill: transparent;
}

.Frame_ej {
  position: absolute;
  overflow: visible;
  width: 29px;
  height: 29px;
  left: 0px;
  top: 0px;
}

#Vector_ek {
  fill: rgb(47, 47, 201);
}

.Vector_ek {
  overflow: visible;
  position: absolute;
  width: 22.722px;
  height: 22.722px;
  left: 3.852px;
  top: 2.227px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Frame_ei {
  position: absolute;
  width: 29px;
  height: 29px;
  left: 13px;
  top: 13px;
  display: none;
  overflow: visible;
}

#Frame_ej {
  fill: transparent;
}

.Frame_ej {
  position: absolute;
  overflow: visible;
  width: 29px;
  height: 29px;
  left: 0px;
  top: 0px;
}

#Vector_ek {
  fill: rgb(47, 47, 201);
}

.Vector_ek {
  overflow: visible;
  position: absolute;
  width: 22.722px;
  height: 22.722px;
  left: 3.852px;
  top: 2.227px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Frame_427322014_el {
  position: absolute;
  width: 120px;
  height: 70.443px;
  left: 73.204px;
  top: 0px;
  overflow: visible;
}

#n_2_em {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 119px;
  height: 51px;
  line-height: 71px;
  margin-top: -10.5px;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: bold;
  font-size: 50px;
  color: rgb(255, 255, 255);
}

#Onbound_Calls_en {
  left: 0px;
  top: 55.443px;
  position: absolute;
  overflow: visible;
  width: 121px;
  height: 15px;
  line-height: 24px;
  margin-top: -5px;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: bold;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.698);
}

#messagerecu {
  position: absolute;
  width: 41.726px;
  height: 20.141px;
  left: 7px;
  top: 19.609px;
  overflow: visible;
}

#Trac_46 {
  fill: rgb(47, 47, 201);
}

.Trac_46 {
  overflow: visible;
  position: absolute;
  width: 13.989px;
  height: 18.064px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Trac_47 {
  fill: rgb(47, 47, 201);
}

.Trac_47 {
  overflow: visible;
  position: absolute;
  width: 26.93px;
  height: 16.61px;
  left: 14.796px;
  top: 3.531px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Vector_2172_er {
  fill: transparent;
  stroke: rgba(255, 255, 255, 0.149);
  stroke-width: 1px;
  stroke-linejoin: miter;
  stroke-linecap: butt;
  stroke-miterlimit: 4;
  shape-rendering: auto;
}

.Vector_2172_er {
  overflow: visible;
  position: absolute;
  width: 181.78px;
  height: 0px;
  transform: translate(0px, 0px) matrix(1, 0, 0, 1, 18.178, 102.7057) rotate(0deg);
  transform-origin: center;
  left: 0px;
  top: 0px;
}

#Frame_427322016_es {
  position: absolute;
  width: 182px;
  height: 28px;
  left: 17.686px;
  top: 121.402px;
  overflow: visible;
}

#Frame_427322018_et {
  position: absolute;
  width: 182px;
  height: 28px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_427322018_eu {
  fill: rgb(245, 245, 240);
}

.Frame_427322018_eu {
  position: absolute;
  overflow: visible;
  width: 182px;
  height: 28px;
  left: 0px;
  top: 0px;
}

#AVG_DURATION_ev {
  left: 9.581px;
  top: 8.029px;
  position: absolute;
  overflow: visible;
  width: 165px;
  height: 12px;
  line-height: 18px;
  margin-top: -3px;
  text-align: center;
  font-family: Nexa;
  font-style: normal;
  font-weight: normal;
  font-size: 12px;
  color: rgb(48, 48, 48);
}

#Frame_427322017_ew {
  position: absolute;
  width: 218.136px;
  height: 163.602px;
  left: 473.537px;
  top: 0px;
  overflow: visible;
}

#Frame_427322017_ex {
  fill: rgb(236, 53, 58);
}

.Frame_427322017_ex {
  overflow: visible;
  position: absolute;
  width: 218.136px;
  height: 163.602px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Frame_427322015_ey {
  position: absolute;
  width: 192.427px;
  height: 70.443px;
  left: 18.463px;
  top: 15.793px;
  overflow: visible;
}

#Group_427319782_ez {
  position: absolute;
  width: 54px;
  height: 55px;
  left: 0px;
  top: 2.207px;
  overflow: visible;
}

#Ellipse_1936_e {
  fill: rgb(255, 255, 255);
}

.Ellipse_1936_e {
  position: absolute;
  overflow: visible;
  width: 54px;
  height: 55px;
  left: 0px;
  top: 0px;
}

#Frame_fb {
  position: absolute;
  width: 30px;
  height: 29px;
  left: 12px;
  top: 13px;
  display: none;
  overflow: visible;
}

#Frame_fc {
  fill: transparent;
}

.Frame_fc {
  position: absolute;
  overflow: visible;
  width: 30px;
  height: 29px;
  left: 0px;
  top: 0px;
}

#Vector_e {
  fill: rgb(47, 47, 201);
}

.Vector_e {
  overflow: visible;
  position: absolute;
  width: 22.722px;
  height: 22.722px;
  left: 4.075px;
  top: 2.63px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Frame_fb {
  position: absolute;
  width: 30px;
  height: 29px;
  left: 12px;
  top: 13px;
  display: none;
  overflow: visible;
}

#Frame_fc {
  fill: transparent;
}

.Frame_fc {
  position: absolute;
  overflow: visible;
  width: 30px;
  height: 29px;
  left: 0px;
  top: 0px;
}

#Vector_fa {
  fill: rgb(236, 53, 58);
}

.Vector_fa {
  overflow: visible;
  position: absolute;
  width: 22.722px;
  height: 22.722px;
  left: 4.075px;
  top: 2.63px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#appelmaque {
  position: absolute;
  width: 28.4px;
  height: 28.393px;
  left: 13px;
  top: 13px;
  overflow: visible;
}

#Trac_44 {
  fill: rgb(236, 53, 58);
}

.Trac_44 {
  overflow: visible;
  position: absolute;
  width: 28.4px;
  height: 28.392px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Trac_45 {
  fill: rgb(236, 53, 58);
}

.Trac_45 {
  overflow: visible;
  position: absolute;
  width: 7.073px;
  height: 6.886px;
  left: 15.326px;
  top: 6.1px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Frame_427322014_fa {
  position: absolute;
  width: 120px;
  height: 70.443px;
  left: 72.427px;
  top: 0px;
  overflow: visible;
}

#n_2_fb {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 119px;
  height: 51px;
  line-height: 71px;
  margin-top: -10.5px;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: bold;
  font-size: 50px;
  color: rgb(255, 255, 255);
}

#Onbound_Calls_fc {
  left: 0px;
  top: 55.443px;
  position: absolute;
  overflow: visible;
  width: 121px;
  height: 15px;
  line-height: 24px;
  margin-top: -5px;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: bold;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.698);
}

#Vector_2172_fd {
  fill: transparent;
  stroke: rgba(255, 255, 255, 0.149);
  stroke-width: 1px;
  stroke-linejoin: miter;
  stroke-linecap: butt;
  stroke-miterlimit: 4;
  shape-rendering: auto;
}

.Vector_2172_fd {
  overflow: visible;
  position: absolute;
  width: 181.78px;
  height: 0px;
  transform: translate(0px, 0px) matrix(1, 0, 0, 1, 18.178, 102.7057) rotate(0deg);
  transform-origin: center;
  left: 0px;
  top: 0px;
}

#Frame_427322016_fe {
  position: absolute;
  width: 181px;
  height: 27px;
  left: 18.463px;
  top: 122px;
  overflow: visible;
}

#Frame_427322018_ff {
  position: absolute;
  width: 181px;
  height: 27px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_427322018_fg {
  fill: rgb(245, 245, 240);
}

.Frame_427322018_fg {
  position: absolute;
  overflow: visible;
  width: 181px;
  height: 27px;
  left: 0px;
  top: 0px;
}

#AVG_DURATION_fh {
  left: 8.804px;
  top: 7.431px;
  position: absolute;
  overflow: visible;
  width: 165px;
  height: 12px;
  line-height: 18px;
  margin-top: -3px;
  text-align: center;
  font-family: Nexa;
  font-style: normal;
  font-weight: normal;
  font-size: 12px;
  color: rgb(74, 74, 74);
}

#CALENDAR {
  position: absolute;
  width: 471px;
  height: 349px;
  left: 1313px;
  top: 142px;
  display: none;
  overflow: visible;
}

#Tab_Bar {
  position: absolute;
  width: 471px;
  height: 28px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Text {
  left: 0px;
  top: 3px;
  position: absolute;
  overflow: visible;
  width: 27px;
  white-space: nowrap;
  line-height: 25px;
  margin-top: -1px;
  text-align: center;
  font-family: MaterialDesignIcons;
  font-style: normal;
  font-weight: normal;
  font-size: 23px;
  color: rgb(17, 34, 62);
}

#Text_fl {
  left: 177px;
  top: 6px;
  position: absolute;
  overflow: visible;
  width: 21px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -3px;
  text-align: center;
  font-family: MaterialDesignIcons;
  font-style: normal;
  font-weight: normal;
  font-size: 18px;
  color: rgb(55, 81, 254);
}

#MAI_2023 {
  left: 210px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 83px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -3px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: bold;
  font-size: 18px;
  color: rgb(55, 81, 254);
}

#Text_fn {
  left: 445px;
  top: 3px;
  position: absolute;
  overflow: visible;
  width: 27px;
  white-space: nowrap;
  line-height: 25px;
  margin-top: -1px;
  text-align: center;
  font-family: MaterialDesignIcons;
  font-style: normal;
  font-weight: normal;
  font-size: 23px;
  color: rgb(17, 34, 62);
}

#Week {
  position: absolute;
  width: 465px;
  height: 20px;
  left: 0px;
  top: 43px;
  overflow: visible;
}

#MON {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 35px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: bold;
  font-size: 14px;
  color: rgb(17, 34, 62);
}

#TUE {
  left: 77px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 27px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: bold;
  font-size: 14px;
  color: rgb(17, 34, 62);
}

#WED {
  left: 146px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 33px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: bold;
  font-size: 14px;
  color: rgb(17, 34, 62);
}

#THU {
  left: 221px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 29px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: bold;
  font-size: 14px;
  color: rgb(17, 34, 62);
}

#FRI {
  left: 297px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 21px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: bold;
  font-size: 14px;
  color: rgb(17, 34, 62);
}

#SAT {
  left: 365px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 27px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: bold;
  font-size: 14px;
  color: rgb(17, 34, 62);
}

#SUN {
  left: 437px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 29px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: bold;
  font-size: 14px;
  color: rgb(17, 34, 62);
}

#n_1_BG {
  position: absolute;
  width: 181px;
  height: 31px;
  left: 72px;
  top: 202px;
  overflow: visible;
}

#Ellipse_5 {
  fill: rgb(55, 80, 254);
}

.Ellipse_5 {
  position: absolute;
  overflow: visible;
  width: 31px;
  height: 31px;
  left: 0px;
  top: 0px;
}

#Ellipse_5_copy {
  fill: rgb(55, 80, 254);
}

.Ellipse_5_copy {
  position: absolute;
  overflow: visible;
  width: 31px;
  height: 31px;
  left: 150px;
  top: 0px;
}

#Rectangle_2 {
  fill: rgb(55, 80, 254);
}

.Rectangle_2 {
  position: absolute;
  overflow: visible;
  width: 150px;
  height: 31px;
  left: 15px;
  top: 0px;
}

#n_2_BG {
  position: absolute;
  width: 252px;
  height: 32px;
  left: 147px;
  top: 259px;
  overflow: visible;
}

#Ellipse_5_f {
  fill: rgb(255, 51, 102);
}

.Ellipse_5_f {
  position: absolute;
  overflow: visible;
  width: 31px;
  height: 32px;
  left: 0px;
  top: 0px;
}

#Rectangle_2_f {
  fill: rgb(255, 51, 102);
}

.Rectangle_2_f {
  position: absolute;
  overflow: visible;
  width: 223px;
  height: 32px;
  left: 13px;
  top: 0px;
}

#Ellipse_5_ga {
  fill: rgb(255, 51, 102);
}

.Ellipse_5_ga {
  position: absolute;
  overflow: visible;
  width: 32px;
  height: 32px;
  left: 220px;
  top: 0px;
}

#Ellipse_5_copy_2 {
  fill: rgb(255, 111, 94);
}

.Ellipse_5_copy_2 {
  position: absolute;
  overflow: visible;
  width: 31px;
  height: 31px;
  left: 72px;
  top: 318px;
}

#n_1 {
  position: absolute;
  width: 464px;
  height: 21px;
  left: 3px;
  top: 91px;
  overflow: visible;
}

#n_0 {
  opacity: 0.349;
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 19px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_1_f {
  left: 76px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 15px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_2_f {
  left: 148px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 19px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_3 {
  left: 223px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 19px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_4 {
  left: 297px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 19px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_5 {
  left: 372px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 19px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_6 {
  left: 446px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 19px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_2_gd {
  position: absolute;
  width: 462px;
  height: 21px;
  left: 3px;
  top: 148px;
  overflow: visible;
}

#n_7 {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 19px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_8 {
  left: 74px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 19px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_9 {
  left: 149px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 19px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_0_gh {
  left: 225px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 15px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_1_gi {
  left: 302px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 11px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_2_gj {
  left: 374px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 15px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_3_gk {
  left: 448px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 15px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_3_gl {
  position: absolute;
  width: 462px;
  height: 21px;
  left: 5px;
  top: 206px;
  overflow: visible;
}

#n_4_gm {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 15px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_5_gn {
  left: 75px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 15px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(255, 255, 255);
}

#n_6_go {
  left: 149px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 15px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(255, 255, 255);
}

#n_7_gp {
  left: 224px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 13px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(255, 255, 255);
}

#n_8_gq {
  left: 298px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 15px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_9_gr {
  left: 372px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 15px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_0_gs {
  left: 444px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 19px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_4_gt {
  position: absolute;
  width: 461px;
  height: 21px;
  left: 5px;
  top: 264px;
  overflow: visible;
}

#n_1_gu {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 15px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_2_gv {
  left: 72px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 19px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_3_gw {
  left: 147px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 19px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(255, 255, 255);
}

#n_4_gx {
  left: 221px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 19px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(255, 255, 255);
}

#n_5_gy {
  left: 295px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 19px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(255, 255, 255);
}

#n_6_gz {
  left: 370px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 19px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(255, 255, 255);
}

#n_7_g {
  left: 445px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 17px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_5_g {
  position: absolute;
  width: 464px;
  height: 21px;
  left: 3px;
  top: 322px;
  overflow: visible;
}

#n_8_g {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 19px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_9_g {
  left: 74px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 19px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(255, 255, 255);
}

#n_0_g {
  left: 149px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 19px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_1_g {
  left: 225px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 15px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_1_ha {
  opacity: 0.349;
  left: 299px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 15px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_2_g {
  opacity: 0.349;
  left: 372px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 19px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#n_3_g {
  opacity: 0.349;
  left: 446px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 19px;
  white-space: nowrap;
  line-height: 24px;
  margin-top: -4.5px;
  text-align: center;
  font-family: Poppins;
  font-style: normal;
  font-weight: normal;
  font-size: 15px;
  color: rgb(135, 143, 157);
}

#Appointments {
  position: absolute;
  width: 177px;
  height: 25px;
  left: 324.332px;
  top: 665.821px;
  overflow: visible;
}

#Recap_to_come {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 178px;
  white-space: nowrap;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: bold;
  font-size: 25px;
  color: rgb(47, 47, 201);
  letter-spacing: 0.15px;
}

#form_hc {
  fill: url(#form_hc);
}

.form_hc {
  filter: drop-shadow(0px 1px 1px rgba(255, 255, 255, 0.502));
  overflow: visible;
  width: 118px;
  height: 39px;
}

#Upcoming {
  position: absolute;
  width: 70px;
  height: 15px;
  left: 341.914px;
  top: 723px;
  overflow: visible;
}

#Upcoming_he {
  filter: drop-shadow(0px 1px 3px rgba(0, 0, 0, 0.18));
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 71px;
  white-space: nowrap;
  text-align: left;
  font-family: SF UI Display;
  font-style: normal;
  font-weight: bold;
  font-size: 15px;
  color: rgb(255, 255, 255);
  letter-spacing: 0.2px;
}

#Group {
  position: absolute;
  width: 36px;
  height: 36px;
  left: 1095px;
  top: 711px;
  overflow: visible;
}

#form_hg {
  fill: rgb(222, 226, 255);
}

.form_hg {
  position: absolute;
  overflow: visible;
  width: 36px;
  height: 36px;
  left: 0px;
  top: 0px;
}

#Forma_1 {
  fill: rgb(91, 47, 234);
  stroke: rgb(222, 226, 255);
  stroke-width: 1px;
  stroke-linejoin: round;
  stroke-linecap: butt;
  stroke-miterlimit: 4;
  shape-rendering: auto;
}

.Forma_1 {
  overflow: visible;
  position: absolute;
  width: 12.424px;
  height: 17.316px;
  left: 13.174px;
  top: 9.78px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Group_hi {
  position: absolute;
  width: 36px;
  height: 36px;
  left: 1047px;
  top: 711px;
  overflow: visible;
}

#form_hj {
  fill: rgb(255, 255, 255);
}

.form_hj {
  filter: drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.063));
  position: absolute;
  overflow: visible;
  width: 48px;
  height: 48px;
  left: 0px;
  top: 0px;
}

#Forma_1_hk {
  fill: rgb(132, 138, 193);
  stroke: rgb(255, 255, 255);
  stroke-width: 1px;
  stroke-linejoin: round;
  stroke-linecap: butt;
  stroke-miterlimit: 4;
  shape-rendering: auto;
}

.Forma_1_hk {
  overflow: visible;
  position: absolute;
  width: 12.424px;
  height: 17.316px;
  left: 11.402px;
  top: 9.78px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n_ {
  position: absolute;
  width: 350px;
  height: 250px;
  left: 314px;
  top: 783px;
  overflow: visible;
}

#f {
  fill: rgb(245, 245, 240);
}

.f {
  filter: drop-shadow(0px 2px 2px rgb(209, 223, 234));
  position: absolute;
  overflow: visible;
  width: 356px;
  height: 256px;
  left: 0px;
  top: 0px;
}

#n__hn {
  position: absolute;
  width: 62px;
  height: 62px;
  left: 45px;
  top: 25px;
  overflow: visible;
}

#n__ho {
  position: absolute;
  width: 62px;
  height: 62px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#n__hp {
  fill: rgb(0, 0, 0);
}

.n__hp {
  filter: drop-shadow(0px 2px 2px rgb(255, 255, 255));
  position: absolute;
  overflow: visible;
  width: 68px;
  height: 68px;
  left: 0px;
  top: 0px;
}

#Clip {
  position: absolute;
  width: 62px;
  height: 62px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#n_2_hr {
  position: absolute;
  width: 70.537px;
  height: 12.783px;
  left: 122.466px;
  top: 49.107px;
  overflow: visible;
}

#Dr_Alisa_Fox {
  position: absolute;
  width: 70.537px;
  height: 12.783px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay {
  fill: rgb(24, 42, 99);
}

.Color_Overlay {
  overflow: visible;
  position: absolute;
  width: 70.537px;
  height: 12.783px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n_1082018 {
  position: absolute;
  width: 72.294px;
  height: 11.648px;
  left: 77.681px;
  top: 193.306px;
  overflow: visible;
}

#Color_Overlay_hv {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_hv {
  overflow: visible;
  position: absolute;
  width: 72.294px;
  height: 11.648px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#i {
  fill: rgb(161, 180, 209);
}

.i {
  overflow: visible;
  position: absolute;
  width: 16px;
  height: 16px;
  left: 55px;
  top: 191px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n_35_PM {
  position: absolute;
  width: 51.282px;
  height: 10.192px;
  left: 196.293px;
  top: 193.299px;
  overflow: visible;
}

#Color_Overlay_hy {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_hy {
  overflow: visible;
  position: absolute;
  width: 51.281px;
  height: 10.192px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#i_hz {
  fill: rgb(161, 180, 209);
}

.i_hz {
  overflow: visible;
  position: absolute;
  width: 13.871px;
  height: 13.871px;
  left: 174.692px;
  top: 190.826px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Lorem_ipsum_dolor_sit_amet_con {
  left: 51px;
  top: 99px;
  position: absolute;
  overflow: visible;
  width: 244px;
  height: 61px;
  line-height: 15px;
  margin-top: -0.5px;
  text-align: left;
  font-family: SF Pro Display;
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  color: rgb(46, 42, 96);
  letter-spacing: 0.15px;
}

#n__h {
  position: absolute;
  width: 350px;
  height: 250px;
  left: 705px;
  top: 783px;
  overflow: visible;
}

#f_h {
  fill: rgb(245, 245, 240);
}

.f_h {
  filter: drop-shadow(0px 2px 2px rgb(209, 223, 234));
  position: absolute;
  overflow: visible;
  width: 356px;
  height: 256px;
  left: 0px;
  top: 0px;
}

#n__ia {
  position: absolute;
  width: 62px;
  height: 62px;
  left: 45px;
  top: 25px;
  overflow: visible;
}

#n__ib {
  position: absolute;
  width: 62px;
  height: 62px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#n__ic {
  fill: rgb(0, 0, 0);
}

.n__ic {
  filter: drop-shadow(0px 2px 2px rgb(255, 255, 255));
  position: absolute;
  overflow: visible;
  width: 68px;
  height: 68px;
  left: 0px;
  top: 0px;
}

#Clip_h {
  position: absolute;
  width: 62px;
  height: 62px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#n_2_h {
  position: absolute;
  width: 70.537px;
  height: 12.783px;
  left: 122.466px;
  top: 49.107px;
  overflow: visible;
}

#Dr_Alisa_Fox_h {
  position: absolute;
  width: 70.537px;
  height: 12.783px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_h {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_h {
  overflow: visible;
  position: absolute;
  width: 70.537px;
  height: 12.783px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n_1082018_ia {
  position: absolute;
  width: 72.294px;
  height: 11.648px;
  left: 77.681px;
  top: 193.306px;
  overflow: visible;
}

#Color_Overlay_ib {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_ib {
  overflow: visible;
  position: absolute;
  width: 72.294px;
  height: 11.648px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#i_ic {
  fill: rgb(161, 180, 209);
}

.i_ic {
  overflow: visible;
  position: absolute;
  width: 16px;
  height: 16px;
  left: 55px;
  top: 191px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n_35_PM_id {
  position: absolute;
  width: 51.282px;
  height: 10.192px;
  left: 196.293px;
  top: 193.299px;
  overflow: visible;
}

#Color_Overlay_ie {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_ie {
  overflow: visible;
  position: absolute;
  width: 51.282px;
  height: 10.192px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#i_if {
  fill: rgb(161, 180, 209);
}

.i_if {
  overflow: visible;
  position: absolute;
  width: 13.871px;
  height: 13.871px;
  left: 174.692px;
  top: 190.826px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Lorem_ipsum_dolor_sit_amet_con_ig {
  left: 51px;
  top: 99px;
  position: absolute;
  overflow: visible;
  width: 244px;
  height: 61px;
  line-height: 15px;
  margin-top: -0.5px;
  text-align: left;
  font-family: SF Pro Display;
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  color: rgb(46, 42, 96);
  letter-spacing: 0.15px;
}

#n__ih {
  position: absolute;
  width: 350px;
  height: 250px;
  left: 1096px;
  top: 783px;
  overflow: visible;
}

#f_ii {
  fill: rgb(245, 245, 240);
}

.f_ii {
  filter: drop-shadow(0px 2px 2px rgb(209, 223, 234));
  position: absolute;
  overflow: visible;
  width: 356px;
  height: 256px;
  left: 0px;
  top: 0px;
}

#n__ij {
  position: absolute;
  width: 62px;
  height: 62px;
  left: 45px;
  top: 25px;
  overflow: visible;
}

#n__ik {
  position: absolute;
  width: 62px;
  height: 62px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#n__il {
  fill: rgb(0, 0, 0);
}

.n__il {
  filter: drop-shadow(0px 2px 2px rgb(255, 255, 255));
  position: absolute;
  overflow: visible;
  width: 68px;
  height: 68px;
  left: 0px;
  top: 0px;
}

#Clip_im {
  position: absolute;
  width: 62px;
  height: 62px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#n_2_in {
  position: absolute;
  width: 70.537px;
  height: 12.783px;
  left: 122.466px;
  top: 49.107px;
  overflow: visible;
}

#Dr_Alisa_Fox_io {
  position: absolute;
  width: 70.537px;
  height: 12.783px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_ip {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_ip {
  overflow: visible;
  position: absolute;
  width: 70.537px;
  height: 12.783px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n_1082018_iq {
  position: absolute;
  width: 72.294px;
  height: 11.648px;
  left: 77.681px;
  top: 193.306px;
  overflow: visible;
}

#Color_Overlay_ir {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_ir {
  overflow: visible;
  position: absolute;
  width: 72.294px;
  height: 11.648px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#i_is {
  fill: rgb(161, 180, 209);
}

.i_is {
  overflow: visible;
  position: absolute;
  width: 16px;
  height: 16px;
  left: 55px;
  top: 191px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n_35_PM_it {
  position: absolute;
  width: 51.282px;
  height: 10.192px;
  left: 196.293px;
  top: 193.299px;
  overflow: visible;
}

#Color_Overlay_iu {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_iu {
  overflow: visible;
  position: absolute;
  width: 51.282px;
  height: 10.192px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#i_iv {
  fill: rgb(161, 180, 209);
}

.i_iv {
  overflow: visible;
  position: absolute;
  width: 13.871px;
  height: 13.871px;
  left: 174.692px;
  top: 190.826px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Lorem_ipsum_dolor_sit_amet_con_iw {
  left: 51px;
  top: 99px;
  position: absolute;
  overflow: visible;
  width: 244px;
  height: 61px;
  line-height: 15px;
  margin-top: -0.5px;
  text-align: left;
  font-family: SF Pro Display;
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  color: rgb(46, 42, 96);
  letter-spacing: 0.15px;
}

#n__ix {
  position: absolute;
  width: 350px;
  height: 250px;
  left: 1487px;
  top: 783px;
  overflow: visible;
}

#f_iy {
  fill: rgb(245, 245, 240);
}

.f_iy {
  filter: drop-shadow(0px 2px 2px rgb(209, 223, 234));
  position: absolute;
  overflow: visible;
  width: 356px;
  height: 256px;
  left: 0px;
  top: 0px;
}

#n__iz {
  position: absolute;
  width: 62px;
  height: 62px;
  left: 45px;
  top: 25px;
  overflow: visible;
}

#n__i {
  position: absolute;
  width: 62px;
  height: 62px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#n__ja {
  fill: rgb(0, 0, 0);
}

.n__ja {
  filter: drop-shadow(0px 2px 2px rgb(255, 255, 255));
  position: absolute;
  overflow: visible;
  width: 68px;
  height: 68px;
  left: 0px;
  top: 0px;
}

#Clip_i {
  position: absolute;
  width: 62px;
  height: 62px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#n_2_i {
  position: absolute;
  width: 70.537px;
  height: 12.783px;
  left: 122.466px;
  top: 49.107px;
  overflow: visible;
}

#Dr_Alisa_Fox_i {
  position: absolute;
  width: 70.537px;
  height: 12.783px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_i {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_i {
  overflow: visible;
  position: absolute;
  width: 70.537px;
  height: 12.783px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n_1082018_i {
  position: absolute;
  width: 72.294px;
  height: 11.648px;
  left: 77.681px;
  top: 193.306px;
  overflow: visible;
}

#Color_Overlay_ja {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_ja {
  overflow: visible;
  position: absolute;
  width: 72.294px;
  height: 11.648px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#i_i {
  fill: rgb(161, 180, 209);
}

.i_i {
  overflow: visible;
  position: absolute;
  width: 16px;
  height: 16px;
  left: 55px;
  top: 191px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n_35_PM_i {
  position: absolute;
  width: 51.282px;
  height: 10.192px;
  left: 196.293px;
  top: 193.299px;
  overflow: visible;
}

#Color_Overlay_jb {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_jb {
  overflow: visible;
  position: absolute;
  width: 51.282px;
  height: 10.192px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#i_jb {
  fill: rgb(161, 180, 209);
}

.i_jb {
  overflow: visible;
  position: absolute;
  width: 13.871px;
  height: 13.871px;
  left: 174.692px;
  top: 190.826px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Lorem_ipsum_dolor_sit_amet_con_jc {
  left: 51px;
  top: 99px;
  position: absolute;
  overflow: visible;
  width: 244px;
  height: 61px;
  line-height: 15px;
  margin-top: -0.5px;
  text-align: left;
  font-family: SF Pro Display;
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  color: rgb(46, 42, 96);
  letter-spacing: 0.15px;
}

#calendar {
  position: absolute;
  width: 530px;
  height: 460px;
  left: 1295px;
  top: 144px;
  overflow: visible;
}

#calendar_je {
  position: absolute;
  width: 530px;
  height: 460px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#form_jf {
  fill: rgb(255, 255, 255);
}

.form_jf {
  filter: drop-shadow(0px 4px 12px rgba(161, 171, 198, 0.2));
  position: absolute;
  overflow: visible;
  width: 566px;
  height: 496px;
  left: 0px;
  top: 0px;
}

#i_jg {
  fill: rgb(104, 85, 247);
}

.i_jg {
  overflow: visible;
  position: absolute;
  width: 25.992px;
  height: 25.994px;
  left: 176px;
  top: 35px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Group_jh {
  position: absolute;
  width: 44px;
  height: 44px;
  left: 30px;
  top: 25px;
  overflow: visible;
}

#form_ji {
  fill: rgb(255, 255, 255);
}

.form_ji {
  filter: drop-shadow(0px 1px 3px rgba(0, 0, 0, 0.239));
  position: absolute;
  overflow: visible;
  width: 53px;
  height: 53px;
  left: 0px;
  top: 0px;
}

#Forma_1_jj {
  fill: rgb(132, 138, 193);
  stroke: rgb(255, 255, 255);
  stroke-width: 1px;
  stroke-linejoin: round;
  stroke-linecap: butt;
  stroke-miterlimit: 4;
  shape-rendering: auto;
}

.Forma_1_jj {
  overflow: visible;
  position: absolute;
  width: 15.001px;
  height: 20.997px;
  left: 13.999px;
  top: 12.002px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Group_jk {
  position: absolute;
  width: 44px;
  height: 44px;
  left: 456px;
  top: 25px;
  overflow: visible;
}

#form_jl {
  fill: rgb(255, 255, 255);
}

.form_jl {
  filter: drop-shadow(0px 1px 3px rgba(0, 0, 0, 0.235));
  position: absolute;
  overflow: visible;
  width: 53px;
  height: 53px;
  left: 0px;
  top: 0px;
}

#Forma_1_jm {
  fill: rgb(132, 138, 193);
  stroke: rgb(255, 255, 255);
  stroke-width: 1px;
  stroke-linejoin: round;
  stroke-linecap: butt;
  stroke-miterlimit: 4;
  shape-rendering: auto;
}

.Forma_1_jm {
  overflow: visible;
  position: absolute;
  width: 15.001px;
  height: 20.997px;
  left: 16px;
  top: 12.002px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#August_2018 {
  position: absolute;
  width: 98.87px;
  height: 18px;
  left: 239.742px;
  top: 37.231px;
  overflow: visible;
}

#Color_Overlay_jo {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_jo {
  overflow: visible;
  position: absolute;
  width: 98.87px;
  height: 18px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n__jp {
  fill: rgba(222, 226, 255, 0.4);
}

.n__jp {
  position: absolute;
  overflow: visible;
  width: 253px;
  height: 40px;
  left: 103px;
  top: 199px;
}

#n__jq {
  fill: rgba(222, 226, 255, 0.4);
}

.n__jq {
  position: absolute;
  overflow: visible;
  width: 179px;
  height: 40px;
  left: 249px;
  top: 319px;
}

#n_1_jr {
  position: absolute;
  width: 470px;
  height: 79px;
  left: 29.82px;
  top: 91.938px;
  overflow: visible;
}

#n__js {
  position: absolute;
  width: 23.105px;
  height: 14.658px;
  left: 8.687px;
  top: 59.625px;
  overflow: visible;
}

#n_8_jt {
  opacity: 0.949;
  position: absolute;
  width: 23.105px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_ju {
  fill: rgb(132, 138, 193);
}

.Color_Overlay_ju {
  overflow: visible;
  position: absolute;
  width: 23.105px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#MON_jv {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 41px;
  white-space: nowrap;
  text-align: left;
  font-family: SF UI Display;
  font-style: normal;
  font-weight: bold;
  font-size: 17px;
  color: rgb(104, 85, 247);
  letter-spacing: 0.2px;
}

#n__jw {
  position: absolute;
  width: 10.576px;
  height: 14.658px;
  left: 444.863px;
  top: 59.625px;
  overflow: visible;
}

#n__jx {
  position: absolute;
  width: 10.576px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_jy {
  fill: rgb(234, 47, 47);
}

.Color_Overlay_jy {
  overflow: visible;
  position: absolute;
  width: 10.576px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#SUN_jz {
  left: 433px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 38px;
  white-space: nowrap;
  text-align: left;
  font-family: SF UI Display;
  font-style: normal;
  font-weight: bold;
  font-size: 17px;
  color: rgb(104, 85, 247);
  letter-spacing: 0.2px;
}

#n__j {
  position: absolute;
  width: 22.998px;
  height: 14.668px;
  left: 80.735px;
  top: 59.615px;
  overflow: visible;
}

#n_9_j {
  position: absolute;
  width: 22.998px;
  height: 14.668px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_j {
  fill: rgb(132, 138, 193);
}

.Color_Overlay_j {
  overflow: visible;
  position: absolute;
  width: 22.998px;
  height: 14.668px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#TUE_j {
  left: 75px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 36px;
  white-space: nowrap;
  text-align: left;
  font-family: SF UI Display;
  font-style: normal;
  font-weight: bold;
  font-size: 17px;
  color: rgb(104, 85, 247);
  letter-spacing: 0.2px;
}

#n__ka {
  position: absolute;
  width: 23.72px;
  height: 14.658px;
  left: 152.33px;
  top: 59.625px;
  overflow: visible;
}

#n_0_j {
  position: absolute;
  width: 23.72px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_ka {
  fill: rgb(132, 138, 193);
}

.Color_Overlay_ka {
  overflow: visible;
  position: absolute;
  width: 23.72px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#WED_j {
  left: 147px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 41px;
  white-space: nowrap;
  text-align: left;
  font-family: SF UI Display;
  font-style: normal;
  font-weight: bold;
  font-size: 17px;
  color: rgb(104, 85, 247);
  letter-spacing: 0.2px;
}

#n__kb {
  position: absolute;
  width: 18.964px;
  height: 14.658px;
  left: 225.995px;
  top: 59.625px;
  overflow: visible;
}

#n_1_j {
  position: absolute;
  width: 18.964px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_kb {
  fill: rgb(132, 138, 193);
}

.Color_Overlay_kb {
  overflow: visible;
  position: absolute;
  width: 18.964px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#THU_kb {
  left: 219px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 37px;
  white-space: nowrap;
  text-align: left;
  font-family: SF UI Display;
  font-style: normal;
  font-weight: bold;
  font-size: 17px;
  color: rgb(104, 85, 247);
  letter-spacing: 0.2px;
}

#n__kc {
  position: absolute;
  width: 6.172px;
  height: 14.092px;
  left: 303.43px;
  top: 59.908px;
  overflow: visible;
}

#n__kd {
  position: absolute;
  width: 6.172px;
  height: 14.092px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_ke {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_ke {
  overflow: visible;
  position: absolute;
  width: 6.172px;
  height: 14.092px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#FRI_kf {
  left: 294px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 29px;
  white-space: nowrap;
  text-align: left;
  font-family: SF UI Display;
  font-style: normal;
  font-weight: bold;
  font-size: 17px;
  color: rgb(104, 85, 247);
  letter-spacing: 0.2px;
}

#n__kg {
  position: absolute;
  width: 12px;
  height: 20px;
  left: 372.2px;
  top: 59px;
  overflow: visible;
}

#n__kh {
  position: absolute;
  width: 12px;
  height: 20px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#n__ki {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 13px;
  white-space: nowrap;
  text-align: center;
  font-family: SF UI Display;
  font-style: normal;
  font-weight: bold;
  font-size: 20px;
  color: rgb(46, 42, 96);
  letter-spacing: 0.2px;
}

#SAT_kj {
  left: 365px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 34px;
  white-space: nowrap;
  text-align: left;
  font-family: SF UI Display;
  font-style: normal;
  font-weight: bold;
  font-size: 17px;
  color: rgb(104, 85, 247);
  letter-spacing: 0.2px;
}

#n_2_kk {
  position: absolute;
  width: 445.976px;
  height: 40px;
  left: 44.419px;
  top: 199px;
  overflow: visible;
}

#n__kl {
  position: absolute;
  width: 11.328px;
  height: 14.092px;
  left: 0px;
  top: 12.846px;
  overflow: visible;
}

#n__km {
  position: absolute;
  width: 11.328px;
  height: 14.092px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_kn {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_kn {
  overflow: visible;
  position: absolute;
  width: 11.328px;
  height: 14.092px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n__ko {
  position: absolute;
  width: 20.693px;
  height: 14.658px;
  left: 425.283px;
  top: 12.563px;
  overflow: visible;
}

#n_0_kp {
  position: absolute;
  width: 20.693px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_kq {
  fill: rgb(234, 47, 47);
}

.Color_Overlay_kq {
  overflow: visible;
  position: absolute;
  width: 20.693px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n__kr {
  position: absolute;
  width: 40px;
  height: 40px;
  left: 57.581px;
  top: 0px;
  overflow: visible;
}

#n__ks {
  fill: rgb(222, 226, 255);
}

.n__ks {
  position: absolute;
  overflow: visible;
  width: 40px;
  height: 40px;
  left: 0px;
  top: 0px;
}

#n__kt {
  position: absolute;
  width: 10.41px;
  height: 14.375px;
  left: 15.049px;
  top: 12.846px;
  overflow: visible;
}

#Color_Overlay_ku {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_ku {
  overflow: visible;
  position: absolute;
  width: 10.41px;
  height: 14.375px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n__kv {
  position: absolute;
  width: 12px;
  height: 20px;
  left: 143.601px;
  top: 11.938px;
  overflow: visible;
}

#n__kw {
  position: absolute;
  width: 12px;
  height: 20px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#n__kx {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 13px;
  white-space: nowrap;
  text-align: center;
  font-family: SF UI Display;
  font-style: normal;
  font-weight: bold;
  font-size: 20px;
  color: rgb(46, 42, 96);
  letter-spacing: 0.2px;
}

#n__ky {
  position: absolute;
  width: 12px;
  height: 20px;
  left: 215.601px;
  top: 11.938px;
  overflow: visible;
}

#n__kz {
  position: absolute;
  width: 12px;
  height: 20px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#n__k {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 13px;
  white-space: nowrap;
  text-align: center;
  font-family: SF UI Display;
  font-style: normal;
  font-weight: bold;
  font-size: 20px;
  color: rgb(46, 42, 96);
  letter-spacing: 0.2px;
}

#Color_Overlay_k {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_k {
  overflow: visible;
  position: absolute;
  width: 9.805px;
  height: 14.092px;
  left: 1.034px;
  top: 0.908px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n__la {
  position: absolute;
  width: 40px;
  height: 40px;
  left: 272.581px;
  top: 0px;
  overflow: visible;
}

#n__lb {
  fill: rgb(222, 226, 255);
}

.n__lb {
  position: absolute;
  overflow: visible;
  width: 40px;
  height: 40px;
  left: 0px;
  top: 0px;
}

#n__lc {
  position: absolute;
  width: 12px;
  height: 20px;
  left: 14.02px;
  top: 11.938px;
  overflow: visible;
}

#n__ld {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 13px;
  white-space: nowrap;
  text-align: center;
  font-family: SF UI Display;
  font-style: normal;
  font-weight: bold;
  font-size: 20px;
  color: rgb(46, 42, 96);
  letter-spacing: 0.2px;
}

#n__le {
  position: absolute;
  width: 12px;
  height: 20px;
  left: 357.601px;
  top: 11.938px;
  overflow: visible;
}

#n__lf {
  position: absolute;
  width: 12px;
  height: 20px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#n__lg {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 13px;
  white-space: nowrap;
  text-align: center;
  font-family: SF UI Display;
  font-style: normal;
  font-weight: bold;
  font-size: 20px;
  color: rgb(46, 42, 96);
  letter-spacing: 0.2px;
}

#n_2_k {
  position: absolute;
  width: 449.638px;
  height: 20px;
  left: 41.383px;
  top: 270.938px;
  overflow: visible;
}

#n__lh {
  position: absolute;
  width: 15.908px;
  height: 14.092px;
  left: 0px;
  top: 0.908px;
  overflow: visible;
}

#n_1_lb {
  position: absolute;
  width: 15.908px;
  height: 14.092px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_lc {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_lc {
  overflow: visible;
  position: absolute;
  width: 15.908px;
  height: 14.092px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n__li {
  position: absolute;
  width: 22px;
  height: 20px;
  left: 427.638px;
  top: 0px;
  overflow: visible;
}

#n_7_le {
  position: absolute;
  width: 22px;
  height: 20px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#n_7_lf {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 23px;
  white-space: nowrap;
  text-align: center;
  font-family: SF UI Display;
  font-style: normal;
  font-weight: bold;
  font-size: 20px;
  color: rgb(46, 42, 96);
  letter-spacing: 0.2px;
}

#n__lj {
  position: absolute;
  width: 19.785px;
  height: 14.375px;
  left: 70.774px;
  top: 0.625px;
  overflow: visible;
}

#n_2_lh {
  position: absolute;
  width: 19.785px;
  height: 14.375px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_li {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_li {
  overflow: visible;
  position: absolute;
  width: 19.785px;
  height: 14.375px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n__lk {
  position: absolute;
  width: 20.234px;
  height: 14.658px;
  left: 142.511px;
  top: 0.625px;
  overflow: visible;
}

#n_3_lk {
  position: absolute;
  width: 20.234px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_ll {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_ll {
  overflow: visible;
  position: absolute;
  width: 20.234px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n__lm {
  position: absolute;
  width: 20.888px;
  height: 14.092px;
  left: 214.345px;
  top: 0.908px;
  overflow: visible;
}

#n_4_ln {
  position: absolute;
  width: 20.888px;
  height: 14.092px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_lo {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_lo {
  overflow: visible;
  position: absolute;
  width: 20.888px;
  height: 14.092px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n__lp {
  position: absolute;
  width: 20.38px;
  height: 14.375px;
  left: 285.564px;
  top: 0.908px;
  overflow: visible;
}

#n_5_lq {
  position: absolute;
  width: 20.38px;
  height: 14.375px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_lr {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_lr {
  overflow: visible;
  position: absolute;
  width: 20.38px;
  height: 14.375px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n__ls {
  position: absolute;
  width: 22px;
  height: 20px;
  left: 355.638px;
  top: 0px;
  overflow: visible;
}

#n_6_lt {
  position: absolute;
  width: 22px;
  height: 20px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#n_6_lu {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 23px;
  white-space: nowrap;
  text-align: center;
  font-family: SF UI Display;
  font-style: normal;
  font-weight: bold;
  font-size: 20px;
  color: rgb(46, 42, 96);
  letter-spacing: 0.2px;
}

#n_2_lv {
  position: absolute;
  width: 451.298px;
  height: 40px;
  left: 39.722px;
  top: 319px;
  overflow: visible;
}

#n__lw {
  position: absolute;
  width: 20.664px;
  height: 14.658px;
  left: 0px;
  top: 12.563px;
  overflow: visible;
}

#n_8_lx {
  position: absolute;
  width: 20.664px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_ly {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_ly {
  overflow: visible;
  position: absolute;
  width: 20.664px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n__lz {
  position: absolute;
  width: 22px;
  height: 20px;
  left: 429.298px;
  top: 11.938px;
  overflow: visible;
}

#n_4_l {
  position: absolute;
  width: 22px;
  height: 20px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#n_4_ma {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 23px;
  white-space: nowrap;
  text-align: center;
  font-family: SF UI Display;
  font-style: normal;
  font-weight: bold;
  font-size: 20px;
  color: rgb(46, 42, 96);
  letter-spacing: 0.2px;
}

#n__l {
  position: absolute;
  width: 22px;
  height: 20px;
  left: 71.298px;
  top: 11.938px;
  overflow: visible;
}

#n_9_l {
  position: absolute;
  width: 22px;
  height: 20px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#n_9_ma {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 23px;
  white-space: nowrap;
  text-align: center;
  font-family: SF UI Display;
  font-style: normal;
  font-weight: bold;
  font-size: 20px;
  color: rgb(46, 42, 96);
  letter-spacing: 0.2px;
}

#n__ma {
  position: absolute;
  width: 23.105px;
  height: 14.658px;
  left: 142.779px;
  top: 12.563px;
  overflow: visible;
}

#n_0_l {
  position: absolute;
  width: 23.105px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_l {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_l {
  overflow: visible;
  position: absolute;
  width: 23.105px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n__mb {
  position: absolute;
  width: 40px;
  height: 40px;
  left: 206.278px;
  top: 0px;
  overflow: visible;
}

#n__mc {
  fill: rgb(222, 226, 255);
}

.n__mc {
  position: absolute;
  overflow: visible;
  width: 40px;
  height: 40px;
  left: 0px;
  top: 0px;
}

#n_1_ma {
  position: absolute;
  width: 18.349px;
  height: 14.375px;
  left: 10.167px;
  top: 12.563px;
  overflow: visible;
}

#Color_Overlay_mb {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_mb {
  overflow: visible;
  position: absolute;
  width: 18.349px;
  height: 14.375px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n__md {
  position: absolute;
  width: 22.226px;
  height: 14.375px;
  left: 286.219px;
  top: 12.563px;
  overflow: visible;
}

#n_2_md {
  position: absolute;
  width: 22.226px;
  height: 14.375px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_me {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_me {
  overflow: visible;
  position: absolute;
  width: 22.226px;
  height: 14.375px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n__mf {
  position: absolute;
  width: 40px;
  height: 40px;
  left: 348.278px;
  top: 0px;
  overflow: visible;
}

#n__mg {
  fill: rgb(222, 226, 255);
}

.n__mg {
  position: absolute;
  overflow: visible;
  width: 40px;
  height: 40px;
  left: 0px;
  top: 0px;
}

#n_3_mh {
  position: absolute;
  width: 22.675px;
  height: 14.658px;
  left: 8.677px;
  top: 12.563px;
  overflow: visible;
}

#Color_Overlay_mi {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_mi {
  overflow: visible;
  position: absolute;
  width: 22.675px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n_2_mj {
  position: absolute;
  width: 443.691px;
  height: 20px;
  left: 38.731px;
  top: 390.938px;
  overflow: visible;
}

#n__mk {
  position: absolute;
  width: 22.822px;
  height: 14.658px;
  left: 0px;
  top: 0.625px;
  overflow: visible;
}

#n_5_ml {
  position: absolute;
  width: 22.822px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_mm {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_mm {
  overflow: visible;
  position: absolute;
  width: 22.822px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n__mn {
  position: absolute;
  width: 6.172px;
  height: 14.092px;
  left: 437.519px;
  top: 0.908px;
  overflow: visible;
}

#n__mo {
  opacity: 0.502;
  position: absolute;
  width: 6.172px;
  height: 14.092px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_mp {
  fill: rgb(234, 47, 47);
}

.Color_Overlay_mp {
  overflow: visible;
  position: absolute;
  width: 6.172px;
  height: 14.092px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n__mq {
  position: absolute;
  width: 22px;
  height: 20px;
  left: 72.289px;
  top: 0px;
  overflow: visible;
}

#n_6_mr {
  position: absolute;
  width: 22px;
  height: 20px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#n_6_ms {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 23px;
  white-space: nowrap;
  text-align: center;
  font-family: SF UI Display;
  font-style: normal;
  font-weight: bold;
  font-size: 20px;
  color: rgb(46, 42, 96);
  letter-spacing: 0.2px;
}

#n__mt {
  position: absolute;
  width: 21.748px;
  height: 14.375px;
  left: 144.474px;
  top: 0.625px;
  overflow: visible;
}

#n_7_mu {
  position: absolute;
  width: 21.748px;
  height: 14.375px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_mv {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_mv {
  overflow: visible;
  position: absolute;
  width: 21.748px;
  height: 14.375px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n__mw {
  position: absolute;
  width: 23.105px;
  height: 14.658px;
  left: 215.775px;
  top: 0.625px;
  overflow: visible;
}

#n_8_mx {
  position: absolute;
  width: 23.105px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_my {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_my {
  overflow: visible;
  position: absolute;
  width: 23.105px;
  height: 14.658px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n__mz {
  position: absolute;
  width: 22.998px;
  height: 14.668px;
  left: 286.824px;
  top: 0.615px;
  overflow: visible;
}

#n_9_m {
  position: absolute;
  width: 22.998px;
  height: 14.668px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Color_Overlay_m {
  fill: rgb(24, 42, 99);
}

.Color_Overlay_m {
  overflow: visible;
  position: absolute;
  width: 22.998px;
  height: 14.668px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n__m {
  position: absolute;
  width: 22px;
  height: 20px;
  left: 358.289px;
  top: 0px;
  overflow: visible;
}

#n_0_m {
  position: absolute;
  width: 22px;
  height: 20px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#n_0_na {
  left: 0px;
  top: 0px;
  position: absolute;
  overflow: visible;
  width: 23px;
  white-space: nowrap;
  text-align: center;
  font-family: SF UI Display;
  font-style: normal;
  font-weight: bold;
  font-size: 20px;
  color: rgb(46, 42, 96);
  letter-spacing: 0.2px;
}

#navigation_dashboard {
  position: absolute;
  width: 260px;
  height: 1080px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_427321998 {
  position: absolute;
  width: 260px;
  height: 1080px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_427321998_m {
  fill: rgb(8, 8, 33);
}

.Frame_427321998_m {
  overflow: visible;
  position: absolute;
  width: 260px;
  height: 1080px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#logo {
  position: absolute;
  width: 223px;
  height: 95px;
  left: 31px;
  top: 12px;
  overflow: visible;
}

#Trac_11 {
  fill: rgb(255, 255, 255);
}

.Trac_11 {
  overflow: visible;
  position: absolute;
  width: 29.632px;
  height: 32.489px;
  left: 15.511px;
  top: 32.23px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Trac_12 {
  fill: rgb(255, 255, 255);
}

.Trac_12 {
  overflow: visible;
  position: absolute;
  width: 36.885px;
  height: 23.721px;
  left: 45.674px;
  top: 41.227px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Trac_13 {
  fill: rgb(255, 255, 255);
}

.Trac_13 {
  overflow: visible;
  position: absolute;
  width: 13.891px;
  height: 35.042px;
  left: 84.344px;
  top: 29.677px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Trac_14 {
  fill: rgb(255, 255, 255);
}

.Trac_14 {
  overflow: visible;
  position: absolute;
  width: 18.333px;
  height: 35.313px;
  left: 99.175px;
  top: 29.397px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Trac_15 {
  fill: rgb(255, 255, 255);
}

.Trac_15 {
  overflow: visible;
  position: absolute;
  width: 25.387px;
  height: 24.181px;
  left: 115.233px;
  top: 41.001px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Trac_16 {
  fill: rgb(255, 255, 255);
}

.Trac_16 {
  overflow: visible;
  position: absolute;
  width: 28.779px;
  height: 23.68px;
  left: 141.54px;
  top: 41.039px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Trac_17 {
  fill: rgb(255, 255, 255);
}

.Trac_17 {
  overflow: visible;
  position: absolute;
  width: 21.754px;
  height: 24.226px;
  left: 171.259px;
  top: 40.944px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Rectangle_6 {
  fill: transparent;
}

.Rectangle_6 {
  position: absolute;
  overflow: visible;
  width: 223px;
  height: 95px;
  left: 0px;
  top: 0px;
}

#active {
  fill: rgb(255, 255, 255);
}

.active {
  position: absolute;
  overflow: visible;
  width: 219px;
  height: 44px;
  left: 23px;
  top: 132px;
}

#nav_dashboard {
  position: absolute;
  width: 147px;
  height: 24px;
  left: 40px;
  top: 142px;
  overflow: visible;
}

#Dashboard {
  left: 42px;
  top: 3px;
  position: absolute;
  overflow: visible;
  width: 106px;
  white-space: nowrap;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: bold;
  font-size: 20px;
  color: rgb(47, 47, 201);
}

#home {
  position: absolute;
  width: 24px;
  height: 24px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_nl {
  position: absolute;
  width: 24px;
  height: 24px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_nm {
  fill: transparent;
}

.Frame_nm {
  position: absolute;
  overflow: visible;
  width: 24px;
  height: 24px;
  left: 0px;
  top: 0px;
}

#Vector_nn {
  fill: rgb(47, 47, 201);
}

.Vector_nn {
  overflow: visible;
  position: absolute;
  width: 22.5px;
  height: 18.748px;
  left: 0.75px;
  top: 2.252px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#nav_call_history {
  position: absolute;
  width: 158px;
  height: 25px;
  left: 42px;
  top: 301px;
  overflow: visible;
  --web-animation: fadein undefineds undefined;
  --web-action-type: page;
  --web-action-target: Twifone_calls_history.html;
  cursor: pointer;
}

#Calls_history {
  left: 40px;
  top: 5px;
  position: absolute;
  overflow: visible;
  width: 119px;
  white-space: nowrap;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  color: rgb(245, 245, 240);
}

#calls_history {
  position: absolute;
  width: 24px;
  height: 24px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_nr {
  position: absolute;
  width: 24px;
  height: 24px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_ns {
  fill: transparent;
}

.Frame_ns {
  position: absolute;
  overflow: visible;
  width: 24px;
  height: 24px;
  left: 0px;
  top: 0px;
}

#Vector_nt {
  fill: rgb(255, 255, 255);
}

.Vector_nt {
  overflow: visible;
  position: absolute;
  width: 18.75px;
  height: 18.75px;
  left: 3px;
  top: 2.25px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#nav_sms {
  position: absolute;
  width: 79.704px;
  height: 24.283px;
  left: 46.296px;
  top: 380.717px;
  overflow: visible;
  --web-animation: fadein undefineds undefined;
  --web-action-type: page;
  --web-action-target: Twifone_SMS.html;
  cursor: pointer;
}

#SMS {
  left: 35.704px;
  top: 4.283px;
  position: absolute;
  overflow: visible;
  width: 45px;
  white-space: nowrap;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  color: rgb(245, 245, 240);
}

#mes {
  fill: rgb(255, 255, 255);
}

.mes {
  overflow: visible;
  position: absolute;
  width: 21.593px;
  height: 19.784px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#nav_notes {
  position: absolute;
  width: 126px;
  height: 26px;
  left: 43px;
  top: 458px;
  overflow: visible;
  --web-animation: fadein undefineds undefined;
  --web-action-type: page;
  --web-action-target: Twifone_SMS.html;
  cursor: pointer;
}

#My_notes {
  left: 39px;
  top: 6px;
  position: absolute;
  overflow: visible;
  width: 88px;
  white-space: nowrap;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  color: rgb(245, 245, 240);
}

#note {
  position: absolute;
  width: 24px;
  height: 24px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_427321991 {
  position: absolute;
  width: 24px;
  height: 24px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_n {
  position: absolute;
  width: 24px;
  height: 24px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_oa {
  fill: transparent;
}

.Frame_oa {
  position: absolute;
  overflow: visible;
  width: 24px;
  height: 24px;
  left: 0px;
  top: 0px;
}

#Vector_n {
  fill: rgb(255, 255, 255);
}

.Vector_n {
  overflow: visible;
  position: absolute;
  width: 16.5px;
  height: 19.5px;
  left: 3.75px;
  top: 2.25px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#nav_contact {
  position: absolute;
  width: 117px;
  height: 24px;
  left: 42px;
  top: 220px;
  overflow: visible;
  --web-animation: fadein undefineds undefined;
  --web-action-type: page;
  --web-action-target: Twifone_contact.html;
  cursor: pointer;
}

#Contact {
  left: 40px;
  top: 4px;
  position: absolute;
  overflow: visible;
  width: 78px;
  white-space: nowrap;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  color: rgb(245, 245, 240);
}

#contact {
  position: absolute;
  width: 24px;
  height: 24px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_ob {
  position: absolute;
  width: 24px;
  height: 24px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_oc {
  fill: transparent;
}

.Frame_oc {
  position: absolute;
  overflow: visible;
  width: 24px;
  height: 24px;
  left: 0px;
  top: 0px;
}

#Vector_oa {
  fill: rgb(255, 255, 255);
}

.Vector_oa {
  overflow: visible;
  position: absolute;
  width: 19.5px;
  height: 19.5px;
  left: 2.25px;
  top: 2.25px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#nav_members {
  position: absolute;
  width: 131px;
  height: 25px;
  left: 42px;
  top: 540px;
  overflow: visible;
  --web-animation: fadein undefineds undefined;
  --web-action-type: page;
  --web-action-target: Twifone_my_team.html;
  cursor: pointer;
}

#Members {
  left: 40px;
  top: 5px;
  position: absolute;
  overflow: visible;
  width: 92px;
  white-space: nowrap;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  color: rgb(245, 245, 240);
}

#Frame_427321992 {
  position: absolute;
  width: 24px;
  height: 24px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_427321989 {
  position: absolute;
  width: 24px;
  height: 24px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_oe {
  position: absolute;
  width: 24px;
  height: 24px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_of {
  fill: transparent;
}

.Frame_of {
  position: absolute;
  overflow: visible;
  width: 24px;
  height: 24px;
  left: 0px;
  top: 0px;
}

#Vector_og {
  fill: rgb(255, 255, 255);
}

.Vector_og {
  overflow: visible;
  position: absolute;
  width: 23.588px;
  height: 15.011px;
  left: 0.203px;
  top: 4.498px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#nav_settings {
  position: absolute;
  width: 118px;
  height: 23px;
  left: 44px;
  top: 703px;
  overflow: visible;
  --web-animation: fadein undefineds undefined;
  --web-action-type: page;
  --web-action-target: Twifone_settings.html;
  cursor: pointer;
}

#Settings {
  left: 38px;
  top: 3px;
  position: absolute;
  overflow: visible;
  width: 81px;
  white-space: nowrap;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  color: rgb(245, 245, 240);
}

#setings {
  opacity: 0.95;
  position: absolute;
  width: 20px;
  height: 20px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Trac_53 {
  fill: transparent;
  stroke: rgb(255, 255, 255);
  stroke-width: 2px;
  stroke-linejoin: round;
  stroke-linecap: round;
  stroke-miterlimit: 4;
  shape-rendering: auto;
}

.Trac_53 {
  overflow: visible;
  position: absolute;
  width: 8.545px;
  height: 8.545px;
  left: 6.727px;
  top: 6.727px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Trac_54 {
  fill: transparent;
  stroke: rgb(255, 255, 255);
  stroke-width: 2px;
  stroke-linejoin: round;
  stroke-linecap: round;
  stroke-miterlimit: 4;
  shape-rendering: auto;
}

.Trac_54 {
  overflow: visible;
  position: absolute;
  width: 22px;
  height: 22px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#nav_helps {
  position: absolute;
  width: 96.075px;
  height: 24.625px;
  left: 39.925px;
  top: 620.375px;
  overflow: visible;
}

#Helps {
  left: 42.075px;
  top: 4.625px;
  position: absolute;
  overflow: visible;
  width: 55px;
  white-space: nowrap;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  color: rgb(245, 245, 240);
}

#Icon_ionic-ios-information-cir {
  position: absolute;
  width: 24.075px;
  height: 24.075px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Trac_55 {
  fill: rgb(245, 245, 240);
}

.Trac_55 {
  overflow: visible;
  position: absolute;
  width: 2.384px;
  height: 11.557px;
  left: 10.845px;
  top: 6.036px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Trac_56 {
  fill: rgb(245, 245, 240);
}

.Trac_56 {
  overflow: visible;
  position: absolute;
  width: 24.075px;
  height: 24.075px;
  left: 0px;
  top: 0px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Trac_57 {
  fill: rgb(236, 53, 58);
}

.Trac_57 {
  overflow: visible;
  position: absolute;
  width: 25px;
  height: 25px;
  left: 214px;
  top: 302px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Trac_58 {
  fill: rgb(236, 53, 58);
}

.Trac_58 {
  overflow: visible;
  position: absolute;
  width: 25px;
  height: 25px;
  left: 214px;
  top: 378px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#n__ot {
  left: 223px;
  top: 310px;
  position: absolute;
  overflow: visible;
  width: 8px;
  white-space: nowrap;
  line-height: 54px;
  margin-top: -22px;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: bold;
  font-size: 10px;
  color: rgb(255, 255, 255);
  letter-spacing: 0.2px;
}

#n_2_ou {
  left: 220px;
  top: 386px;
  position: absolute;
  overflow: visible;
  width: 14px;
  white-space: nowrap;
  line-height: 54px;
  margin-top: -22px;
  text-align: left;
  font-family: Nexa;
  font-style: normal;
  font-weight: bold;
  font-size: 10px;
  color: rgb(255, 255, 255);
  letter-spacing: 0.2px;
}

#Sort_by {
  left: 1485.271px;
  top: 717px;
  position: absolute;
  overflow: visible;
  width: 68px;
  white-space: nowrap;
  text-align: left;
  font-family: SF Pro Display;
  font-style: normal;
  font-weight: bold;
  font-size: 20px;
  color: rgb(101, 101, 201);
  letter-spacing: 0.2px;
}

#calendar_filtre {
  position: absolute;
  width: 254px;
  height: 44px;
  left: 1571px;
  top: 707px;
  overflow: visible;
}

#Frame_427321987_ox {
  fill: rgb(245, 245, 240);
}

.Frame_427321987_ox {
  position: absolute;
  overflow: visible;
  width: 254px;
  height: 44px;
  left: 0px;
  top: 0px;
}

#Frame_oy {
  position: absolute;
  width: 223.644px;
  height: 20px;
  left: 14px;
  top: 12px;
  overflow: visible;
}

#Frame_oz {
  fill: transparent;
}

.Frame_oz {
  position: absolute;
  overflow: visible;
  width: 20px;
  height: 20px;
  left: 0px;
  top: 0px;
}

#Vector_o {
  fill: rgb(0, 0, 0);
}

.Vector_o {
  display: none;
  overflow: visible;
  position: absolute;
  width: 16.268px;
  height: 16.268px;
  left: 1.858px;
  top: 1.858px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Icon_metro-calendar {
  fill: rgb(173, 181, 178);
}

.Icon_metro-calendar {
  overflow: visible;
  position: absolute;
  width: 18px;
  height: 19.2px;
  left: 205.644px;
  top: 0.567px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Search_something_o {
  left: 20px;
  top: 13px;
  position: absolute;
  overflow: visible;
  width: 108px;
  height: 19px;
  line-height: 19px;
  margin-top: -1.5px;
  text-align: left;
  font-family: SF Pro Display;
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  color: rgba(17, 17, 17, 0.502);
}

#search_o {
  position: absolute;
  width: 190px;
  height: 44px;
  left: 325px;
  top: 586px;
  overflow: visible;
}

#Frame_427321987_o {
  position: absolute;
  width: 190px;
  height: 44px;
  left: 0px;
  top: 0px;
  overflow: visible;
}

#Frame_427321987_pa {
  fill: rgb(213, 224, 220);
}

.Frame_427321987_pa {
  filter: drop-shadow(0px 2px 20px rgba(61, 6, 75, 0.102));
  position: absolute;
  overflow: visible;
  width: 250px;
  height: 104px;
  left: 0px;
  top: 0px;
}

#Frame_o {
  position: absolute;
  width: 1px;
  height: 1px;
  left: 1468px;
  top: -2204px;
  overflow: visible;
}

#Vector_pa {
  fill: rgb(0, 0, 0);
}

.Vector_pa {
  display: none;
  overflow: visible;
  position: absolute;
  width: 16.268px;
  height: 16.268px;
  left: -1386.653px;
  top: 2217.858px;
  transform: matrix(1, 0, 0, 1, 0, 0);
}

#Frame_427321987_pb {
  fill: rgb(213, 224, 220);
}

.Frame_427321987_pb {
  filter: drop-shadow(0px 2px 20px rgba(61, 6, 75, 0.102));
  position: absolute;
  overflow: visible;
  width: 250px;
  height: 104px;
  left: 325px;
  top: 586px;
}

#Export_in_csv {
  left: 360px;
  top: 596px;
  position: absolute;
  overflow: visible;
  width: 121px;
  white-space: nowrap;
  text-align: left;
  font-family: SF Pro Display;
  font-style: normal;
  font-weight: bold;
  font-size: 20px;
  color: rgb(101, 101, 201);
  letter-spacing: 0.2px;
}

.side-nav .vg-logo, .side-nav .logo-twiff {
  text-align: center;
}
.side-nav .vg-logo img, .side-nav .logo-twiff img {
  width: 12em;
}
.side-nav .vg-menu {
  display: grid;
  align-content: space-between;
  height: 94%;
  max-height: 94%;
  overflow-y: auto;
  overflow-x: hidden;
  justify-content: center;
}
.side-nav .vg-menu .vg-top-menu {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: calc(100vh - 60px);
  width: 38px;
}
.side-nav .vg-menu .vg-top-menu span.select2-container {
  width: 10% !important;
}
.side-nav .vg-menu ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.side-nav .vg-menu ul li {
  padding: 11px 0 6px 15px;
  margin: 10px 0;
  position: relative;
  border-radius: 100%;
  /* a {
     text-decoration: none;
     &:hover {
       cursor: pointer;
     }
   }
   i {
     color: $white-color;
     font-size: 19px;
   }
   &:hover {
     background: $white-color;
     cursor: pointer;
     svg.w-svg g path,
     svg path {
       fill: #2f2fc9 !important;
     }
   }
   &:hover i,
   &:hover label {
     color: #2f2fc9;
     &:hover {
       cursor: pointer;
     }
   }
   &.vg-active {
     background: $white-color;
     i,
     label {
       color: #2f2fc9;
     }
     svg.w-svg g path,
     svg path {
       fill: #2f2fc9 !important;
     }
   }

   span {
     display: flex;
     gap: 15px;
     align-items: center;
   }
   label {
     font-size: 14px;
     color: $white-color;
     font-family: "NexaLight", sans-serif;
     font-weight: lighter !important;
   }*/
}
.side-nav .vg-menu ul li a {
  text-decoration: none;
}
.side-nav .vg-menu ul li a:hover {
  cursor: pointer;
}
.side-nav .vg-menu ul li i {
  color: #fff;
  font-size: 19px;
}
.side-nav .vg-menu ul li.vg-active {
  background: #fff;
}
.side-nav .vg-menu ul li.vg-active i,
.side-nav .vg-menu ul li.vg-active label {
  color: #2f2fc9 !important;
}
.side-nav .vg-menu ul li.vg-active svg.w-svg g path,
.side-nav .vg-menu ul li.vg-active svg path {
  fill: #2f2fc9 !important;
}
.side-nav .vg-menu ul li span {
  display: flex;
  justify-content: center;
  gap: 8px;
  align-items: center;
}
.side-nav .vg-menu ul li label {
  font-size: 14px;
  color: #fff;
  font-family: "NexaLight", sans-serif;
  font-weight: lighter !important;
}
.side-nav .vg-menu .sub-menu {
  position: fixed;
  left: 46px;
  background: #fff;
  z-index: 999;
  height: auto;
  max-height: auto;
  padding: 0;
  box-shadow: 0 0 10px -6px rgba(0, 0, 0, 0.3098039216);
  border-radius: 8px;
  transform: translate(10px, -31px);
}
.side-nav .vg-menu .sub-menu li {
  margin: 0;
  border-bottom: 1px solid #eaeaff;
  border-radius: 0px;
  padding: 6px 26px !important;
}
.side-nav .vg-menu .sub-menu li:hover {
  background: #f7f7f7;
  transition: 0.4s;
  cursor: pointer;
}
.side-nav .vg-menu .sub-menu li:hover span {
  cursor: pointer;
}
.side-nav .vg-menu .sub-menu li:hover svg path {
  fill: #0C0C53 !important;
}
.side-nav .vg-menu .sub-menu label {
  display: block;
  color: #0C0C53 !important;
}
.side-nav .vg-menu .sub-menu i {
  color: #0C0C53 !important;
}
.side-nav .vg-menu .sub-menu svg {
  fill: #0C0C53;
}
.side-nav .vg-menu .sub-menu .language-selector {
  justify-content: flex-start !important;
}

#menu-gche ul li svg {
  position: relative;
  top: -3px;
}
#menu-gche ul li a label:hover {
  cursor: pointer;
}

.menu:hover {
  background: rgba(255, 255, 255, 0.26);
  cursor: pointer;
}
.menu:hover svg.w-svg g path,
.menu:hover svg path {
  fill: #fff !important;
}

#menudopdown:hover .sub-menu {
  max-height: 150px !important;
}

button.vg-btn-add-form {
  border: none;
  font-size: 12px;
  color: #25265e;
  padding: 4px 14px;
  font-weight: bolder;
  font-family: "NexaBold", sans-serif;
  background: transparent;
  box-shadow: none;
}
button.vg-btn-add-form:hover {
  color: #0C0C53;
}

button.vg-btn-add-file {
  border: none;
  font-size: 12px;
  color: #25265e;
  padding: 4px 14px;
  font-weight: bolder;
  font-family: "NexaBold", sans-serif;
  background: transparent;
  box-shadow: none;
}
button.vg-btn-add-file:hover {
  color: #0C0C53;
}

button.vg-btn-add-file-equipe {
  border: none;
  font-size: 12px;
  color: #25265e;
  padding: 4px 14px;
  background-color: #fff;
  font-weight: bolder;
  font-family: "NexaBold", sans-serif;
}
button.vg-btn-add-file-equipe:hover {
  color: #0C0C53;
  background: transparent;
  box-shadow: none;
}

button.vg-btn-add-form.m-active,
button.vg-btn-add-file-equipe.m-active,
button.vg-btn-add-file.m-active {
  color: #2f2fc2;
  border-bottom: 1px solid #2f2fc2;
  font-weight: bolder;
  font-family: "NexaBold", sans-serif;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.vg-search-contact {
  position: relative;
}
.vg-search-contact i {
  position: absolute;
  background: #ffffff;
  padding: 7px 8px;
  left: -34px;
  color: #898787;
  border: 1px solid #ffffff;
  border-radius: 5px;
}
.vg-search-contact input {
  position: relative;
  right: 2px;
}
.vg-search-contact input:focus {
  border: 1px solid #0C0C53;
  outline: none;
  box-shadow: none;
}

.vg-action-head-contact {
  display: flex;
  align-items: center;
  gap: 5px;
}

.vg-content-contact ul,
.vg-content-call ul {
  list-style: none;
  padding: 19px 22px;
  height: 84vh;
  overflow-y: scroll;
}
.vg-content-contact ul li,
.vg-content-call ul li {
  padding: 9px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.0392156863);
  border-radius: 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.vg-content-contact ul li:hover,
.vg-content-call ul li:hover {
  background: white;
  padding: 9px 18px;
}
.vg-content-contact ul li:hover .vg-profile,
.vg-content-call ul li:hover .vg-profile {
  background: rgb(238, 238, 238) !important;
}
.vg-content-contact ul li .vg-call,
.vg-content-call ul li .vg-call {
  background: #f5f5f1;
  color: #25265e;
}
.vg-content-contact ul li .vg-pen,
.vg-content-call ul li .vg-pen {
  background: #f5f5f1;
  color: #25265e;
}
.vg-content-contact ul li .vg-trash,
.vg-content-call ul li .vg-trash {
  background: #f5f5f1;
  color: #25265e;
}
.vg-content-contact ul li .vg-sms,
.vg-content-call ul li .vg-sms {
  background: #f5f5f1;
  color: #25265e;
}
.vg-content-contact ul li .vg-action-contact,
.vg-content-call ul li .vg-action-contact {
  display: none;
}
.vg-content-contact ul li:hover .vg-action-contact,
.vg-content-call ul li:hover .vg-action-contact {
  transition: 0.4s;
  cursor: pointer;
  display: block;
}
.vg-content-contact .vg-profile-head,
.vg-content-call .vg-profile-head {
  display: grid;
  grid-template-columns: 60px 2fr 1fr 2fr;
}
.vg-content-contact .vg-profile-head .vg-profile,
.vg-content-call .vg-profile-head .vg-profile {
  background: rgb(255, 255, 255);
  width: 46px;
  height: 46px;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 500;
  font-size: 15px;
  color: rgba(54, 54, 54, 0.4);
}
.vg-content-contact .vg-profile-head .vg-info-profile label,
.vg-content-call .vg-profile-head .vg-info-profile label {
  white-space: nowrap;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  overflow: hidden;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 0;
  line-height: 1;
}
.vg-content-contact .vg-profile-head .vg-info-profile p,
.vg-content-call .vg-profile-head .vg-info-profile p {
  color: #969696;
  font-size: 14px;
  margin-bottom: 0;
}

.vg-notice-form {
  margin-top: 0;
  background: #f9f9f9;
  padding: 11px 14px;
  border-radius: 9px;
}
.vg-notice-form .rmq {
  padding: 5px 0;
  font-size: 14px;
  color: #8e8e8e;
  text-align: center;
}

.vg-file-import {
  margin-top: 29px !important;
  margin-bottom: 20px;
}
.vg-file-import input[type=file] {
  padding: 0 !important;
  border: none !important;
}
.vg-file-import input[type=file]::file-selector-button {
  margin-right: 20px;
  border: none;
  background: #0C0C53;
  padding: 10px 20px !important;
  border-radius: 10px;
  color: #fff;
  cursor: pointer;
  transition: background 0.2s ease-in-out;
}
.vg-file-import input[type=file]::file-selector-button:hover {
  background: #0d45a5;
}

.vg-section-new-sms {
  display: grid;
  grid-template-columns: 2fr 2fr;
}
.vg-section-new-sms .vg-content-contact h6 {
  border-bottom: 1px solid #e5e5e5;
}
.vg-section-new-sms .vg-footer-action {
  display: block !important;
}
.vg-section-new-sms .vg-footer-action .vg-action-message {
  margin-top: 20px;
  display: flex !important;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
}
.vg-section-new-sms .vg-footer-action .vg-action-message button {
  background: #44cba3;
  border-color: #44cba3;
  height: 35px;
  width: auto !important;
  border-radius: 6px !important;
  color: #fff;
  padding: 0 19px !important;
  margin-left: 0 !important;
}
.vg-section-new-sms .vg-col-left-new-message {
  background: white;
  display: grid;
  padding: 0 32px;
  gap: 23px;
  height: 78vh;
  margin: 26px 29px;
  grid-template-rows: 1fr 0.1fr 2fr;
}
.vg-section-new-sms .vg-col-left-new-message h6 {
  color: #0C0C53;
  text-align: center;
}
.vg-section-new-sms .vg-col-left-new-message .vg-icon-plane {
  margin: 26px auto 0;
  background: rgba(68, 203, 163, 0.1098039216);
  color: #44cba3;
  padding: 34px 45px;
  font-size: 33px;
  border-radius: 100%;
  width: fit-content;
  height: fit-content;
}

.vg-profile-head-cust {
  display: grid;
  grid-template-columns: 60px 2fr 2fr !important;
}

#listContact .vg-action-contact {
  display: flex;
  gap: 12px;
}

#titleHeadContent {
  display: flex;
  align-items: center;
  gap: 20px;
}

.action-table {
  display: flex;
  gap: 20px;
}
.action-table button {
  border-radius: 100%;
}
.action-table button:hover {
  opacity: 0.7;
  cursor: pointer;
}
.action-table .btn-call {
  background-color: #24bf7a;
  color: #fff;
  padding: 5px 6px;
}
.action-table .btn-sms {
  background-color: #2f2fc2;
  color: #fff;
  padding: 5px 5px;
}
.action-table .btn-note {
  background-color: #fb8e00;
  color: #fff;
  padding: 4px 10px 0;
}
.action-table .btn-pen {
  background-color: #fb8e00;
  color: #fff;
  padding: 4px 9px !important;
}
.action-table .btn-play {
  padding: 0;
  box-shadow: none;
  background: none;
}
.action-table .btn-note-vide {
  background-color: #c8c8c8;
  color: #fff;
  padding: 4px 10px 0;
}
.action-table .btn-trash {
  background-color: #ec363b;
  color: #fff;
  padding: 4px 5px !important;
}
.action-table .btn-add-pr {
  padding: 5px 7px 5px 10px !important;
}
.action-table .btn-add-pr i {
  font-size: 13px;
}

#table_contact tr th.GRP {
  width: auto !important;
}

.bl-history-profile {
  padding-top: 20px;
}

.vg-contact-profile {
  height: 72vh;
  width: 100%;
}
.vg-contact-profile .vg-table-content {
  height: 52vh !important;
  max-height: 52vh !important;
  overflow: auto;
}

.dr-rt .last-activity i {
  color: #bababa;
  margin-right: 6px;
}
.dr-rt .last-activity .info-group {
  color: #2f2fc2;
  font-size: 14px;
}
.dr-rt .last-activity .info-history {
  color: #969494;
  font-size: 14px;
  font-weight: 400;
  margin: 5px 0 12px;
}
.dr-rt .chips-action {
  display: flex;
  margin-top: 18px;
  gap: 8px;
}
.dr-rt .chips-action .chips {
  margin: 0;
  border: 1px solid #c8c8c8;
  padding: 2px 9px 0;
  border-radius: 7px;
  font-size: 12px;
}
.dr-rt .work-email .label {
  display: flex;
  gap: 12px;
}
.dr-rt .work-email .label span {
  color: #000;
  font-weight: 700;
  font-size: 14px;
}
.dr-rt .work-email .label .mail-valid {
  color: #2f2fc2 !important;
}
.dr-rt .dr-content .show-more {
  color: #2f2fc2;
  font-weight: bold;
  font-size: 14px;
  text-decoration: underline;
}

.vg-table-content {
  position: relative;
}

#table_contact_wrapper #table_contact_paginate {
  display: block;
}

.customize-paginate {
  width: fit-content;
  float: inline-end;
  position: relative;
  bottom: -15px;
}

.overlay-pagination {
  background-color: rgba(255, 255, 255, 0.6509803922);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  z-index: 9;
  display: none;
}

.vg-tab-call,
.vg-tab-config {
  background: white;
  border-bottom: 1px solid #efefef;
}
.vg-tab-call .vg-btn-manquee,
.vg-tab-call .vg-btn-profile,
.vg-tab-config .vg-btn-manquee,
.vg-tab-config .vg-btn-profile {
  border: none;
  padding: 6px 37px;
  color: #ec363b;
  font-size: 12px;
}
.vg-tab-call .vg-btn-manquee:hover,
.vg-tab-call .vg-btn-profile:hover,
.vg-tab-config .vg-btn-manquee:hover,
.vg-tab-config .vg-btn-profile:hover {
  color: white !important;
  background: #2d9c7b !important;
}
.vg-tab-call .vg-btn-history,
.vg-tab-call .vg-btn-config-compte,
.vg-tab-call .vg-btn-config-voice-recording,
.vg-tab-config .vg-btn-history,
.vg-tab-config .vg-btn-config-compte,
.vg-tab-config .vg-btn-config-voice-recording {
  border: none;
  background: #ffffff;
  padding: 6px 37px;
  color: #fb8e00;
  font-size: 12px;
}
.vg-tab-call .vg-btn-history:hover,
.vg-tab-call .vg-btn-config-compte:hover,
.vg-tab-call .vg-btn-config-voice-recording:hover,
.vg-tab-config .vg-btn-history:hover,
.vg-tab-config .vg-btn-config-compte:hover,
.vg-tab-config .vg-btn-config-voice-recording:hover {
  color: white !important;
  background: #2d9c7b !important;
}
.vg-tab-call .m-active,
.vg-tab-config .m-active {
  background: #0C0C53 !important;
  color: #fff !important;
  font-size: 12px;
}

#action_call {
  gap: 16px;
  position: absolute;
  right: 33px;
}

.vg-content-call ul li .vg-profile-head .vg-info-profile {
  margin-right: 19px;
}
.vg-content-call ul li .vg-profile-head .vg-info-profile p i.ico-inbound {
  transform: rotate(-51deg);
  color: #ec363b;
}
.vg-content-call ul li .vg-profile-head .vg-info-profile p i.ico-outbound {
  transform: rotate(134deg);
  color: #24bf7a;
}
.vg-content-call ul li .vg-profile-head .vg-status-call {
  display: grid;
  justify-content: center;
  border-left: 1px solid #e4d6d6;
}
.vg-content-call ul li .vg-profile-head .vg-status-call label {
  font-size: 12px;
  position: relative;
  text-align: center;
}
.vg-content-call ul li .vg-profile-head .vg-status-call .vg-status-appel-termine,
.vg-content-call ul li .vg-profile-head .vg-status-call .vg-status-appel-manque,
.vg-content-call ul li .vg-profile-head .vg-status-call .vg-status-appel-refus {
  color: #fff;
  padding: 3px 10px;
  font-size: 12px;
  border-radius: 4px;
  margin-left: 8px;
}
.vg-content-call ul li .vg-profile-head .vg-status-call .vg-status-appel-termine {
  color: #24bf7a;
}
.vg-content-call ul li .vg-profile-head .vg-status-call .vg-status-appel-manque {
  color: #ec363b;
}
.vg-content-call ul li .vg-profile-head .vg-status-call .vg-status-appel-refus {
  color: #fb8e00;
}
.vg-content-call ul li .vg-profile-head .vg-times-date-call {
  display: grid;
  border-left: 1px solid #e4d6d6;
  padding-left: 17px;
}
.vg-content-call ul li .vg-profile-head .vg-times-date-call span {
  font-size: 12px;
  color: #858282;
}

.vg-section-reset-pass {
  margin-top: 10%;
  padding: 24px 35px 34px;
}

/*-------------------------------*/
.btn-end-call {
  color: white;
  width: 19px;
  height: 23px;
  background-color: red;
  padding: 22px;
  border-radius: 50%;
  font-size: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.width-btn-number-end-call div {
  color: white;
  width: 23px;
  height: 23px;
  background-color: red;
  justify-content: center;
  padding: 22px;
  border-radius: 50%;
  font-size: 18px;
}

.width-btn-number-call {
  width: 100%;
}

.width-btn-number-call div {
  width: 64%;
  margin: 80px auto !important;
}

.width-btn-number-call button {
  color: white;
  width: 100%;
  background-color: #26c77e;
  justify-content: center;
  padding: 7px 0 6px;
  font-size: 14px;
  border-radius: 35px;
  font-family: "SfprodRegular", sans-serif;
}

.width-btn-number-end-call div:hover {
  background-color: rgb(217, 65, 65);
  transition: 0.4s;
  cursor: pointer;
}

.width-btn-number-end-call div i {
  position: relative;
  top: -12px;
  right: 8px;
}

.width-btn-number-call button:hover {
  opacity: 0.7;
  transition: 0.4s;
  cursor: pointer;
}

.width-btn-number-call div i {
  position: relative;
  top: -14px;
  right: 8px;
}

.offcanvas-header {
  background: var(--secondaryColor);
  margin-bottom: 6px;
}

.offcanvas-header h5 {
  color: #fff;
  font-size: 14px;
  padding: 9px 0;
}

.offcanvas-top {
  top: 0;
  right: 25%;
  left: 25%;
  height: 30vh;
  max-height: 97%;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  transform: translateY(-100%);
}

#show_call {
  height: fit-content;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
}
#show_call .offcanvas-body {
  padding: 21px 0;
}

#incoming-calls-client #appel_entrant,
#incoming-calls-client #info_call {
  color: #35c836 !important;
}
#incoming-calls-client h5 {
  color: rgba(255, 255, 255, 0.5490196078) !important;
  margin: 13px 0 !important;
}
#incoming-calls-client p {
  color: #fff !important;
}
#incoming-calls-client i.fa-microphone {
  margin: 10px auto !important;
}

.offcanvas {
  position: fixed;
  bottom: 0;
  z-index: 1050;
  /* display: flex; */
  flex-direction: column;
  max-width: 325px;
  display: flex !important;
  justify-content: center !important;
  background-color: #25265e !important;
  background-clip: padding-box;
  outline: 0;
  transition: transform 0.3s ease-in-out;
  left: 38%;
}

.icon-status-apl-entrant {
  transform: rotate(130deg);
  -webkit-transform: rotate(130deg);
  -moz-transform: rotate(130deg);
  -ms-transform: rotate(130deg);
  -o-transform: rotate(130deg);
  color: green;
}

.icon-status-apl-sortant {
  transform: rotate(-50deg);
  -webkit-transform: rotate(-50deg);
  -moz-transform: rotate(-50deg);
  -ms-transform: rotate(-50deg);
  -o-transform: rotate(-50deg);
  color: blue;
}

.icon-status-apl-refuser {
  transform: rotate(-50deg);
  -webkit-transform: rotate(-50deg);
  -moz-transform: rotate(-50deg);
  -ms-transform: rotate(-50deg);
  -o-transform: rotate(-50deg);
  color: red;
}

.service_client {
  width: auto;
  height: auto;
  padding: 17px;
  background-color: white !important;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  position: fixed;
  right: 3%;
  z-index: 9999999;
  bottom: 10%;
}

.offcanvas-body {
  text-align: center;
}

.interface_service_client {
  width: 30vw;
  height: 75%;
  overflow-y: auto;
  background-color: white !important;
  position: fixed;
  right: 3%;
  bottom: 20%;
  z-index: 9999999;
  border-radius: 3%;
  -webkit-border-radius: 3%;
  -moz-border-radius: 3%;
  -ms-border-radius: 3%;
  -o-border-radius: 3%;
  display: none;
}

.bg_header {
  background-color: #0C0C53 !important;
  padding: 10px;
  border-radius: 3%;
  -webkit-border-radius: 3%;
  -moz-border-radius: 3%;
  -ms-border-radius: 3%;
  -o-border-radius: 3%;
  padding: 9px 14px 9px 26px;
  position: sticky;
  top: 0;
  z-index: 1;
}

.header_service_client {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  color: white;
}
.header_service_client .title-chat {
  display: flex;
  gap: 12px;
  align-items: center;
}

.service_client_img {
  width: 40px;
  height: auto;
}

.service_client_img_icon {
  width: 30px;
  height: auto;
  filter: invert(1);
}

.message_chatbot {
  width: 27vw;
  max-width: 100%;
  height: auto;
  background-color: #f6f8fa;
  color: black;
  padding: 7px;
  border-radius: 5%;
  -webkit-border-radius: 5%;
  -moz-border-radius: 5%;
  -ms-border-radius: 5%;
  -o-border-radius: 5%;
  border-radius: 9px;
  -ms-border-radius: 1%;
  -o-border-radius: 1%;
  padding: 16px 24px;
  margin: 7px 0;
  font-size: 13px;
  line-height: 1.7;
}

.message_chatbot_faq {
  width: 90%;
  max-width: 100%;
  height: auto;
  background-color: #f6f8fa;
  color: black;
  padding: 7px;
  border-radius: 5%;
  -webkit-border-radius: 5%;
  -moz-border-radius: 5%;
  -ms-border-radius: 5%;
  -o-border-radius: 5%;
  border-radius: 9px;
  -ms-border-radius: 1%;
  -o-border-radius: 1%;
  padding: 16px 24px;
  margin: 7px 0;
  font-size: 13px;
  line-height: 1.7;
}

.message_chatbot_list {
  width: 70%;
  max-width: 100%;
  height: auto;
  background-color: #f6f8fa;
  color: black;
  padding: 7px;
  border-radius: 5%;
  -webkit-border-radius: 5%;
  -moz-border-radius: 5%;
  -ms-border-radius: 5%;
  -o-border-radius: 5%;
  border-radius: 9px;
  -ms-border-radius: 1%;
  -o-border-radius: 1%;
  padding: 16px 24px;
  margin: 7px 0;
  font-size: 13px;
  line-height: 1.7;
}

.div_service_chatbot {
  right: 0%;
  position: relative;
  justify-content: flex-end;
  display: grid;
  width: 100%;
}

.div_service_chatbot_answer {
  left: 0%;
  position: relative;
  display: grid;
  width: 100%;
}

.div_service_chatbot_question {
  right: 0%;
  position: relative;
  justify-content: flex-end;
  display: grid;
  width: 100%;
}

.title-question {
  font-size: 11px;
}

.title-question-relation {
  font-size: 11px;
}

.list_service_chatbot_faq {
  width: 100%;
  margin: 1px;
  border: 1px solid rgba(38, 38, 94, 0.2117647059) !important;
  height: auto;
  font-size: 11px;
  color: #26265e;
  padding: 7px;
  border-radius: 1%;
  -webkit-border-radius: 1%;
  -moz-border-radius: 1%;
  border-radius: 9px;
  -ms-border-radius: 1%;
  -o-border-radius: 1%;
  padding: 9px 15px;
  margin: 7px 0;
  font-size: 13px;
}
.list_service_chatbot_faq:hover {
  cursor: pointer;
  transition: 0.4s;
  background: #44cba3;
  color: #fff;
}

.list_service_chatbot {
  width: 22vw;
  margin: 1px;
  border: 1px solid rgba(38, 38, 94, 0.2117647059) !important;
  height: auto;
  font-size: 11px;
  /* background-color: #26265e !important; */
  color: #26265e;
  padding: 7px;
  border-radius: 1%;
  -webkit-border-radius: 1%;
  -moz-border-radius: 1%;
  border-radius: 9px;
  -ms-border-radius: 1%;
  -o-border-radius: 1%;
  padding: 9px 15px;
  margin: 7px 0;
  font-size: 13px;
}
.list_service_chatbot:hover {
  cursor: pointer;
  transition: 0.4s;
  background: #44cba3;
  color: #fff;
}

.list_service_chatbot-relation {
  width: 22vw;
  margin: 1px;
  border: 1px solid #ffc107 !important;
  height: auto;
  font-size: 11px;
  /* background-color: #26265e !important; */
  color: #26265e;
  padding: 7px;
  border-radius: 1%;
  -webkit-border-radius: 1%;
  -moz-border-radius: 1%;
  border-radius: 9px;
  -ms-border-radius: 1%;
  -o-border-radius: 1%;
  padding: 9px 15px;
  margin: 7px 0;
  font-size: 13px;
}
.list_service_chatbot-relation:hover {
  cursor: pointer;
  transition: 0.4s;
  background: #ffc107;
  color: #fff;
}

.q-active-faq {
  width: 50%;
  margin: 1px;
  border: 1px solid #1ae4a8 !important;
  height: auto;
  font-size: 11px;
  background-color: #cdece3 !important;
  color: #26265e;
  padding: 7px;
  border-radius: 1%;
  -webkit-border-radius: 1%;
  -moz-border-radius: 1%;
  -ms-border-radius: 1%;
  -o-border-radius: 1%;
  border-radius: 9px;
  -ms-border-radius: 1%;
  -o-border-radius: 1%;
  padding: 9px 15px;
  margin: 7px 0 7px auto;
  font-size: 13px;
}

.q-active {
  width: 22vw;
  margin: 1px;
  border: 1px solid #1ae4a8 !important;
  height: auto;
  font-size: 11px;
  background-color: #cdece3 !important;
  color: #26265e;
  padding: 7px;
  border-radius: 1%;
  -webkit-border-radius: 1%;
  -moz-border-radius: 1%;
  -ms-border-radius: 1%;
  -o-border-radius: 1%;
  border-radius: 9px;
  -ms-border-radius: 1%;
  -o-border-radius: 1%;
  padding: 9px 15px;
  margin: 7px 0 7px auto;
  font-size: 13px;
}

.answer_chatbot {
  width: auto;
  max-width: 60%;
  margin: 1px;
  border: 1px solid #4f0bed !important;
  height: auto;
  font-size: 11px;
  background-color: #4f0bed !important;
  color: white;
  padding: 7px;
  border-radius: 1%;
  -webkit-border-radius: 1%;
  -moz-border-radius: 1%;
  -ms-border-radius: 1%;
  -o-border-radius: 1%;
}

.service_chatbot_lagnue {
  text-align: center;
  margin: 5px;
  border: 1px solid #44cba3 !important;
  height: auto;
  font-size: 16px;
  background-color: #44cba3 !important;
  color: white;
  padding: 7px;
  border-radius: 1%;
  -webkit-border-radius: 1%;
  -moz-border-radius: 1%;
  -ms-border-radius: 1%;
  -o-border-radius: 1%;
  border-radius: 9px;
  margin: 12px auto;
  width: 104px;
}
.service_chatbot_lagnue:hover {
  cursor: pointer;
  transition: 0.4s;
  opacity: 0.7;
}

.close-chatbot {
  font-size: 18px;
  padding: 0px 8px;
}
.close-chatbot:hover {
  cursor: pointer;
  transition: 0.4s;
  background: rgba(255, 255, 255, 0.2117647059);
  border-radius: 13px;
}

.list-contact-grouper {
  background-color: gainsboro;
  padding: 4px;
}

.header-call {
  padding: 19px 25px;
}
.header-call h5 {
  color: #6b6b6b;
  font-size: 18px;
  margin-bottom: 34px;
}

#modalCallEnCours .modal-dialog .modal-content {
  background-color: #0C0C53;
}
#modalCallEnCours .modal-dialog .modal-content .modal-body {
  text-align: center;
}
#modalCallEnCours .modal-dialog .modal-content .modal-body p,
#modalCallEnCours .modal-dialog .modal-content .modal-body span,
#modalCallEnCours .modal-dialog .modal-content .modal-body label {
  color: #fff;
  font-family: "SfprodRegular", sans-serif !important;
}
#modalCallEnCours .modal-dialog .modal-content .modal-body .status-call {
  margin: 0 0 7px;
  font-weight: 500;
}
#modalCallEnCours .modal-dialog .modal-content .modal-body .call-user {
  background: #ededed;
  color: #c7c7c7;
  font-size: 24px;
  padding: 16px 18px;
  border-radius: 52px;
  margin: 12px 0;
}
#modalCallEnCours .modal-dialog .modal-content .modal-body .client-call {
  margin-bottom: -2px;
}
#modalCallEnCours .modal-dialog .modal-content .modal-body .phone-client {
  font-size: 12px;
}
#modalCallEnCours .modal-dialog .modal-content .modal-body .form-note .input-form {
  display: flex;
  align-items: end;
  gap: 10px;
  justify-content: center;
}
#modalCallEnCours .modal-dialog .modal-content .modal-body .form-note .input-form label {
  font-size: 12px;
  float: left;
}
#modalCallEnCours .modal-dialog .modal-content .modal-body .form-note textarea {
  margin: 11px 0 23px;
}
#modalCallEnCours .modal-dialog .modal-content .modal-body .form-note .end-call {
  background-color: #ec363b;
  color: #fff;
  padding: 9px 11px 4px;
  border-radius: 100%;
  font-size: 15px;
}
#modalCallEnCours .modal-dialog .modal-content .modal-body .form-note .end-call i {
  transform: rotate(134deg);
}
#modalCallEnCours .modal-dialog .modal-content .modal-body .form-note .start-call {
  background-color: #24bf7a;
  color: #fff;
  padding: 9px 11px 4px;
  border-radius: 100%;
  font-size: 15px;
}
#modalCallEnCours .modal-dialog .modal-content .modal-body .form-note .start-call i {
  transform: rotate(25deg);
  -webkit-transform: rotate(25deg);
  -moz-transform: rotate(25deg);
  -ms-transform: rotate(25deg);
  -o-transform: rotate(25deg);
}

/* #show_call {
  .modal-dialog {
    width: 607px;
    max-width: 607px;
    .modal-content {
      background-color: $primary-color;
      .modal-body {
        text-align: center;
        p,
        span,
        label {
          color: #fff;
          font-family: "SfprodRegular", sans-serif !important;
        }
        .status-call {
          margin: 0 0 7px;
          font-weight: 500;
        }
        .call-user {
          background: #ededed;
          color: #c7c7c7;
          font-size: 40px;
          padding: 16px 20px;
          border-radius: 52px;
          margin: 12px 0;
        }
        .client-call {
          margin-bottom: -2px;
        }
        .phone-client {
          font-size: 12px;
        }
        .form-note {
          .input-form {
            display: flex;
            align-items: end;
            gap: 10px;
            justify-content: center;
            label {
              font-size: 12px;
              float: left;
            }
          }
          textarea {
            margin: 11px 0 23px;
          }
          .end-call {
            background-color: $danger-color;
            color: #fff;
            padding: 12px 14px 7px;
            border-radius: 100%;
            font-size: 15px;
            i {
              transform: rotate(134deg);
            }
          }
          .start-call {
            background-color: $success-color;
            color: #fff;
            padding: 12px 14px 7px;
            border-radius: 100%;
            font-size: 15px;
            i {
              transform: rotate(25deg);
              -webkit-transform: rotate(25deg);
              -moz-transform: rotate(25deg);
              -ms-transform: rotate(25deg);
              -o-transform: rotate(25deg);
            }
          }
        }
      }
    }
  }
} */
.vg-table-content-scroll-faq {
  width: 100%;
  max-height: 80vh; /* Ajustez la hauteur maximale selon vos besoins */
  overflow-y: scroll;
  overflow-x: hidden;
  border: 1px solid #ddd;
  padding: 10px;
  box-sizing: border-box;
}

#show_call .modal-dialog .modal-content {
  background-color: #0C0C53;
}
#show_call .modal-dialog .modal-content .modal-body {
  text-align: center;
}
#show_call .modal-dialog .modal-content .modal-body p,
#show_call .modal-dialog .modal-content .modal-body span,
#show_call .modal-dialog .modal-content .modal-body label {
  color: #fff;
  font-family: "SfprodRegular", sans-serif !important;
}
#show_call .modal-dialog .modal-content .modal-body .status-call {
  margin: 0 0 7px;
  font-weight: 500;
}
#show_call .modal-dialog .modal-content .modal-body .call-user {
  background: #ededed;
  color: #c7c7c7;
  font-size: 40px;
  padding: 16px 20px;
  border-radius: 52px;
  margin: 12px 0;
}
#show_call .modal-dialog .modal-content .modal-body .client-call {
  margin-bottom: -2px;
}
#show_call .modal-dialog .modal-content .modal-body .phone-client {
  font-size: 12px;
}
#show_call .modal-dialog .modal-content .modal-body .form-note .input-form {
  display: flex;
  align-items: end;
  gap: 10px;
  justify-content: center;
}
#show_call .modal-dialog .modal-content .modal-body .form-note .input-form label {
  font-size: 12px;
  float: left;
}
#show_call .modal-dialog .modal-content .modal-body .form-note textarea {
  margin: 11px 0 23px;
}
#show_call .modal-dialog .modal-content .modal-body .form-note .end-call {
  background-color: #ec363b;
  color: #fff;
  padding: 12px 14px 7px;
  border-radius: 100%;
  font-size: 15px;
}
#show_call .modal-dialog .modal-content .modal-body .form-note .end-call i {
  transform: rotate(134deg);
}
#show_call .modal-dialog .modal-content .modal-body .form-note .start-call {
  background-color: #24bf7a;
  color: #fff;
  padding: 12px 14px 7px;
  border-radius: 100%;
  font-size: 15px;
}
#show_call .modal-dialog .modal-content .modal-body .form-note .start-call i {
  transform: rotate(25deg);
  -webkit-transform: rotate(25deg);
  -moz-transform: rotate(25deg);
  -ms-transform: rotate(25deg);
  -o-transform: rotate(25deg);
}

table#table_call_history tbody tr {
  background-color: #fff !important;
}

#filter-history-team {
  margin-bottom: 4px;
}

@keyframes topToBottom {
  from {
    top: -220px;
  }
  to {
    top: -30px;
  }
}
.small-window {
  position: fixed;
  top: 0%;
  right: 10px;
  width: 200px;
  height: auto;
  z-index: 99999999999;
  background-color: #080820;
  border-radius: 23px;
  display: none;
}

.small-window-recording {
  position: fixed;
  top: 0%;
  right: 20em;
  width: 350px;
  max-width: 350px;
  height: auto;
  padding: 20px;
  z-index: 99999999999;
  background-color: #080820;
  border-radius: 23px;
  display: none;
}

.modal-recording {
  width: 40rem;
  max-width: 40rem;
  position: fixed;
  height: 18rem;
  bottom: 20%;
  z-index: 9999999;
  border-radius: 3%;
  top: 30px;
  /* padding: 20px; */
  -webkit-border-radius: 3%;
  -moz-border-radius: 3%;
  -ms-border-radius: 3%;
  -o-border-radius: 3%;
  /*position: fixed;
  top: 0;
  left: 0;
  z-index: 1060;
  display: none;
  width: 46%;
  height: auto;
  overflow-x: hidden;
  overflow-y: auto;
  outline: 0;
  .modal-dialog-recording{
      transform: none;
      -webkit-transform: none;
      -moz-transform: none;
      -ms-transform: none;
      -o-transform: none;
  }*/
}
.modal-recording .modal-header {
  background-color: #8889da;
}
.modal-recording .btn-close {
  display: flex;
  justify-content: center;
  align-items: center;
}
.modal-recording .btn-stop {
  background-color: #2f2fc9;
  color: white;
  width: 50% !important;
}
.modal-recording .modal-dialog {
  max-width: 100%;
  width: 100%;
}
.modal-recording .modal-dialog .modal-content .modal-header .btn-close {
  background: transparent;
  color: #fff !important;
  opacity: 1;
  position: relative;
  right: -7px;
  top: 0px;
  border: 2px solid white;
  box-sizing: none;
  padding: 10px;
  border-radius: 100%;
}

.modal-call {
  width: 607px;
  max-width: 607px;
  position: fixed;
  bottom: 20%;
  z-index: 99999999999;
  border-radius: 3%;
  top: 30px;
  /* padding: 20px; */
  -webkit-border-radius: 3%;
  -moz-border-radius: 3%;
  -ms-border-radius: 3%;
  -o-border-radius: 3%;
}
.modal-call .modal-dialog {
  max-width: 100%;
  width: 100%;
}
.modal-call .modal-dialog .modal-content {
  position: relative;
  top: -30px;
}
.modal-call .modal-dialog .modal-content .modal-body {
  padding: 23px 32px 23px !important;
}
.modal-call .client-call {
  font-size: 17px;
  font-weight: 600;
}

#show_call.tw-incoming-call,
#modalCallEnCours.tw-ongoing-call {
  height: 100% !important;
  background: rgba(0, 0, 0, 0.4117647059);
}
#show_call.tw-incoming-call .modal-dialog .anim-incoming,
#modalCallEnCours.tw-ongoing-call .modal-dialog .anim-incoming {
  animation: topToBottom 0.5s linear;
}
#show_call.tw-incoming-call .modal-dialog .modal-content,
#modalCallEnCours.tw-ongoing-call .modal-dialog .modal-content {
  position: relative;
  top: -30px;
}
#show_call.tw-incoming-call .modal-dialog .modal-content .modal-body,
#modalCallEnCours.tw-ongoing-call .modal-dialog .modal-content .modal-body {
  padding: 23px 32px 23px !important;
}
#show_call.tw-incoming-call .client-call,
#modalCallEnCours.tw-ongoing-call .client-call {
  font-size: 17px;
  font-weight: 600;
}

#show_note_incoming_call,
#show_note_setting_call_incoming,
#show_note_outgoing_call,
#show_note_setting_call {
  display: block;
  padding: 21px 0 20px !important;
  border-bottom-left-radius: 18px;
  border-bottom-right-radius: 18px;
  overflow-y: auto;
}

.tab-incoming {
  display: flex;
}
.tab-incoming button {
  border: none;
  background: #ebebeb;
}
.tab-incoming .vg-active {
  background: #d99903;
  color: #ffffff;
}

#info_call {
  color: #35c836 !important;
}

p#appel_entrant,
p#info_call {
  color: #35c836 !important;
}

.text-left {
  text-align: left;
}

#show-call-outgoing .modal-dialog {
  margin-bottom: 0;
}
.other-call-action {
  display: flex;
  gap: 10px;
}
.other-call-action .w-50 {
  width: 50%;
}

label#timer_apl_sortant_small_window {
  font-size: 12px;
  position: relative;
  top: 6px;
}

#show_action_reject_call_small_window .btn-end-call {
  padding: 15px;
  font-size: 12px;
}

.vg-body-content .vg-grid {
  display: grid;
  grid-template-columns: 33% 33% 33%;
  grid-template-rows: 146px;
  gap: 18px;
  position: relative;
}
.vg-body-content .vg-grid .grid-col {
  background-color: #24bf7a;
  border-radius: 11px;
  padding: 15px 15px;
  height: 148px;
}
.vg-body-content .vg-grid .grid-col .content-grid {
  color: #fff;
  display: flex;
  gap: 18px;
}
.vg-body-content .vg-grid .grid-col .content-grid i {
  font-size: 63px;
  display: flex;
  align-items: center;
}
.vg-body-content .vg-grid .grid-col .content-grid .grid-stat {
  display: flex;
  gap: 0;
  flex-direction: column;
}
.vg-body-content .vg-grid .grid-col .content-grid .grid-stat label {
  font-size: 12px;
}
.vg-body-content .vg-grid .grid-col .content-grid .grid-stat .stat-dash {
  font-size: 38px !important;
  height: 44px;
  font-weight: 500;
}
.vg-body-content .vg-grid .grid-col .button-grid {
  border-top: 1px solid rgba(255, 255, 255, 0.1411764706);
  padding-top: 14px;
  margin-top: 7px;
}
.vg-body-content .vg-grid .grid-col .button-grid button {
  font-size: 12px;
  padding: 6px 0 3px;
  width: 100%;
  border: none;
  border-radius: 5px;
  margin-top: 0;
}
.vg-body-content .vg-grid .grid-col:nth-child(1) {
  background: linear-gradient(205deg, #22b371, #2e34c7);
}
.vg-body-content .vg-grid .grid-col:nth-child(2) {
  background: linear-gradient(205deg, #6060c9, #2e34c7);
}
.vg-body-content .vg-grid .grid-col:nth-child(3) {
  background-color: #ec363b;
}
.vg-body-content .vg-grid .grid-col:nth-child(5) {
  background-color: #6565c9;
}
.vg-body-content .vg-grid .grid-col:nth-child(6) {
  background: rgba(47, 47, 201, 0.1411764706);
}

#album-rotator {
  width: 100%;
  float: left;
  white-space: nowrap;
  overflow: auto;
  position: relative;
  word-break: keep-all;
  padding: 1rem 0 2rem;
}

#album-rotator-holder {
  position: relative;
  user-select: none;
  will-change: transform;
  /* transition: all 0.01s ease-out; */
  /* transition: all 0.01s linear; */
}

#album-rotator:after {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.album-item {
  word-break: keep-all;
  background: #f5f5f1;
  position: relative;
  width: 270px;
  -webkit-user-drag: none;
  user-drag: none;
  height: 224px;
  user-select: none;
  border-radius: 10px;
  white-space: nowrap;
  overflow: hidden;
  display: inline-block;
  margin: 0 1.5rem 0 0;
  transition: all 0.2s ease-out;
  transform: scale(1);
}

.album-item:hover {
  transform: scale(1.02);
}

.album-details {
  background: transparent;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 25px 30px;
  white-space: initial;
  float: left;
  box-sizing: border-box;
  color: #474747;
  height: 100%;
  font-weight: 600;
  z-index: 99;
  overflow-y: auto;
}

.title {
  font-weight: 900;
  display: inline-block;
  width: 100%;
}

.subtitle {
  font-weight: 100;
  line-height: 1.25rem;
}

.subtext {
  font-size: 1.1167rem;
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 1.25rem 1rem;
  width: 100%;
  white-space: initial;
  letter-spacing: 0;
  box-sizing: border-box;
  font-weight: 400;
}

.icon {
  font-size: 1rem;
  line-height: 1rem;
  display: block;
  padding: 0 0 0.5rem 0;
}

canvas {
  position: absolute;
  top: 0;
  left: 0;
}

h1 {
  font-size: 2.5rem;
  color: white;
  margin: 0;
  font-weight: 600;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

.cls {
  font-size: 1.2rem;
  color: white;
  margin: 0;
  font-weight: 600;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

.form_hc_up {
  background: linear-gradient(2deg, #2f2fc9, #ae6dfc);
  color: #fff;
  padding: 5px 2px 4px;
  width: 111px;
  text-align: center;
  border-radius: 29px;
  font-size: 14px;
  margin-top: 22px;
  height: fit-content;
}

.album-details .fa.fa-user {
  color: #6565c9;
  background: rgba(101, 101, 201, 0.1607843137);
  padding: 14px 16px;
  border-radius: 30px;
  margin-right: 11px;
  font-size: 21px;
}
.album-details label {
  font-weight: bolder;
  color: #000000;
  font-size: 14px;
  position: relative;
  top: -3px;
}
.album-details .content-note {
  font-size: 14px;
  margin: 18px 0;
  line-height: 1.3;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2; /* number of lines to show */
  line-clamp: 2;
  -webkit-box-orient: vertical;
}
.album-details .note-footer {
  font-size: 12px;
  font-weight: bolder;
}
.album-details .note-footer i {
  color: #a2b4d1;
  margin-right: 7px;
}

#Frame_427322017_e {
  position: absolute;
  width: 218.136px;
  height: 163.602px;
  left: 473.314px;
  top: 183.598px;
  overflow: visible;
  background: rgba(47, 47, 201, 0.1411764706);
  border-radius: 10px;
}
#Frame_427322017_e #Frame_427322015_ey {
  left: 0;
  width: 100%;
}
#Frame_427322017_e #Frame_427322015_ey #Frame_427322014_fa {
  width: 100%;
  left: 0;
}

.exp {
  display: flex;
  justify-content: center;
  align-items: center;
}
.exp #export {
  color: #2f2fc9;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.exp #export i {
  font-size: 28px;
  margin-top: 31px;
  margin-bottom: 12px;
}
.exp #export span {
  font-family: "NexaBold", sans-serif;
  font-size: 13px;
  padding-top: 11px;
}
.exp #export svg {
  background: white;
  padding: 0 8px;
  border-radius: 100%;
}

#Group_427319782,
#Group_427319782_da,
#Group_427319782_dr,
#Group_427319782_ed,
#Group_427319782_ez {
  position: relative;
  top: 6px;
}

.mbsc-ios.mbsc-range-control-wrapper .mbsc-segmented {
  margin: 0;
}

.mbsc-ios.mbsc-range-control-wrapper .mbsc-segmented {
  width: 100% !important;
  margin: 0 !important;
}

.mbsc-ios.mbsc-range-day:after {
  background-color: #f2f3ff !important;
}

.mbsc-ios.mbsc-selected .mbsc-calendar-cell-text {
  background: #dee2ff !important;
  border-color: #dee2ff !important;
  color: #2f2fc9 !important;
}

.mbsc-flex.mbsc-flex-1-1.mbsc-calendar-title-wrapper.mbsc-ios {
  position: absolute;
  left: 8vw;
}

element.style {
  float: right;
}

button.mbsc-calendar-button.mbsc-calendar-button-next.mbsc-reset.mbsc-font.mbsc-button.mbsc-ios.mbsc-ltr.mbsc-button-flat.mbsc-icon-button {
  position: absolute !important;
  right: 20px !important;
  background: white;
  box-shadow: 0 0 7px -4px black;
  color: #a9a9ce;
  padding: 0;
  font-size: 12px;
  font-weight: bolder;
}

button.mbsc-calendar-button.mbsc-calendar-button-prev.mbsc-reset.mbsc-font.mbsc-button.mbsc-ios.mbsc-ltr.mbsc-button-flat.mbsc-icon-button {
  background: white;
  box-shadow: 0 0 7px -4px black;
  color: #a9a9ce;
  padding: 0;
  font-size: 12px;
  font-weight: bolder;
  position: relative;
  left: 20px;
}

.mbsc-ios.mbsc-calendar-week-day {
  font-size: 17px !important;
  color: #6565c9 !important;
  font-weight: 800;
}

.mbsc-calendar-title {
  font-weight: 600 !important;
  font-family: "NewaBold", sans-serif !important;
  color: #2f2fc9 !important;
}

.md-mobile-picker-inline {
  box-shadow: 0 0 23px -19px black;
  border-radius: 29px;
}

.mbsc-calendar-cell-text {
  font-weight: 400;
}

.mbsc-calendar-day-outer .mbsc-calendar-cell-text {
  color: #aaaad5;
}

.mbsc-calendar-week-days {
  margin: 12px 0 !important;
}

div#mbsc-control-0 {
  width: 375px !important;
}

.right-dash {
  display: flex;
  justify-content: center;
  padding-top: 49px;
}

.mbsc-range-control-wrapper {
  display: none;
}

.md-mobile-picker-inline {
  margin: 0 !important;
  padding: 14px 14px !important;
}

.mbsc-ios.mbsc-range-day:after,
.mbsc-ios.mbsc-range-hover:before {
  height: 2.875em !important;
  top: 1px !important;
}

.mbsc-calendar-day-inner {
  background-color: #fff;
}

.mbsc-range-day .mbsc-calendar-day-inner {
  background-color: transparent !important;
}

.mbsc-ios.mbsc-datepicker-inline {
  background: transparent !important;
}

.mbsc-ios.mbsc-datepicker .mbsc-calendar {
  border-radius: 22px !important;
}

.mbsc-ios.mbsc-page {
  border-radius: 26px;
}

#startDate,
#endDate {
  background: #e2e2f8;
  font-size: 14px;
  width: 49%;
  color: #0c0d58;
  padding: 5px 0 3px;
  border-radius: 25px;
}
#startDate:hover,
#endDate:hover {
  background-color: rgba(83, 84, 201, 0.5882352941);
  cursor: pointer;
  transition: 0.4;
}

.active-dt {
  background: #5354c9 !important;
  color: #fff !important;
}

.action-date {
  margin-bottom: 16px;
}

.mbsc-ios.mbsc-range-day-start.mbsc-ltr:after {
  border-radius: 16px 0 0 13px !important;
  left: 38% !important;
  margin-left: -0.9375em !important;
  padding-left: 49px !important;
}

.mbsc-ios.mbsc-range-day-end.mbsc-ltr:after {
  border-radius: 0 15px 2px 0 !important;
  margin-right: -0.9375em !important;
  right: 41% !important;
}

.ttl-wraper {
  margin-bottom: 18px !important;
}
.bx-no-data {
  display: flex !important;
  align-items: center !important;
  height: 83%;
  justify-content: center;
  color: #c7c2c2;
}

.start-date-dash {
  margin-bottom: 24px;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  opacity: 1 !important;
}

.start-date, .end-date {
  display: flex;
  gap: 14px;
  margin-top: 16px;
}
.start-date div, .end-date div {
  color: #b2b2b2;
  width: 87px;
  font-size: 39px;
  background: repeating-linear-gradient(12deg, #ebebeb, transparent 100px);
}
.start-date div input, .end-date div input {
  width: 100% !important;
  text-align: center;
  background: transparent;
}
.start-date div input:focus, .end-date div input:focus {
  outline: none;
  border: none;
}
.start-date div .lab-date, .end-date div .lab-date {
  padding: 2px 0;
  font-size: 12px;
  background: #5354c8;
  text-align: center;
  color: #fff;
}
.start-date .start-year, .start-date .end-year, .end-date .start-year, .end-date .end-year {
  width: 129px;
}
.start-date .start-year .lab-date, .start-date .end-year .lab-date, .end-date .start-year .lab-date, .end-date .end-year .lab-date {
  width: 100%;
}

.btn-aff-dash {
  background: #24bf7a;
  color: #fff;
  width: 100%;
  margin: 19px 0 0;
  padding: 6px 0 3px;
  font-size: 14px;
}

.reduce-popup {
  position: absolute;
  right: 20px;
  top: 9px;
}

.tw-inc-identity {
  display: flex;
  gap: 33px;
  align-items: center;
  text-align: initial;
}

.no-note-data {
  width: 100%;
}

.note-dash {
  display: flex;
  align-items: center;
}
.note-dash .label-note-GRP {
  padding: 3px 13px 0 !important;
  margin-bottom: 7px;
}
.note-dash .content-note {
  margin: 13px 0;
  color: #787878;
}

.album-item-dash {
  height: 248px !important;
}

.documentation-wrapper .card img, .documentation-wrapper .card svg {
  height: 11rem !important;
  width: 80% !important;
  margin: auto !important;
  padding-top: 20px !important;
  padding-bottom: 20px !important;
  object-fit: contain !important;
}

#searchWrap {
  display: inline-block;
  height: 35px;
  padding: 0;
  position: relative;
  margin-right: 4px;
}
#searchWrap i {
  position: absolute;
  top: 9px;
  right: 11px;
  color: #a1a1ca;
  z-index: -1;
}
#searchWrap input[type=text] {
  height: 60px;
  font-size: 55px;
  display: inline-block;
  font-weight: 100;
  border: 1px solid #e6e6e6;
  outline: none;
  color: #555;
  padding: 13px 19px;
  width: 0px;
  background: none;
  z-index: 3;
  transition: width 0.4s cubic-bezier(0, 0.795, 0, 1);
  cursor: pointer;
  height: 35px;
}
#searchWrap input[type=text]:focus {
  width: 250px;
  z-index: 1;
  cursor: text;
  font-size: 16px;
  font-weight: 300;
  padding: 0 21px;
  height: 35px;
}

.btn-export-file {
  background: #f5f5f1;
  color: #3032c8;
  width: max-content;
  padding: 0;
  height: fit-content;
  padding: 6px 7px 6px;
  font-size: 14px;
  font-weight: bold;
  border-radius: 0px;
}

.btn-option {
  padding: 10px 10px;
  font-size: 12px;
  position: relative;
  top: 4px;
  background-color: #2f2fc2;
  color: #fff;
}
.btn-option:hover {
  color: #fff;
}

.modal .modal-dialog {
  margin-top: 72px;
}
.modal .modal-dialog .modal-content {
  border-radius: 24px;
}
.modal .modal-dialog .modal-content .modal-header {
  border-top-left-radius: 24px;
  border-top-right-radius: 24px;
  background: #c0c9c6;
  padding: 19px 35px 18px;
  color: #fff;
  font-size: 18px;
}
.modal .modal-dialog .modal-content .modal-header .btn-close {
  background: transparent;
  color: #fff !important;
  opacity: 1;
  position: relative;
  right: -7px;
  top: 0px;
  border: 2px solid white;
  box-sizing: none;
  padding: 6px 5px 2px;
  border-radius: 100%;
}
.modal .modal-dialog .modal-content .modal-header .btn-close:hover {
  color: #c0c9c6 !important;
  background-color: #fff;
  transition: 0.4s;
  cursor: pointer;
}
.modal .modal-dialog .modal-content .modal-body {
  padding: 25px 45px 42px !important;
}
.modal .modal-dialog .modal-content .modal-body .form-modal label {
  font-size: 14px;
  margin-bottom: 7px;
}
.modal .modal-dialog .modal-content .modal-body .form-modal input,
.modal .modal-dialog .modal-content .modal-body .form-modal select,
.modal .modal-dialog .modal-content .modal-body .form-modal textarea {
  background-color: #f5f5f1;
  border: none;
  font-size: 14px;
  padding: 13px 21px;
  border: 1px solid transparent;
}
.modal .modal-dialog .modal-content .modal-body .form-modal input:focus {
  outline: 0 !important;
  box-shadow: none !important;
  border: 1px solid #2f2fc2;
}
.modal .modal-dialog .modal-content .modal-body .modal-footer {
  margin: 0;
  padding: 35px 0 0;
  border-top: none;
}
.modal .modal-dialog .modal-content .modal-body .modal-footer button {
  font-size: 12px;
  width: 100%;
  background: #2f2fc2;
  color: #fff;
  padding: 13px 0 11px;
  margin: 0;
}
.modal .modal-dialog .modal-content .modal-body .modal-footer button:hover {
  transition: 0.4s;
  cursor: pointer;
  opacity: 0.7;
}

.cust-form-txt {
  top: -49px !important;
}

.search-message {
  width: 100% !important;
  padding: 5px 5px 7px 39px;
  background: #f5f5f1;
  border: none;
  font-size: 14px;
}
.search-message::placeholder {
  color: #a8a8a8;
}

.search-sms {
  position: relative;
  padding: 0 25px 0 17px;
}
.search-sms i {
  position: absolute !important;
  z-index: 1;
  top: 10px;
  left: 30px;
  font-size: 14px;
  color: #737373;
}

.new-sms {
  background: #d2ddd9;
  color: #3032c8;
  font-family: "SfprodRegular", sans-serif !important;
}

.sms-section-list {
  height: 83vh;
  border-right: 1px solid #eeeeee;
  padding: 6px 0 10px 40px;
}
.sms-section-list .vg-section-title {
  padding: 0 37px 0 17px;
}
.sms-section-list .vg-title {
  font-size: 30px;
  position: relative;
  top: 5px;
}
.sms-section-list .tab-sms {
  display: flex;
  margin: 16px 0 31px;
  padding: 0 38px 0 16px;
}
.sms-section-list .tab-sms button {
  background-color: #f5f5f1;
  font-size: 12px;
  padding: 11px 22px;
  border-radius: 0;
  box-shadow: none;
  font-family: "SfprodRegular", sans-serif !important;
}
.sms-section-list .tab-sms .tab-sms-active {
  background: #2f2fc2;
  color: #fff;
  border-radius: 7px;
}
.sms-section-list .sms-list {
  padding: 0px;
  height: 54vh;
  overflow-y: auto;
}
.sms-section-list .sms-list li {
  display: flex;
  justify-content: space-between;
  align-items: start;
  padding: 12px 16px;
  margin: 0 24px -2px 15px;
  border-bottom: 1px solid #f6f6f6;
}
.sms-section-list .sms-list li:hover {
  background: #efeeff;
  border-radius: 12px;
  cursor: pointer;
  transition: 0.4s;
}
.sms-section-list .sms-list li span,
.sms-section-list .sms-list li label,
.sms-section-list .sms-list li p {
  font-family: "SfprodRegular", sans-serif !important;
}
.sms-section-list .sms-list li .sms-client-profile {
  color: #8080ec;
  font-size: 12px;
  background: rgba(128, 128, 236, 0.2588235294);
  /* padding: 7px 15px 9px;
  border-radius: 41px;
  margin-right: 15px;
  width: 48px;*/
  padding: 7px 11px 7px;
  border-radius: 48px;
  margin-right: 12px;
  width: 33px;
}
.sms-section-list .sms-list li .content-sms {
  width: 100%;
}
.sms-section-list .sms-list li .content-sms .head-list-sms {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.sms-section-list .sms-list li .content-sms .head-list-sms label {
  font-size: 12px;
  font-weight: 500;
}
.sms-section-list .sms-list li .content-sms .head-list-sms .date-sms .d-sms {
  font-size: 12px;
  color: #9c9c9c;
}
.sms-section-list .sms-list li .content-sms .head-list-sms .date-sms .notif-sms {
  background-color: #3d63fe;
  color: #fff;
  padding: 3px 6px;
  font-size: 12px;
  border-radius: 10px;
  margin-left: 13px;
}
.sms-section-list .sms-list li .content-sms p {
  font-size: 12px;
  color: #898787;
  margin-top: 4px;
  margin-bottom: 0;
}

.w-cust-7 {
  width: 57.333333% !important;
  padding: 0;
}

.section-detail-sms {
  position: relative;
}
.section-detail-sms .head-sms-detail {
  display: flex;
  justify-content: space-between;
  background: #f5f5f1;
  padding: 24px 34px;
}
.section-detail-sms .head-sms-detail .sms-client-profile i {
  color: #8080ec;
  font-size: 17px;
  background: rgba(128, 128, 236, 0.2588235294);
  padding: 9px 12px 11px;
  border-radius: 41px;
  margin-right: 15px;
  width: 38px;
}
.section-detail-sms .head-sms-detail .sms-client-profile span {
  font-family: "SfprodRegular", sans-serif !important;
  font-weight: 500 !important;
  font-size: 14px;
}
.section-detail-sms .list-sms {
  padding: 0px 48px 0;
  list-style: none;
  height: 59vh;
  overflow-y: auto;
  display: flex;
  flex-direction: column-reverse;
}
.section-detail-sms .list-sms .prf-sms {
  display: flex;
  align-items: end;
}
.section-detail-sms .list-sms .li-sms {
  display: flex;
  width: 330px;
  font-size: 14px;
  margin: 2px 0;
}
.section-detail-sms .list-sms .li-sms .content-sms {
  margin-bottom: 14px;
}
.section-detail-sms .list-sms .li-sms .content-sms span {
  font-size: 12px;
  color: #b2a2a2;
}
.section-detail-sms .list-sms .li-sms .content-sms .box-content {
  position: relative;
}
.section-detail-sms .list-sms .li-sms .content-sms .box-content p {
  background: #eff5f5;
  padding: 18px 31px;
  border-radius: 13px;
  border-bottom-left-radius: 0px;
  margin-bottom: 5px;
  font-size: 13px;
  font-family: "SfprodRegular", sans-serif !important;
}
.section-detail-sms .list-sms .inbound-sms #triangle-code,
.section-detail-sms .list-sms .li-sms.inbound #triangle-code {
  display: inline-block;
  height: 0;
  width: 0;
  border-top: 14px solid transparent;
  border-right: 18px solid #eff5f5;
  position: absolute;
  bottom: 0;
  left: -15px;
}
.section-detail-sms .list-sms .li-sms.outbound-sms,
.section-detail-sms .list-sms .li-sms.outbound-api {
  display: flex;
  justify-content: end;
  width: 289px;
  font-size: 14px;
  margin: 0 0 0 auto;
}
.section-detail-sms .list-sms .li-sms.outbound-sms #triangle-code,
.section-detail-sms .list-sms .li-sms.outbound-api #triangle-code {
  display: inline-block;
  height: 0;
  width: 0;
  border-top: 14px solid transparent;
  border-left: 18px solid #24bf7a;
  position: absolute;
  bottom: 0;
  right: -15px;
}
.section-detail-sms .list-sms .li-sms.outbound-sms .prf-sms,
.section-detail-sms .list-sms .li-sms.outbound-api .prf-sms {
  display: none;
}
.section-detail-sms .list-sms .li-sms.outbound-sms .content-sms span,
.section-detail-sms .list-sms .li-sms.outbound-api .content-sms span {
  font-size: 12px;
  color: #b2a2a2;
  float: right;
  margin-top: 7px;
}
.section-detail-sms .list-sms .li-sms.outbound-sms .content-sms .box-content,
.section-detail-sms .list-sms .li-sms.outbound-api .content-sms .box-content {
  position: relative;
}
.section-detail-sms .list-sms .li-sms.outbound-sms .content-sms .box-content p,
.section-detail-sms .list-sms .li-sms.outbound-api .content-sms .box-content p {
  background: #24bf7a;
  padding: 18px 31px;
  border-radius: 13px;
  border-bottom-right-radius: 0px;
  margin-bottom: 5px;
  color: #fff;
}
.section-detail-sms .list-sms i {
  color: #aaaaaa;
  font-size: 17px;
  background: rgba(203, 203, 203, 0.26);
  padding: 9px 12px 11px;
  border-radius: 41px;
  margin-right: 28px;
  width: 38px;
}
.section-detail-sms .list-sms-volet-lateral {
  padding: 0px 48px 0;
  list-style: none;
  height: 69vh;
  max-height: 75vh;
  overflow-y: auto;
  display: flex;
  flex-direction: column-reverse;
}
.section-detail-sms .list-sms-volet-lateral .prf-sms {
  display: flex;
  align-items: end;
}
.section-detail-sms .list-sms-volet-lateral .li-sms {
  display: flex;
  width: 330px;
  font-size: 14px;
  margin: 2px 0;
}
.section-detail-sms .list-sms-volet-lateral .li-sms .content-sms {
  margin-bottom: 14px;
}
.section-detail-sms .list-sms-volet-lateral .li-sms .content-sms span {
  font-size: 12px;
  color: #b2a2a2;
}
.section-detail-sms .list-sms-volet-lateral .li-sms .content-sms .box-content {
  position: relative;
}
.section-detail-sms .list-sms-volet-lateral .li-sms .content-sms .box-content p {
  background: #eff5f5;
  padding: 18px 31px;
  border-radius: 13px;
  border-bottom-left-radius: 0px;
  margin-bottom: 5px;
  font-size: 13px;
  font-family: "SfprodRegular", sans-serif !important;
}
.section-detail-sms .list-sms-volet-lateral .inbound-sms #triangle-code,
.section-detail-sms .list-sms-volet-lateral .li-sms.inbound #triangle-code {
  display: inline-block;
  height: 0;
  width: 0;
  border-top: 14px solid transparent;
  border-right: 18px solid #eff5f5;
  position: absolute;
  bottom: 0;
  left: -15px;
}
.section-detail-sms .list-sms-volet-lateral .li-sms.outbound-sms,
.section-detail-sms .list-sms-volet-lateral .li-sms.outbound-api {
  display: flex;
  justify-content: end;
  width: 289px;
  font-size: 14px;
  margin: 0 0 0 auto;
}
.section-detail-sms .list-sms-volet-lateral .li-sms.outbound-sms #triangle-code,
.section-detail-sms .list-sms-volet-lateral .li-sms.outbound-api #triangle-code {
  display: inline-block;
  height: 0;
  width: 0;
  border-top: 14px solid transparent;
  border-left: 18px solid #24bf7a;
  position: absolute;
  bottom: 0;
  right: -15px;
}
.section-detail-sms .list-sms-volet-lateral .li-sms.outbound-sms .prf-sms,
.section-detail-sms .list-sms-volet-lateral .li-sms.outbound-api .prf-sms {
  display: none;
}
.section-detail-sms .list-sms-volet-lateral .li-sms.outbound-sms .content-sms span,
.section-detail-sms .list-sms-volet-lateral .li-sms.outbound-api .content-sms span {
  font-size: 12px;
  color: #b2a2a2;
  float: right;
  margin-top: 7px;
}
.section-detail-sms .list-sms-volet-lateral .li-sms.outbound-sms .content-sms .box-content,
.section-detail-sms .list-sms-volet-lateral .li-sms.outbound-api .content-sms .box-content {
  position: relative;
}
.section-detail-sms .list-sms-volet-lateral .li-sms.outbound-sms .content-sms .box-content p,
.section-detail-sms .list-sms-volet-lateral .li-sms.outbound-api .content-sms .box-content p {
  background: #24bf7a;
  padding: 18px 31px;
  border-radius: 13px;
  border-bottom-right-radius: 0px;
  margin-bottom: 5px;
  color: #fff;
}
.section-detail-sms .list-sms-volet-lateral i {
  color: #aaaaaa;
  font-size: 17px;
  background: rgba(203, 203, 203, 0.26);
  padding: 9px 12px 11px;
  border-radius: 41px;
  margin-right: 28px;
  width: 38px;
}

.answer-sms {
  display: flex;
  align-items: center;
  background: #eff5f5;
  padding: 0 0;
  margin: 23px 32px;
  border-radius: 5px;
}
.answer-sms textarea {
  height: 46px;
  background: #eff5f5;
  border: none;
  padding: 0 17px;
  color: #727272;
  font-size: 14px;
}
.answer-sms textarea:focus {
  outline: none;
  box-shadow: none;
  border: none;
  background: #eff5f5;
}
.answer-sms button {
  padding: 8px 0;
  width: 119px;
  margin: 13px 14px 17px 19px;
  box-shadow: none !important;
  color: #fff;
  background-color: #2f2fc2;
}

.vg-body-content-sms {
  overflow: hidden;
  height: 100%;
}

.search-sms-received {
  margin-bottom: 27px;
}

.sms-section-list .sms-list-multiple li .sms-client-profile {
  padding: 7px 11px 9px !important;
}

#mess {
  color: #959595 !important;
}

.no-sms {
  height: 63vh;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.no-sms svg {
  margin-bottom: 26px;
}

#loadingDiscu {
  height: 83vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

.bl-discu-grp {
  display: flex;
}
.bl-discu-grp .list-sms {
  width: 100%;
  height: 68vh;
}

#bl-prospect-disc {
  border-right: 1px solid #f5f5f1;
  width: 397px;
  height: 70vh;
  overflow-x: scroll;
}
#bl-prospect-disc h3 {
  font-size: 14px;
  padding: 16px 4px 14px 32px;
  background: #f5f5f1;
}
#bl-prospect-disc ul li {
  list-style: none;
}
#bl-prospect-disc ul li label {
  font-size: 14px;
  font-weight: bold;
  color: black;
}
#bl-prospect-disc ul li p {
  font-size: 12px;
  margin-top: 5px;
  margin-bottom: 5px;
  border-bottom: 1px solid rgba(47, 47, 194, 0.0509803922);
  padding-bottom: 9px;
}

#sent,
#multiple {
  display: none;
}

.mob-tab-sms {
  margin: 0 24px 21px 16px;
  display: none;
}

.tab-setting-active {
  background: #2f2fc2 !important;
  color: #fff;
  border-radius: 7px !important;
}

.form-input {
  margin-bottom: 10px;
}
.form-input input {
  background-color: #f5f5f1;
  border: none;
  font-size: 14px;
  padding: 9px 21px;
  border: 1px solid transparent;
}
.form-input label {
  font-size: 12px;
  margin-bottom: 6px;
  font-family: "SfprodRegular", sans-serif !important;
}

.vg-section-profile {
  display: flex;
  justify-content: center;
  gap: 105px;
}
.vg-section-profile .img-profile {
  text-align: center;
}
.vg-section-profile .img-profile button {
  background: #acb5b2;
  color: #fff;
  padding: 8px 25px;
  margin-right: 20px;
}
.vg-section-profile .img-profile a {
  font-size: 14px;
  color: #acb5b2;
}
.vg-section-profile .img-profile a:hover {
  cursor: pointer;
}
.vg-section-profile i {
  background: #f6f6f6;
  font-size: 153px;
  padding: 35px 36px;
  color: #dddddd;
}
.vg-section-profile .form-profile {
  width: 38%;
}
.vg-section-profile .form-profile .action-profile {
  width: 100%;
  margin-top: 21px;
  box-shadow: none;
  background: #2f2fc2;
  color: #fff;
  padding: 8px 0;
}

.vg-section-config .form-config .action-setting button,
.vg-section-config .form-change-pass .action-setting button,
.vg-section-pass .form-config .action-setting button,
.vg-section-pass .form-change-pass .action-setting button {
  width: 100%;
  margin-top: 21px;
  box-shadow: none;
  background: #2f2fc2;
  color: #fff;
  padding: 8px 0;
}
.vg-section-config .change-pass,
.vg-section-pass .change-pass {
  width: 400px;
}

.section-setting {
  height: 90vh;
  padding: 6px 0 10px 14px;
}
.section-setting button {
  box-shadow: none;
}

.tab-setting button {
  padding: 10px 28px 8px;
  border-radius: 6px;
  font-size: 12px;
}

.tab-config {
  margin-top: 21px;
  margin-bottom: 24px;
}
.tab-config button {
  box-shadow: none;
  background-color: transparent;
  font-family: "SfprodRegular", sans-serif !important;
}
.tab-config .tab-active {
  border-bottom: 2px solid #2f2fc2;
  border-radius: 0px;
  color: #2f2fc2;
}

.tw-info p {
  padding: 0 70px 0 44px;
  font-size: 14px;
}

.tw-info {
  height: 58vh;
  padding: 27px 0;
  overflow-x: scroll;
}
.tw-info h5 {
  padding: 0 0 14px;
  color: #2f2fc2;
  font-size: 19px;
  border-bottom: 1px solid #f5f2f2;
  margin: 20px 43px;
  width: 76%;
}

.vg-recording {
  background: #f2f2f2;
  margin: é .vg-recording px 0;
  padding: 12px 0;
  font-size: 14px;
  background: #f2f2f2;
  margin: 29px 0;
  padding: 12px 10px;
  font-size: 14px;
  height: auto;
  overflow-x: scroll;
  width: 97%;
}
.vg-recording .vg-list-recording {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  margin: 17px 0;
}
.vg-recording .vg-list-recording .edit {
  background-color: #acb5b2;
  border-radius: 37px;
  padding: 4px 9px 3px;
}
.vg-recording .vg-list-recording .delete {
  background-color: #ec363b;
  border-radius: 37px;
  padding: 4px 5px 3px;
}

.vg-section-profile,
.vg-section-pass,
.vg-section-conf {
  margin-right: 50px;
}

.define-voice {
  background: #e3e3e3;
  font-size: 12px;
  padding: 5px 21px;
}

span.voice-default {
  color: #24bf7a;
  font-size: 12px;
  margin: 0 12px 0 0;
}

.voice-recording {
  width: 68%;
}

.vg-list-recording {
  border-bottom: 1px solid white;
}

.logo-twif {
  display: none;
}

.vg-logo {
  display: block;
}

.right-dash {
  display: grid;
}
.right-dash .ttl-wraper {
  display: none;
}

.person {
  padding-left: 0 !important;
  color: #0f9359 !important;
}

td.action-table {
  justify-content: end;
}

@media (max-width: 1124px) {
  .head-list-sms {
    display: block !important;
  }
}
@media (max-width: 1020px) {
  .logo-twif {
    display: block;
  }
  .vg-logo {
    display: none;
  }
  .rs-title {
    font-size: 21px;
  }
  .vg-body .side-nav {
    width: 53px !important;
  }
  .vg-body .side-nav .vg-menu {
    padding: 0 0px;
  }
  .vg-body .side-nav ul li {
    padding: 7px 11px 6px 10px !important;
    border-radius: 0 !important;
  }
  .vg-body .side-nav ul li label {
    display: none;
  }
  .vg-body .side-nav ul li .badge-notif {
    position: absolute;
    right: 0;
    top: -3px;
  }
  .vg-body .vg-wrapper {
    width: 100%;
  }
  .vg-grid {
    grid-template-rows: 161px !important;
  }
  .vg-grid .grid-col {
    height: 162px !important;
  }
  .vg-guide {
    display: flex;
    justify-content: center;
  }
  .vg-version {
    font-size: 9px;
  }
  #language-select {
    font-size: 14px;
    padding: 6px;
  }
  .select2-search {
    display: none;
  }
  .show-search-icon .select2-search {
    display: block;
  }
  .select2-container--open .select2-dropdown {
    max-height: 200px;
  }
  /* .vg-grid{
        display: inline-block;
        .grid-col{
            margin-top: 10px;
        }
    }*/
}
@media (max-width: 972px) {
  .right-dash,
  .left-dash {
    width: 100%;
    display: inline;
  }
  .left-dash .ttl-wraper {
    display: none;
  }
  .right-dash {
    padding-top: 0;
  }
  .right-dash .ttl-wraper {
    display: block;
  }
  .row-dash {
    display: flex;
    flex-direction: column-reverse;
  }
  .demo-mobile-desktop-usage {
    width: 100%;
    display: flex;
  }
  .start-date-dash,
  .end-date-dash {
    width: 50%;
  }
  .end-date-dash {
    margin-left: 20px;
    border-left: 1px solid #eaeaea;
    padding-left: 20px;
    margin-right: 16px;
  }
  .btn-aff-dash {
    width: 119px;
    margin: 0 0 22px;
    padding: 6px 0 3px;
  }
  .vg-body-content .vg-grid {
    display: grid;
    grid-template-columns: 30% 30% 30% !important;
  }
}
@media (max-width: 928px) {
  #table_call_history {
    width: 876px;
  }
  .mob-tab-sms {
    display: block;
  }
  .tab-sms {
    display: none !important;
  }
}
@media (max-width: 790px) {
  #message_login {
    display: none;
  }
  #bl-login {
    width: 100%;
    justify-content: center;
  }
  .demo-mobile-desktop-usage {
    width: 90%;
  }
  .demo-mobile-desktop-usage input {
    font-size: 4vw !important;
  }
}
@media (max-width: 745px) {
  .start-date div,
  .end-date div {
    width: 59px;
  }
}
/*@media screen and (max-width: 580px) {*/
@media (max-width: 580px) {
  .start-date div.box-date,
  .end-date div.box-date {
    width: 30%;
  }
  .start-date div.box-date .lab-date,
  .end-date div.box-date .lab-date {
    width: 100%;
  }
  .demo-mobile-desktop-usage {
    width: 90%;
    display: inline;
  }
  .start-date-dash,
  .end-date-dash {
    width: 100%;
  }
  .end-date-dash {
    border: none;
    margin: 0 0 21px;
    padding: 0;
  }
  .vg-grid {
    width: 100%;
    padding: 20px;
    display: inline-block !important;
  }
  .vg-grid .grid-col {
    margin-top: 10px;
  }
  .modal-call {
    width: 26rem;
    max-width: 26rem;
    height: 27rem;
  }
  .modal-call .img-user-call {
    display: none;
  }
  .modal-call .form-control {
    padding: 0.275rem 0.45rem;
  }
  .modal-call .modal-body .form-note .input-form {
    display: flex;
    align-items: end;
    gap: 10px;
    justify-content: center;
    flex-direction: column;
  }
  .modal-call .form-group {
    width: 100%;
  }
  .modal-recording {
    width: 25rem;
    max-width: 25rem;
    position: fixed;
    height: 18rem;
    bottom: 20%;
    z-index: 99999999999;
    border-radius: 3%;
    top: 30px;
    /* padding: 20px; */
    -webkit-border-radius: 3%;
    -moz-border-radius: 3%;
    -ms-border-radius: 3%;
    -o-border-radius: 3%;
  }
  .small-window-recording {
    position: fixed;
    top: 1em;
    right: 0em;
    width: 260px;
    max-width: 260px;
    height: auto;
    padding: 13px;
    z-index: 99999999999;
    background-color: #080820;
    border-radius: 23px;
    display: none;
  }
  .g-button {
    display: flex;
    gap: 17px;
    margin: -11px 0 23px;
    justify-content: flex-start;
    flex-direction: column;
  }
  .vg-section-title {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    padding-right: 18px;
    margin-bottom: 30px;
    margin-top: 4px;
    flex-direction: column;
    gap: 22px;
  }
  .w-cust-7 {
    width: 100% !important;
  }
  .q-active-faq {
    width: 100%;
  }
  .interface_service_client {
    width: 90%;
  }
  .interface_service_client .list_service_chatbot {
    width: 100%;
  }
  .interface_service_client .q-active {
    width: 100%;
  }
  .interface_service_client .message_chatbot {
    width: 100%;
  }
  .interface_service_client .message_chatbot {
    font-size: 12px;
  }
  #modal-02 {
    position: fixed !important;
    width: 100%;
    height: 100%;
    right: 0px !important;
    left: inherit !important;
    background-color: rgba(0, 0, 0, 0.2) !important;
    overflow-y: auto;
    z-index: 4;
    opacity: 1;
    animation-duration: 0.6s;
    box-shadow: 0 0 44px -3px rgba(255, 255, 255, 0.44);
    bottom: 0 !important;
    top: auto !important;
    border-radius: 0;
    bottom: 0 !important;
    top: auto !important;
  }
  .vg-header {
    z-index: 4 !important;
  }
  .btn-aff-dash {
    justify-content: center;
  }
  .title-header {
    display: contents;
  }
  .head-tab {
    margin: 20px 0;
  }
}
@media screen and (max-width: 661px) {
  .title-header {
    display: flex;
  }
}
.heda {
  height: 100vh !important;
}

.size {
  font-size: 130px;
}

.go-home {
  background: white;
  padding: 9px 27px 10px;
  border-radius: 12px;
  color: #315dae;
}

.go-home:hover {
  cursor: pointer;
  transition: 0.4s;
  opacity: 0.7;
  text-decoration: none;
}

div#loadingWrapperContent {
  display: none;
}

#loadingWrapperContent.show {
  display: flex;
  height: 86vh !important;
  background: rgba(255, 255, 255, 0.3098039216) !important;
  flex-direction: column !important;
  text-align: center !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 14px !important;
  position: inherit !important;
}
#loadingWrapperContent.show .loader {
  border: 5px solid #e9e9e9;
  border-top: 5px solid #0C0C53;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  animation: spin 0.8s linear infinite;
}

#trial-message {
  display: none !important;
}

.g-loading #loading_page {
  background: rgba(0, 0, 0, 0.6588235294);
  backdrop-filter: blur(10px) !important;
  top: 0px !important;
}
.g-loading #loading_page .modal-dialog {
  max-width: 219px !important;
  margin-top: 46vh !important;
}
.g-loading #loading_page .modal-dialog .modal-content {
  border: none !important;
  background: none;
  color: white;
}
.g-loading #loading_page .modal-body {
  padding: 21px 45px 20px !important;
  text-align: center;
}

/*# sourceMappingURL=main.css.map */