/*!***************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!../src/assets/styles/movablepanel.scss ***!
  \***************************************************************************************************************************************************************************************/
@font-face {
  font-family: "OpenSansReg";
  src: url(1b0809d519837cb7aad3.ttf);
}
.app {
  width: 100vw;
  height: 100vh;
}

.com-bridge-hidden-iframe {
  display: none;
}

.box-shadow, .vl-movableMod, .logo div {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.75) !important;
}

.logo {
  align-self: center;
}
img {
  user-drag: none;
  -webkit-user-drag: none;
  -ms-user-select: none;
}

.primary.ant-layout {
  background-color: #083659;
  height: 100%;
}
.primary.ant-layout > main {
  display: flex;
}

.full-height, .profile, .edit-profile, .left-content, .top-header-right, .full-size, .edit-form, .main-spin {
  height: 100%;
}

.full-width, .vl-app-footer.ant-layout-footer, .top-header.ant-layout-header, .devices-form, .top-header, .vl-profiles-list-item, .search-content, .full-size, .edit-form, .main-spin {
  width: 100%;
}

.wa {
  width: auto !important;
}

/* POSITIONING */
.mt5px {
  margin-top: 5px;
}

.vl-mb0 {
  margin-bottom: 0 !important;
}

.vl-mt0 {
  margin-top: 0 !important;
}

.vl-ml15 {
  margin-left: 15px !important;
}

.ml20 {
  margin-left: 20px !important;
}

.ml40 {
  margin-left: 40px !important;
}

.pl40 {
  padding-left: 40px !important;
}

.pt10 {
  padding-top: 10px !important;
}

.pt14 {
  padding-top: 20px !important;
}

.pt20 {
  padding-top: 20px !important;
}

.pt25 {
  padding-top: 25px !important;
}

.pr20 {
  padding-right: 20px !important;
}

.dib {
  display: inline-block;
}

/* COMPONENTS */
.buttons {
  margin-top: 40px !important;
}

.vl-btn {
  font-size: 16px !important;
  font-weight: 100 !important;
  cursor: pointer;
  width: 125px;
  border-radius: 2px;
}

.vl-btn-text {
  margin: 5px 10px;
  padding: 5px;
  text-align: center;
}

.vl-btn-red {
  background-color: #FF0000 !important;
  color: #FFFFFF !important;
  border-color: #FF0000 !important;
}
.vl-btn-red:hover {
  background-color: #DC0000 !important;
  border-color: #DC0000 !important;
}

.vl-btn-green {
  background-color: #44B449 !important;
  color: #FFFFFF !important;
  border-color: #44B449 !important;
}
.vl-btn-green:hover {
  background-color: #44D249 !important;
  border-color: #44D249 !important;
}

.leave-session-btn {
  z-index: 1;
  width: 140px;
  top: 45px;
  right: 45px;
}

.btn-second {
  margin: 0 0 0 20px;
  width: 225px !important;
}

.vl-btn-blue {
  background-color: #0092D7 !important;
  color: #FFFFFF !important;
  border-color: #0092D7 !important;
  height: 40px !important;
}
.vl-btn-blue.ant-btn-sm {
  height: 32px !important;
}
.vl-btn-blue:hover {
  background-color: #49B2FF !important;
  border-color: #49B2FF !important;
}

.btn-grey {
  background-color: #C8C8C8 !important;
  color: #646464 !important;
  border-color: #C8C8C8 !important;
  height: 40px !important;
}
.btn-grey:hover {
  background-color: #E6E6E6 !important;
  border-color: #E6E6E6 !important;
}

.disabled {
  cursor: not-allowed;
}

.main-spin {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #083659;
}

.main-modal .ant-modal-header {
  border-radius: 25px 25px 0 0;
}

.main-modal .ant-modal-content {
  border-radius: 25px;
}

.main-modal .ant-form-item-control-input-content {
  width: 100%;
}

.caller .ant-col {
  text-align: center;
}

.incoming-call .ant-notification-notice-btn {
  float: left;
}

.caller h1 {
  color: #C8C8C8;
  margin-bottom: 50px;
  font-size: 22px;
}

.favorites-tabs .ant-tabs-nav-scroll {
  display: flex;
  justify-content: center;
}

.video-overlay-invite {
  width: 100vw;
  height: 100vh;
  background-color: white;
  position: absolute;
  z-index: 3;
}

.circle {
  background-color: #fff;
  border: 1px solid #C8C8C8;
  height: 72px;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  width: 72px;
}

.presence-badge {
  margin: 0;
  width: 15px;
  align-self: flex-start;
}
.presence-badge .available, .presence-badge .offline, .presence-badge .oncall, .presence-badge .dnd {
  width: 12px;
  height: 12px;
  border-radius: 10px;
  font-size: 10px;
  font-weight: bold;
  color: #44B449;
  line-height: 20px;
  text-align: center;
  background: #44B449;
}
.presence-badge:hover {
  opacity: 0.4;
  filter: alpha(opacity=40);
}
.presence-badge .dnd {
  background: #FF0000;
}
.presence-badge .oncall {
  background: #1990cf;
}
.presence-badge .offline {
  background: #7D7D7D;
}

.search-profile {
  padding: 0 15px 0 10px !important;
}
.search-profile .ant-badge-status-text {
  color: #C8C8C8;
}
.search-profile .ant-badge-status-processing, .search-profile .ant-badge-status-default {
  width: 15px;
  height: 15px;
}
.profile-available .ant-badge-status-default {
  background-color: #44B449;
}

.profile-oncall .ant-badge-status-default {
  background-color: #1990cf;
}

.profile-dnd .ant-badge-status-processing, .profile-dnd .search-profile .ant-badge-status-default, .search-profile .profile-dnd .ant-badge-status-default {
  background-color: #FF0000;
}

.profile-offline .ant-badge-status-default {
  background-color: #7D7D7D;
}

.circle-inner {
  width: 60px;
  height: 60px;
  border-radius: 30px;
  font-size: 30px;
  font-weight: bold;
  color: black;
  line-height: 60px;
  text-align: center;
  margin-left: 5px;
  margin-top: 5px;
  background: #C8C8C8;
}

.circle-image {
  border-top-left-radius: 50% 50%;
  border-top-right-radius: 50% 50%;
  border-bottom-right-radius: 50% 50%;
  border-bottom-left-radius: 50% 50%;
}

.left-sider {
  border-width: 0 1px 0 0;
  border-color: #C8C8C8;
  border-style: solid;
}

.video-menu-content {
  width: 445px;
  height: 670px;
  margin-left: 25px;
  display: flex;
  align-items: center;
  flex-direction: column;
}

.video-menu-content .call-button img {
  width: 75px;
  height: 75px;
}

.video-menu-content h3 {
  color: #083659;
}

.video-menu-content .ant-divider {
  background: #083659;
  height: 2px;
  margin: 0px 0 10px 0;
  opacity: 0.5;
}

.selfview-video {
  height: calc(100vh - 200px);
  width: 100vw;
}

.bedside-container {
  border: 0;
  background-color: black;
  width: 1270px;
  height: 800px;
}

.bgr-black {
  background-color: black;
}

.bedside-container-fullscreen {
  border: 0;
  background-color: black;
  width: 100vw;
  height: 100vh;
}

.iobserver-container-fullscreen {
  border: 0;
  background-color: black;
  width: 100vw;
  height: calc(100vh - 70px);
}

.video-menu-button {
  width: 50px;
  height: 50px;
}

.video-modal {
  width: 100%;
  height: 100%;
  border-radius: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #C8C8C8;
  padding: 5px;
  background: white;
}

.video-modal .call-button {
  padding: 15px;
}

.video-modal .close-button {
  display: flex;
  justify-content: flex-end;
}

.video-modal .search-content .ant-list-items {
  width: 430px;
}

.video-modal .external-form {
  padding: 10px;
}

.search-content .ant-form-item {
  justify-content: center;
}

.search-content .ant-divider {
  background: #083659;
  height: 2px;
  opacity: 0.5;
}

.search-content .ant-form-item-control {
  width: 500px;
}

.search-content .ant-list-items {
  width: 560px;
  margin: auto;
}

.vl-profile-collapse-panel span {
  margin: 0;
  padding-top: 0;
  color: #C8C8C8;
  font-size: 15px;
  flex-grow: 2;
}

.navigation-link span {
  margin: 0;
  padding-top: 0;
  color: #0092D7;
  font-size: 16px;
  flex-grow: 2;
}

.vl-profiles-list .vl-list-item {
  border-width: 0;
  border-color: transparent;
  border-bottom: none !important;
}
.vl-profiles-list .vl-list-item:nth-child(odd) {
  background-color: #0A1F33;
}
.vl-profiles-list .vl-list-item:nth-child(even) {
  background-color: transparent;
}

.vl-profiles-list-item {
  display: flex;
  align-items: start;
  flex-direction: row;
  justify-content: space-between;
  padding-right: 10px;
}
.vl-profiles-list-item .ant-collapse-content-box {
  padding-bottom: 20px !important;
}
.vl-profiles-list-item .ant-collapse {
  width: 100%;
  background: transparent;
}
.vl-profiles-list-item .icon {
  margin-top: 10px;
}
.vl-profiles-list-item .icon img:hover {
  cursor: pointer;
  animation: bounce 1s infinite;
  -webkit-animation: bounce 1s infinite;
  -moz-animation: bounce 1s infinite;
  -o-animation: bounce 1s infinite;
}
.vl-profiles-list-item .sound-wave-icon {
  margin-left: 10px;
  width: 24px;
}
.vl-profiles-list-item .ant-badge, .vl-profiles-list-item .ant-collapse-header, .vl-profiles-list-item .ant-collapse-arrow, .vl-profiles-list-item .vl-avatar {
  line-height: 50px !important;
}
.vl-profiles-list-item .vl-avatar {
  margin-right: 15px;
}
.vl-profiles-list-item .ant-badge-status-text {
  display: none;
}
.vl-profiles-list-item .ant-badge-status-dot {
  width: 16px !important;
  height: 16px !important;
  margin: 17px 0;
}
.vl-profiles-list-item .ant-collapse .ant-collapse-item-disabled > .ant-collapse-header {
  cursor: pointer;
}
.vl-profiles-list-item .ant-collapse-item.vl-profile-collapse-panel > .ant-collapse-header {
  display: block;
  padding: 0;
}
.vl-profiles-list-item .ant-collapse > .ant-collapse-item > .ant-collapse-header .ant-collapse-arrow {
  padding-top: 0;
}

.favorite-star-wrapper {
  margin: 14px 0;
}

.call-button-wrapper {
  margin: 9px 0;
}

.vl-chat-main {
  overflow: auto;
}

.vl-chat-footer {
  position: absolute;
  bottom: 40px;
}

.vl-chat-form {
  margin: 0 40px !important;
  justify-content: space-between;
}
.vl-chat-form > .ant-form-item {
  margin: 20px 0;
}
.vl-chat-form .ant-form-item-label > label {
  color: #C8C8C8;
  font-size: 16px;
}
.vl-chat-form .vl-select-field {
  margin-left: 15px;
}
.vl-chat-form input#message {
  width: 308px;
}

.vl-chat-list .vl-list-item {
  border-width: 0;
  border-color: transparent;
  border-bottom: none !important;
  justify-content: flex-start;
  margin: 25px 0 !important;
}
.vl-chat-list .vl-list-item .vl-avatar {
  align-self: flex-start;
}
.vl-chat-list .vl-list-item .vl-chat-list-item {
  background-color: #FFFFFF;
}
.vl-chat-list .vl-list-item .vl-chat-name {
  left: 0;
}
.vl-chat-list .vl-list-item.mine {
  flex-direction: row-reverse;
}
.vl-chat-list .vl-list-item.mine .vl-chat-list-item {
  background-color: #0A1F33;
  color: #FFFFFF;
}
.vl-chat-list .vl-list-item.mine .vl-chat-name {
  right: 0;
}

.vl-chat-name {
  top: -22px;
  color: #C8C8C8;
  position: absolute;
  font-size: 10px;
}

.vl-chat-list-item {
  position: relative;
  display: flex;
  margin: 0 15px;
  padding: 10px 15px;
  align-items: start;
  flex-direction: row;
  justify-content: space-between;
  font-size: 18px;
  word-break: break-word;
  border-radius: 5px;
  width: auto;
  min-width: 35%;
  max-width: 70%;
}

.ipcOverrideForm {
  margin: 0 40px !important;
}
.ipcOverrideForm .vl-select-field {
  width: 100%;
  margin-left: 0;
}
.ipcOverrideForm textarea {
  background-color: rgba(10, 31, 51, 0.9);
  border: none;
  color: #C8C8C8 !important;
  height: 130px !important;
}
.ipcOverrideForm label {
  color: #C8C8C8 !important;
}

@-webkit-keyframes bounce {
  0%, 100% {
    -webkit-transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-5px);
  }
}
@-moz-keyframes bounce {
  0%, 100% {
    -moz-transform: translateY(0);
  }
  50% {
    -moz-transform: translateY(-5px);
  }
}
@-o-keyframes bounce {
  0%, 100% {
    -o-transform: translateY(0);
  }
  50% {
    -o-transform: translateY(-5px);
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
}
.vl-profile-collapse-panel {
  border: none !important;
}

.tar {
  text-align: right;
}

.tac {
  text-align: center;
}

.vl-header {
  min-height: 90px;
  position: relative;
  width: 100%;
  z-index: 100;
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: space-between;
  user-select: none;
  color: #0092D7;
  background-color: #083659;
  font-size: 20px;
}

.vl-header a {
  color: #0092D7;
}

.header-section-left {
  align-self: center;
}

.header-section-center {
  align-self: center;
  margin: 0 20px;
}
@media (max-width: 1024px) {
  .header-section-center {
    flex-grow: 1;
    text-align: center;
  }
}

.vl-header .vl-right-section {
  display: flex;
  align-items: center;
}

.vl-action-image {
  cursor: pointer;
}

.vl-header-logo {
  align-items: center;
  padding-left: 40px;
}

.info {
  padding: 0 0 0 50px;
  font-size: 28px;
  display: inline-block;
}

.vl-incall-info {
  font-size: 20px;
  align-items: center;
}

.user-name {
  padding: 0 0 0 10px;
  font-size: 16px;
}

.arrow-collapse {
  width: 10px;
  margin: 0 7px;
}
.arrow-collapse:hover {
  opacity: 0.4;
  filter: invert(37%) sepia(99%) saturate(1606%) hue-rotate(172deg) brightness(93%) contrast(102%);
}

.vl-center-img {
  height: 26px;
  margin-left: 30px;
}
.vl-center-img:hover {
  opacity: 0.4;
  filter: alpha(opacity=40);
}

.vl-timer {
  font-size: 16px;
  color: #C8C8C8;
  display: flex;
  align-items: center;
  justify-content: center;
}

.header-star:hover {
  opacity: 0.4;
  filter: alpha(opacity=40);
}

.right-img {
  height: 30px;
  margin-left: 30px;
  align-items: center;
}

.top-header {
  height: 50px;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.profile-image:hover {
  opacity: 0.4;
  filter: alpha(opacity=40); /* msie */
}

.top-header-left {
  height: 60px;
  align-self: flex-start;
  padding-top: 3px;
  padding-left: 30px;
}

.top-header-right {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-right: 10px;
}
@media (min-width: 1024px) {
  .top-header-right {
    padding-right: 40px;
  }
}

.top-header-right span {
  cursor: pointer;
}

.video-overlay-invite .top-header h2 {
  flex-grow: 2;
  margin: auto;
  color: white;
}

.video-overlay-invite .top-header p {
  color: white;
  margin: auto;
  font-size: 18px;
}

.main-buttons {
  width: 100%;
  margin-bottom: 50px;
  background: linear-gradient(to bottom, #ffffff, #eeeeee);
}

.flex-start {
  align-self: flex-start;
}

.flex-end {
  align-self: flex-end;
}

.left-content {
  border-right: 1px;
  border-color: #C8C8C8;
}

.vl-align-center, .main-buttons, .left-content {
  display: flex;
  align-items: center;
  justify-content: center;
}

.edit-form {
  padding: 10px;
}

.external-form {
  padding: 0 200px 0 200px;
}

.edit-form .ant-form-item-has-success.ant-form-item-has-feedback .ant-form-item-children-icon {
  color: #4f8bc7;
}

.ant-btn-link span {
  text-decoration: underline;
}

span.link {
  text-decoration: none;
  color: #083659;
  cursor: pointer;
}

.call-button {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  padding: 10px;
}

.call-button p {
  margin-top: 15px;
  margin-bottom: 0px;
  font-size: 20px;
  font-weight: normal;
}

.call-button .disabled {
  color: #C8C8C8;
}

.call-button img {
  width: 125px;
  height: 125px;
}

.about h2 {
  padding: 20px 0 0;
  margin: 0;
  font-size: 16px;
  text-align: center;
  color: #C8C8C8;
  word-break: keep-all;
}

.profile img, .edit-profile img {
  margin-bottom: 30px;
}

.grey-out:hover {
  filter: invert(49%) sepia(92%) saturate(1133%) hue-rotate(188deg) brightness(111%) contrast(101%); /* msie */
}

.profile h2, .edit-profile h2 {
  text-align: center;
  font-size: 24px;
  color: #C8C8C8;
}

.profile h1, .edit-profile h1 {
  font-size: 16px;
  color: #C8C8C8;
}

.profile .mb-40, .edit-profile .mb-40 {
  font-size: 16px;
  color: #C8C8C8;
  margin-bottom: 40px;
}

#modal-label, .profile .settings-label, .edit-profile .settings-label, .profile .profile-label, .edit-profile .profile-label {
  color: #0092D7;
  font-size: 16px;
  text-align: left;
}

.profile .profile-label, .edit-profile .profile-label {
  padding-left: 40px;
}

.profile .settings-label, .edit-profile .settings-label {
  padding-left: 20px;
}

.shrtcut .shortcuts-label {
  color: #C8C8C8;
  font-size: 16px;
  text-align: left;
}

.profile .edit-profile-label, .edit-profile .edit-profile-label {
  color: #0092D7;
  font-size: 12px;
  float: left;
}

.profile p, .edit-profile p {
  font-size: 16px;
  width: 250px;
  text-align: left;
}

.edit-profile img {
  margin-bottom: 30px;
  cursor: pointer;
}

.profile-pic-combined {
  height: 100px;
  width: 100px;
  margin-bottom: 30px;
}

.profile-pic-combined img {
  display: block;
  height: 100px;
  width: 100px;
  margin: 0;
  padding: 0;
  position: absolute;
}

.deleteProfile, .editProfile {
  border-radius: 50%;
  position: absolute;
  left: 10px;
  top: 80px;
  height: 20px;
  width: 20px;
  background-color: #0A1F33;
}

.editProfile {
  left: 72px;
}

#deleteProfile, #editProfile {
  height: 20px;
  width: 20px;
  padding: 5px;
}
#deleteProfile:hover, #editProfile:hover {
  filter: invert(49%) sepia(92%) saturate(1133%) hue-rotate(188deg) brightness(111%) contrast(101%); /* msie */
}

.modal-content {
  display: flex;
  align-items: center;
}

.modal-buttons {
  padding: 30px 0 0;
  text-align: center;
}

.modal-info {
  font-size: 16px;
  padding: 0 10px;
}

.shrtcut .shortcuts {
  text-align: right;
}

.shrtcut .and {
  font-size: 12px;
  padding: 0 10px;
}

.ant-drawer-wrapper-body p {
  color: white;
  font-size: 30px;
  padding-left: 40px;
}

.close-icon {
  display: flex;
  justify-content: flex-end;
  margin: 20px;
}

/******** new addition for new GUI *****/
/* Collapse */
.ant-collapse-borderless > .ant-collapse-item > .ant-collapse-content > .ant-collapse-content-box {
  padding: 0;
}

.f-sans, .f-20, .f-18, .vl-f-16, .vl-f-14 {
  font-family: "OpenSansReg";
  font-style: normal;
}

.vl-f-14 {
  font-size: 14px;
}

.vl-f-16 {
  font-size: 16px;
}

.f-18 {
  font-size: 18px;
}

.f-20 {
  font-size: 20px;
}

.w-100 {
  width: 110px;
}

.w-100.ant-collapse > .ant-collapse-item > .ant-collapse-header .ant-collapse-arrow svg {
  font-size: 18px;
}

.vl-collapse, .vl-collapse .vl-value, .vl-collapse .property-short, .vl-collapse .vl-property {
  display: inline-block;
  box-sizing: border-box;
  text-align: left;
}

.vl-collapse .vl-property {
  color: #0092D7;
  width: 86px;
  vertical-align: top;
}

.vl-collapse .property-short {
  color: #0092D7;
  width: 40%;
}

.vl-collapse .vl-value {
  color: #C8C8C8;
  padding-left: 10px;
  width: 60%;
}

.vl-value-text {
  width: 202px;
  overflow: hidden;
  color: #C8C8C8;
}

span.filled.anticon.anticon-star:hover {
  color: red !important;
}

span.outlined.anticon.anticon-star:hover {
  color: #0092D7 !important;
}

.ant-badge-status-processing, .search-profile .ant-badge-status-default {
  width: 12px;
  height: 12px;
}

.top-header.ant-layout-header {
  padding-right: 20px;
  height: 70px;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  box-shadow: 2px 2px 2px #000000;
  background: #083659;
}

.vl-profile-collapse-panel.vl-header {
  font-size: 18px;
}

.top-header-right .ant-collapse-borderless {
  background-color: transparent;
  border: 0;
  margin-top: 7px;
}

/******************** Footer ***********************/
@keyframes fade {
  0% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.vl-app-footer.ant-layout-footer {
  padding: 24px 0;
  position: relative;
  width: 100vw;
  bottom: 0;
  background-color: #083659;
}

.vl-app-footer .vl-footer-icon-on-red, .vl-header .vl-footer-icon-on-red, .vl-app-footer .vl-footer-icon-off-red, .vl-header .vl-footer-icon-off-red, .vl-app-footer .vl-footer-icon-on, .vl-header .vl-footer-icon-on, .vl-app-footer .vl-footer-icon-off, .vl-header .vl-footer-icon-off {
  height: 50px;
  width: 50px;
  display: inline-block;
  margin: 0 10px 0 10px;
  color: transparent;
  text-align: center;
  font-weight: normal;
  font-family: "OpenSansReg";
  font-size: 12px;
}

.vl-footer-img {
  display: block;
  padding: 0;
  width: 50px;
  height: 50px;
  margin: 0;
  border: 1px solid transparent;
}

.vl-app-footer, .vl-header {
  user-select: none;
}
.vl-app-footer .vl-app-footer-row, .vl-header .vl-app-footer-row {
  display: flex;
  justify-content: space-between;
}
.vl-app-footer .vl-footer-icon-off:hover, .vl-header .vl-footer-icon-off:hover {
  color: #C8C8C8;
}
.vl-app-footer .ant-badge .ant-badge-count, .vl-header .ant-badge .ant-badge-count {
  box-shadow: none;
  top: 5px;
  right: 14px;
}
.vl-app-footer .vl-footer-icon-on, .vl-header .vl-footer-icon-on {
  filter: invert(51%) sepia(81%) saturate(385%) hue-rotate(73deg) brightness(100%) contrast(89%);
}
.vl-app-footer .vl-footer-icon-on:hover, .vl-header .vl-footer-icon-on:hover {
  color: #C8C8C8;
  filter: invert(51%) sepia(81%) saturate(385%) hue-rotate(73deg) brightness(100%) contrast(89%);
}
.vl-app-footer .vl-footer-icon-off-red:hover, .vl-header .vl-footer-icon-off-red:hover {
  color: #C8C8C8;
}
.vl-app-footer .vl-footer-icon-on-red, .vl-header .vl-footer-icon-on-red {
  filter: invert(53%) sepia(91%) saturate(7484%) hue-rotate(350deg) brightness(88%) contrast(133%);
}
.vl-app-footer .vl-footer-icon-on-red:hover, .vl-header .vl-footer-icon-on-red:hover {
  color: #C8C8C8;
  filter: invert(53%) sepia(91%) saturate(7484%) hue-rotate(350deg) brightness(88%) contrast(133%);
}
.vl-app-footer .vl-left-section, .vl-header .vl-left-section {
  display: flex;
  justify-content: center;
}
.vl-app-footer .vl-middle-section, .vl-header .vl-middle-section {
  display: flex;
  justify-content: center;
}
.vl-app-footer .vl-right-section, .vl-header .vl-right-section {
  display: flex;
  justify-content: end;
}
.vl-app-footer .vl-right-section .eko-spin-icon, .vl-header .vl-right-section .eko-spin-icon {
  position: absolute;
  left: 10px;
}
.vl-app-footer .w-90, .vl-header .w-90 {
  width: 100px;
  text-align: center;
  overflow: visible;
  margin-left: -25px;
}
.vl-app-footer .vl-mr-50, .vl-header .vl-mr-50 {
  margin-right: 50px;
}
.vl-app-footer .left, .vl-header .left {
  float: left;
}
.vl-app-footer .right, .vl-header .right {
  float: right;
}

.vl-invite-scroll {
  /*** Firefox  ***/
  scrollbar-width: thin; /* "auto" or "thin" */
  scrollbar-color: #7D7D7D; /* scroll thumb and track */
  margin-top: 5px;
  margin-right: 20px;
  cursor: pointer;
  overflow-y: auto;
  /* width */
  /* Track */
  /* Handle */
  /* Handle on hover */
}
.vl-invite-scroll li {
  list-style-type: none;
}
.vl-invite-scroll::-webkit-scrollbar {
  width: 8px;
}
.vl-invite-scroll::-webkit-scrollbar-track {
  background: #0A1F33;
}
.vl-invite-scroll::-webkit-scrollbar-thumb {
  background: #7D7D7D;
  border-radius: 10px;
}
.vl-invite-scroll::-webkit-scrollbar-thumb:hover {
  background: #7D7D7D;
}

.ml-7 {
  margin-left: 5px;
}

.vl-poh-sign {
  position: fixed;
  bottom: 120px;
  left: 43%;
  background: #083659;
  width: 275px;
  height: 60px;
  color: #FF0000;
  font-size: 24px;
  font-weight: 500;
  text-align: center;
  vertical-align: middle;
  line-height: 60px;
}

.video-off {
  width: 410px;
  height: 250px;
  line-height: 250px;
  background-color: #0A1F33;
  color: #0092D7;
  text-align: center;
  font-size: 18px;
}

.backgroundImageHolder {
  padding-left: 34px;
  padding-right: 20px !important;
  height: 280px;
}

.backgroundImage {
  margin: 3px;
  background: none;
  width: 118px;
  height: 68px;
  display: flex;
  float: left;
  vertical-align: middle;
  cursor: pointer;
}

.fixed-h300 {
  height: 300px;
}

.fixed-h300.loaded {
  height: 300px;
}

.backgroundImageSelected {
  border: 2px solid #0096D7;
}

.backgroundImage img {
  border: none !important;
  cursor: pointer;
  margin: 2px;
  background: none;
  width: 110px;
  height: 60px;
  border: none;
}

.no-access-msg {
  height: 100%;
  font-size: 18px;
  text-align: center;
  background-color: #083659;
  color: #0092D7;
}
.no-access-msg p {
  margin-top: 5%;
}

/*************** base MovablePanel class ***********/
.vl-movablePanelHeader {
  line-height: 55px;
  height: 55px;
  cursor: move;
}

.vl-movableMod {
  position: fixed;
  z-index: 2;
  background: rgba(12, 42, 68, 0.9);
  border-radius: 10px;
  padding-bottom: 40px;
}
.vl-movableMod .ant-divider-horizontal {
  margin-bottom: 20px !important;
}

.vl-movableMod .ant-divider {
  border-width: 1px;
  margin-top: 0;
  border-color: #7D7D7D;
}

.modal, .modContent, .vl-modalExpend, .vl-modalClose, .vl-modalDownload, .vl-modalReload, .vl-modalTitle {
  position: absolute;
  color: #0092D7;
  font-size: 24px;
}

.vl-modalTitle {
  top: 0;
  left: 40px;
}

.vl-modalDivider {
  width: calc(100% - 80px);
  margin: auto;
}

.vl-modalExpend, .vl-modalClose, .vl-modalDownload, .vl-modalReload {
  top: 19px;
  right: 80px;
  cursor: pointer;
  z-index: 3;
}

.vl-modalReload {
  top: 16px;
  right: 120px;
}

.vl-modalDownload {
  font-size: 23px;
  top: 16px;
  right: 160px;
}

.vl-modalClose {
  top: 20px;
  right: 40px;
}
.vl-modalClose:hover {
  filter: invert(54%) sepia(100%) saturate(1009%) hue-rotate(181deg) brightness(103%) contrast(102%);
}

span.remove-fav > img {
  filter: invert(64%) sepia(99%) saturate(0%) hue-rotate(144deg) brightness(106%) contrast(90%);
  height: 13px;
  margin-right: 7px;
  padding-bottom: 3px;
}
span.remove-fav > img:hover {
  filter: invert(54%) sepia(100%) saturate(1009%) hue-rotate(181deg) brightness(103%) contrast(102%);
}

.modContent {
  width: 100%;
  height: 100%;
}

#video-screenshot {
  object-fit: contain;
  width: 100%;
  height: 100%;
}

.vl-screenshot {
  padding: 0px 40px 40px 40px;
  position: absolute;
  top: 90px;
  bottom: 0;
  left: 0;
  right: 0;
}

.vl-loading {
  color: #0092D7;
  padding: 0px 40px 40px 40px;
  font-size: 18px;
}

/*********************** Settings ******************/
.vl-movable-panel-content {
  padding: 20px 40px 40px;
}

.vl-settings-row {
  width: 100%;
  margin: 15px 0;
}

.vl-setting-img {
  width: 30px;
  height: 30px;
  padding-top: 3px;
}

.vl-setting-img2, .vl-setting-img3 {
  width: 25px;
  height: 25px;
  padding-top: 3px;
}

.vl-setting-img3 {
  margin: 5px 0 0 20px;
}

.vl-setting-tooltip {
  font-size: 12px;
  color: #C8C8C8;
  margin-top: 5px;
  width: 65px;
  text-align: center;
}

.vl-setting-select {
  width: 330px;
  outline: none;
}
.vl-setting-select .ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
  font-family: "OpenSansReg";
  font-size: 16px;
  text-indent: 3px;
  color: #0092D7;
  background-color: rgba(10, 31, 51, 0.9);
  border: 1px solid rgba(12, 42, 68, 0.9);
  border-radius: 4px;
  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  width: 100%;
  height: 40px;
  align-items: center;
  outline: none !important;
  max-width: 330px;
  min-width: 330px;
}
.vl-setting-select .ant-select-single:not(.ant-select-customize-input) .ant-select-selector:focus {
  outline: none !important;
}
.vl-setting-select .ant-select-arrow {
  color: #C8C8C8;
}
.vl-setting-select .ant-select-item-option-selected:not(.ant-select-item-option-disabled) {
  background-color: white;
  color: #0092D7;
}
.vl-setting-select .ant-select-item-option-active:not(.ant-select-item-option-disabled) {
  background-color: white;
  color: #0092D7;
}
.vl-setting-select .ant-select:not(.ant-select-disabled):hover .ant-select-selector {
  border-color: rgba(12, 42, 68, 0.9);
}
.vl-setting-select .ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector {
  border-color: rgba(12, 42, 68, 0.9);
}
.vl-setting-select .ant-select-single.ant-select-open .ant-select-selection-item {
  color: #0092D7;
}
.vl-setting-select .ant-select-arrow {
  color: "#C8C8C8";
  float: left;
}

.vl-setting-slider.ant-slider {
  z-index: 8;
}
.vl-setting-slider.ant-slider .ant-slider-rail {
  background-color: rgba(10, 31, 51, 0.9);
}
.vl-setting-slider.ant-slider .ant-slider-track {
  background-color: #0091D6;
}
.vl-setting-slider.ant-slider .ant-slider-handle {
  background-color: #0091D6;
  border: solid 2px #0091D6;
}

.vl-setting-sliderV.ant-slider.ant-slider-vertical {
  padding: 0 20px;
  z-index: 8;
}
.vl-setting-sliderV.ant-slider.ant-slider-vertical .ant-slider-rail {
  background-color: rgba(10, 31, 51, 0.9);
}
.vl-setting-sliderV.ant-slider.ant-slider-vertical .ant-slider-track {
  background-color: #0091D6;
}
.vl-setting-sliderV.ant-slider.ant-slider-vertical .ant-slider-handle {
  background-color: #0091D6;
  border: solid 2px #0091D6;
}

.vl-setting-sliderV.ant-slider.ant-slider-disabled.ant-slider-vertical .ant-slider-handle {
  background-color: rgba(10, 31, 51, 0.9);
}

.av-settings-footer {
  margin: 20px 40px 0;
}
.av-settings-footer .vl-btn {
  width: 125px;
  height: 40px;
}

.vl-btn.vl-settings-button {
  padding: 0;
  font-size: 10px !important;
  width: 65px !important;
  height: 20px !important;
}

.vl-setting-left, .vl-setting-right {
  display: inline-block;
  width: 220px;
  height: 280px;
  padding-left: 15px;
}

.vl-setting-right {
  border-left: 1px solid #7D7D7D;
  padding-left: 0;
}

.vl-setting-caption {
  margin-top: 20px;
  font-size: 16px;
  color: #0091D6;
  height: 40px;
  text-align: center;
}

.vl-div-slider {
  height: 150px;
}

.vl-div-slider-left {
  height: 150px;
  margin-left: 20px;
}

/*********  Care Device style **************/
.care-divider {
  margin: 0 30px;
  border-top: 3px solid #7D7D7D;
}

.vl-care-div-left {
  display: inline-block;
  width: 170px;
}

.vl-controller-block {
  padding: 0 20px 0 40px;
  width: 160px;
}

.vl-controller-img {
  cursor: pointer;
  width: 100%;
  height: 100%;
}

.vl-home-img {
  position: absolute;
  top: 39.3%;
  left: 19.7%;
  transform: translate(-50%, -50%);
  cursor: pointer;
}
.vl-home-img:hover {
  filter: invert(54%) sepia(100%) saturate(1009%) hue-rotate(181deg) brightness(103%) contrast(102%);
}

.vl-zoom-block {
  padding: 15px 5px 0 32px;
  margin: 15px 0;
  width: 220px;
}

.vl-zoom-out {
  padding-left: 15px;
  cursor: pointer;
  height: 35px;
}

.vl-zoom-in {
  padding-left: 15px;
  cursor: pointer;
  height: 35px;
}

.vl-list-scroll {
  /*** Firefox  ***/
  scrollbar-width: thin;
  /* "auto" or "thin" */
  scrollbar-color: #7D7D7D;
  /* scroll thumb and track */
  margin-top: 5px;
  cursor: pointer;
  overflow-y: scroll;
  height: 160px;
  width: 270px;
  /* width */
  /* Track */
  /* Handle */
  /* Handle on hover */
}
.vl-list-scroll::-webkit-scrollbar {
  width: 8px;
}
.vl-list-scroll::-webkit-scrollbar-track {
  background: #0A1F33;
}
.vl-list-scroll::-webkit-scrollbar-thumb {
  background: #7D7D7D;
  border-radius: 10px;
}
.vl-list-scroll::-webkit-scrollbar-thumb:hover {
  background: #7D7D7D;
}

.vl-refresh-block {
  padding: 5px 5px 0 35px;
  width: 150px;
  color: #0092D7;
}

.vl-refresh-set {
  padding-left: 50px;
  padding-top: 5px;
  width: 150px;
  color: #0092D7;
}

.vl-set {
  font-size: 14px;
  cursor: pointer;
}
.vl-set:hover {
  filter: invert(54%) sepia(100%) saturate(1009%) hue-rotate(181deg) brightness(103%) contrast(102%);
}

.vl-refresh {
  float: left;
  font-size: 14px;
  cursor: pointer;
}
.vl-refresh:hover {
  filter: invert(54%) sepia(100%) saturate(1009%) hue-rotate(181deg) brightness(103%) contrast(102%);
}

.vl-reboot {
  float: right;
  font-size: 14px;
  cursor: pointer;
}
.vl-reboot:hover {
  filter: invert(54%) sepia(100%) saturate(1009%) hue-rotate(181deg) brightness(103%) contrast(102%);
}

.vl-care-right {
  float: right;
  width: 240px;
  margin: 0 30px 20px 0;
}

.vl-input-pin {
  font-size: 16px;
}
.vl-input-pin input.ant-input {
  background-color: #0A1F33;
  border-color: transparent;
  width: 220px;
  height: 40px;
  color: #7D7D7D;
}
.vl-input-pin input.ant-input::placeholder {
  color: #7D7D7D;
}

li.ant-list-item.vl-pin-list-item {
  padding: 5px 0;
  margin-right: 10px;
  height: 40px;
  color: #C8C8C8;
  font-size: 16px;
  border-width: 0;
  border-color: transparent;
}

li.ant-list-item.vl-pin-list-item:nth-child(odd) {
  background-color: transparent;
}

li.ant-list-item.vl-pin-list-item:nth-child(even) {
  background-color: #0A1F33;
}

.pin-line {
  border-width: 0;
  border-color: transparent;
}

.vl-pinName {
  width: 120px;
  padding-left: 15px;
  display: inline-block;
  color: #C8C8C8;
}

.vl-pinImg, .vl-pinImgRight {
  height: 20px;
  display: inline-block;
}
.vl-pinImg:hover, .vl-pinImgRight:hover {
  filter: invert(54%) sepia(100%) saturate(1009%) hue-rotate(181deg) brightness(103%) contrast(102%);
}

.vl-pinImgRight {
  margin-right: 15px;
}
/*!**************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!../src/assets/styles/custom-antd.scss ***!
  \**************************************************************************************************************************************************************************************/
@font-face {
  font-family: "OpenSansReg";
  src: url(1b0809d519837cb7aad3.ttf);
}
.app {
  width: 100vw;
  height: 100vh;
}

.com-bridge-hidden-iframe {
  display: none;
}

.box-shadow, .header-modal, .common-modal, .ant-notification-notice, .vl-header-menu.ant-dropdown-menu, .vl-select-field .ant-select-dropdown, .select-field-header .ant-select-dropdown, .vl-select-field-lgr .ant-select-dropdown,
.edit-profile-custom .ant-select-dropdown, .logo div {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.75) !important;
}

.logo {
  align-self: center;
}
img {
  user-drag: none;
  -webkit-user-drag: none;
  -ms-user-select: none;
}

.primary.ant-layout {
  background-color: #083659;
  height: 100%;
}
.primary.ant-layout > main {
  display: flex;
}

.full-height, .profile, .edit-profile, .left-content, .top-header-right, .full-size, .edit-form, .main-spin {
  height: 100%;
}

.full-width, .vl-app-footer.ant-layout-footer, .top-header.ant-layout-header, .devices-form, .top-header, .vl-profiles-list-item, .search-content, .full-size, .edit-form, .main-spin {
  width: 100%;
}

.wa {
  width: auto !important;
}

/* POSITIONING */
.mt5px {
  margin-top: 5px;
}

.vl-mb0 {
  margin-bottom: 0 !important;
}

.vl-mt0 {
  margin-top: 0 !important;
}

.vl-ml15 {
  margin-left: 15px !important;
}

.ml20 {
  margin-left: 20px !important;
}

.ml40 {
  margin-left: 40px !important;
}

.pl40 {
  padding-left: 40px !important;
}

.pt10 {
  padding-top: 10px !important;
}

.pt14 {
  padding-top: 20px !important;
}

.pt20 {
  padding-top: 20px !important;
}

.pt25 {
  padding-top: 25px !important;
}

.pr20 {
  padding-right: 20px !important;
}

.dib {
  display: inline-block;
}

/* COMPONENTS */
.buttons {
  margin-top: 40px !important;
}

.vl-btn {
  font-size: 16px !important;
  font-weight: 100 !important;
  cursor: pointer;
  width: 125px;
  border-radius: 2px;
}

.vl-btn-text {
  margin: 5px 10px;
  padding: 5px;
  text-align: center;
}

.vl-btn-red {
  background-color: #FF0000 !important;
  color: #FFFFFF !important;
  border-color: #FF0000 !important;
}
.vl-btn-red:hover {
  background-color: #DC0000 !important;
  border-color: #DC0000 !important;
}

.vl-btn-green {
  background-color: #44B449 !important;
  color: #FFFFFF !important;
  border-color: #44B449 !important;
}
.vl-btn-green:hover {
  background-color: #44D249 !important;
  border-color: #44D249 !important;
}

.leave-session-btn {
  z-index: 1;
  width: 140px;
  top: 45px;
  right: 45px;
}

.btn-second {
  margin: 0 0 0 20px;
  width: 225px !important;
}

.vl-btn-blue {
  background-color: #0092D7 !important;
  color: #FFFFFF !important;
  border-color: #0092D7 !important;
  height: 40px !important;
}
.vl-btn-blue.ant-btn-sm {
  height: 32px !important;
}
.vl-btn-blue:hover {
  background-color: #49B2FF !important;
  border-color: #49B2FF !important;
}

.btn-grey {
  background-color: #C8C8C8 !important;
  color: #646464 !important;
  border-color: #C8C8C8 !important;
  height: 40px !important;
}
.btn-grey:hover {
  background-color: #E6E6E6 !important;
  border-color: #E6E6E6 !important;
}

.disabled {
  cursor: not-allowed;
}

.main-spin {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #083659;
}

.main-modal .ant-modal-header {
  border-radius: 25px 25px 0 0;
}

.main-modal .ant-modal-content {
  border-radius: 25px;
}

.main-modal .ant-form-item-control-input-content {
  width: 100%;
}

.caller .ant-col {
  text-align: center;
}

.incoming-call .ant-notification-notice-btn {
  float: left;
}

.caller h1 {
  color: #C8C8C8;
  margin-bottom: 50px;
  font-size: 22px;
}

.favorites-tabs .ant-tabs-nav-scroll {
  display: flex;
  justify-content: center;
}

.video-overlay-invite {
  width: 100vw;
  height: 100vh;
  background-color: white;
  position: absolute;
  z-index: 3;
}

.circle {
  background-color: #fff;
  border: 1px solid #C8C8C8;
  height: 72px;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  width: 72px;
}

.presence-badge {
  margin: 0;
  width: 15px;
  align-self: flex-start;
}
.presence-badge .available, .presence-badge .offline, .presence-badge .oncall, .presence-badge .dnd {
  width: 12px;
  height: 12px;
  border-radius: 10px;
  font-size: 10px;
  font-weight: bold;
  color: #44B449;
  line-height: 20px;
  text-align: center;
  background: #44B449;
}
.presence-badge:hover {
  opacity: 0.4;
  filter: alpha(opacity=40);
}
.presence-badge .dnd {
  background: #FF0000;
}
.presence-badge .oncall {
  background: #1990cf;
}
.presence-badge .offline {
  background: #7D7D7D;
}

.search-profile {
  padding: 0 15px 0 10px !important;
}
.search-profile .ant-badge-status-text {
  color: #C8C8C8;
}
.search-profile .ant-badge-status-processing, .search-profile .ant-badge-status-default {
  width: 15px;
  height: 15px;
}
.profile-available .ant-badge-status-default {
  background-color: #44B449;
}

.profile-oncall .ant-badge-status-default {
  background-color: #1990cf;
}

.profile-dnd .ant-badge-status-processing, .profile-dnd .search-profile1 .ant-badge-status-default, .search-profile1 .profile-dnd .ant-badge-status-default, .profile-dnd .search-profile .ant-badge-status-default, .search-profile .profile-dnd .ant-badge-status-default {
  background-color: #FF0000;
}

.profile-offline .ant-badge-status-default {
  background-color: #7D7D7D;
}

.circle-inner {
  width: 60px;
  height: 60px;
  border-radius: 30px;
  font-size: 30px;
  font-weight: bold;
  color: black;
  line-height: 60px;
  text-align: center;
  margin-left: 5px;
  margin-top: 5px;
  background: #C8C8C8;
}

.circle-image {
  border-top-left-radius: 50% 50%;
  border-top-right-radius: 50% 50%;
  border-bottom-right-radius: 50% 50%;
  border-bottom-left-radius: 50% 50%;
}

.left-sider {
  border-width: 0 1px 0 0;
  border-color: #C8C8C8;
  border-style: solid;
}

.video-menu-content {
  width: 445px;
  height: 670px;
  margin-left: 25px;
  display: flex;
  align-items: center;
  flex-direction: column;
}

.video-menu-content .call-button img {
  width: 75px;
  height: 75px;
}

.video-menu-content h3 {
  color: #083659;
}

.video-menu-content .ant-divider {
  background: #083659;
  height: 2px;
  margin: 0px 0 10px 0;
  opacity: 0.5;
}

.selfview-video {
  height: calc(100vh - 200px);
  width: 100vw;
}

.bedside-container {
  border: 0;
  background-color: black;
  width: 1270px;
  height: 800px;
}

.bgr-black {
  background-color: black;
}

.bedside-container-fullscreen {
  border: 0;
  background-color: black;
  width: 100vw;
  height: 100vh;
}

.iobserver-container-fullscreen {
  border: 0;
  background-color: black;
  width: 100vw;
  height: calc(100vh - 70px);
}

.video-menu-button {
  width: 50px;
  height: 50px;
}

.video-modal {
  width: 100%;
  height: 100%;
  border-radius: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #C8C8C8;
  padding: 5px;
  background: white;
}

.video-modal .call-button {
  padding: 15px;
}

.video-modal .close-button {
  display: flex;
  justify-content: flex-end;
}

.video-modal .search-content .ant-list-items {
  width: 430px;
}

.video-modal .external-form {
  padding: 10px;
}

.search-content .ant-form-item {
  justify-content: center;
}

.search-content .ant-divider {
  background: #083659;
  height: 2px;
  opacity: 0.5;
}

.search-content .ant-form-item-control {
  width: 500px;
}

.search-content .ant-list-items {
  width: 560px;
  margin: auto;
}

.vl-profile-collapse-panel span {
  margin: 0;
  padding-top: 0;
  color: #C8C8C8;
  font-size: 15px;
  flex-grow: 2;
}

.navigation-link span {
  margin: 0;
  padding-top: 0;
  color: #0092D7;
  font-size: 16px;
  flex-grow: 2;
}

.vl-profiles-list .vl-list-item {
  border-width: 0;
  border-color: transparent;
  border-bottom: none !important;
}
.vl-profiles-list .vl-list-item:nth-child(odd) {
  background-color: #0A1F33;
}
.vl-profiles-list .vl-list-item:nth-child(even) {
  background-color: transparent;
}

.vl-profiles-list-item {
  display: flex;
  align-items: start;
  flex-direction: row;
  justify-content: space-between;
  padding-right: 10px;
}
.vl-profiles-list-item .ant-collapse-content-box {
  padding-bottom: 20px !important;
}
.vl-profiles-list-item .ant-collapse {
  width: 100%;
  background: transparent;
}
.vl-profiles-list-item .icon {
  margin-top: 10px;
}
.vl-profiles-list-item .icon img:hover {
  cursor: pointer;
  animation: bounce 1s infinite;
  -webkit-animation: bounce 1s infinite;
  -moz-animation: bounce 1s infinite;
  -o-animation: bounce 1s infinite;
}
.vl-profiles-list-item .sound-wave-icon {
  margin-left: 10px;
  width: 24px;
}
.vl-profiles-list-item .ant-badge, .vl-profiles-list-item .ant-collapse-header, .vl-profiles-list-item .ant-collapse-arrow, .vl-profiles-list-item .vl-avatar {
  line-height: 50px !important;
}
.vl-profiles-list-item .vl-avatar {
  margin-right: 15px;
}
.vl-profiles-list-item .ant-badge-status-text {
  display: none;
}
.vl-profiles-list-item .ant-badge-status-dot {
  width: 16px !important;
  height: 16px !important;
  margin: 17px 0;
}
.vl-profiles-list-item .ant-collapse .ant-collapse-item-disabled > .ant-collapse-header {
  cursor: pointer;
}
.vl-profiles-list-item .ant-collapse-item.vl-profile-collapse-panel > .ant-collapse-header {
  display: block;
  padding: 0;
}
.vl-profiles-list-item .ant-collapse > .ant-collapse-item > .ant-collapse-header .ant-collapse-arrow {
  padding-top: 0;
}

.favorite-star-wrapper {
  margin: 14px 0;
}

.call-button-wrapper {
  margin: 9px 0;
}

.vl-chat-main {
  overflow: auto;
}

.vl-chat-footer {
  position: absolute;
  bottom: 40px;
}

.vl-chat-form {
  margin: 0 40px !important;
  justify-content: space-between;
}
.vl-chat-form > .ant-form-item {
  margin: 20px 0;
}
.vl-chat-form .ant-form-item-label > label {
  color: #C8C8C8;
  font-size: 16px;
}
.vl-chat-form .vl-select-field, .vl-chat-form .select-field-header, .vl-chat-form .edit-profile-custom, .vl-chat-form .vl-select-field-lgr {
  margin-left: 15px;
}
.vl-chat-form input#message {
  width: 308px;
}

.vl-chat-list .vl-list-item {
  border-width: 0;
  border-color: transparent;
  border-bottom: none !important;
  justify-content: flex-start;
  margin: 25px 0 !important;
}
.vl-chat-list .vl-list-item .vl-avatar {
  align-self: flex-start;
}
.vl-chat-list .vl-list-item .vl-chat-list-item {
  background-color: #FFFFFF;
}
.vl-chat-list .vl-list-item .vl-chat-name {
  left: 0;
}
.vl-chat-list .vl-list-item.mine {
  flex-direction: row-reverse;
}
.vl-chat-list .vl-list-item.mine .vl-chat-list-item {
  background-color: #0A1F33;
  color: #FFFFFF;
}
.vl-chat-list .vl-list-item.mine .vl-chat-name {
  right: 0;
}

.vl-chat-name {
  top: -22px;
  color: #C8C8C8;
  position: absolute;
  font-size: 10px;
}

.vl-chat-list-item {
  position: relative;
  display: flex;
  margin: 0 15px;
  padding: 10px 15px;
  align-items: start;
  flex-direction: row;
  justify-content: space-between;
  font-size: 18px;
  word-break: break-word;
  border-radius: 5px;
  width: auto;
  min-width: 35%;
  max-width: 70%;
}

.ipcOverrideForm {
  margin: 0 40px !important;
}
.ipcOverrideForm .vl-select-field, .ipcOverrideForm .select-field-header, .ipcOverrideForm .edit-profile-custom, .ipcOverrideForm .vl-select-field-lgr {
  width: 100%;
  margin-left: 0;
}
.ipcOverrideForm textarea {
  background-color: rgba(10, 31, 51, 0.9);
  border: none;
  color: #C8C8C8 !important;
  height: 130px !important;
}
.ipcOverrideForm label {
  color: #C8C8C8 !important;
}

@-webkit-keyframes bounce {
  0%, 100% {
    -webkit-transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(-5px);
  }
}
@-moz-keyframes bounce {
  0%, 100% {
    -moz-transform: translateY(0);
  }
  50% {
    -moz-transform: translateY(-5px);
  }
}
@-o-keyframes bounce {
  0%, 100% {
    -o-transform: translateY(0);
  }
  50% {
    -o-transform: translateY(-5px);
  }
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-5px);
  }
}
.vl-profile-collapse-panel {
  border: none !important;
}

.tar {
  text-align: right;
}

.tac {
  text-align: center;
}

.vl-header {
  min-height: 90px;
  position: relative;
  width: 100%;
  z-index: 100;
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: space-between;
  user-select: none;
  color: #0092D7;
  background-color: #083659;
  font-size: 20px;
}

.vl-header a {
  color: #0092D7;
}

.header-section-left {
  align-self: center;
}

.header-section-center {
  align-self: center;
  margin: 0 20px;
}
@media (max-width: 1024px) {
  .header-section-center {
    flex-grow: 1;
    text-align: center;
  }
}

.vl-header .vl-right-section {
  display: flex;
  align-items: center;
}

.vl-action-image {
  cursor: pointer;
}

.vl-header-logo {
  align-items: center;
  padding-left: 40px;
}

.info {
  padding: 0 0 0 50px;
  font-size: 28px;
  display: inline-block;
}

.vl-incall-info {
  font-size: 20px;
  align-items: center;
}

.user-name {
  padding: 0 0 0 10px;
  font-size: 16px;
}

.arrow-collapse {
  width: 10px;
  margin: 0 7px;
}
.arrow-collapse:hover {
  opacity: 0.4;
  filter: invert(37%) sepia(99%) saturate(1606%) hue-rotate(172deg) brightness(93%) contrast(102%);
}

.vl-center-img {
  height: 26px;
  margin-left: 30px;
}
.vl-center-img:hover {
  opacity: 0.4;
  filter: alpha(opacity=40);
}

.vl-timer {
  font-size: 16px;
  color: #C8C8C8;
  display: flex;
  align-items: center;
  justify-content: center;
}

.header-star:hover {
  opacity: 0.4;
  filter: alpha(opacity=40);
}

.right-img {
  height: 30px;
  margin-left: 30px;
  align-items: center;
}

.top-header {
  height: 50px;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.profile-image:hover {
  opacity: 0.4;
  filter: alpha(opacity=40); /* msie */
}

.top-header-left {
  height: 60px;
  align-self: flex-start;
  padding-top: 3px;
  padding-left: 30px;
}

.top-header-right {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-right: 10px;
}
@media (min-width: 1024px) {
  .top-header-right {
    padding-right: 40px;
  }
}

.top-header-right span {
  cursor: pointer;
}

.video-overlay-invite .top-header h2 {
  flex-grow: 2;
  margin: auto;
  color: white;
}

.video-overlay-invite .top-header p {
  color: white;
  margin: auto;
  font-size: 18px;
}

.main-buttons {
  width: 100%;
  margin-bottom: 50px;
  background: linear-gradient(to bottom, #ffffff, #eeeeee);
}

.flex-start {
  align-self: flex-start;
}

.flex-end {
  align-self: flex-end;
}

.left-content {
  border-right: 1px;
  border-color: #C8C8C8;
}

.vl-align-center, .main-buttons, .left-content {
  display: flex;
  align-items: center;
  justify-content: center;
}

.edit-form {
  padding: 10px;
}

.external-form {
  padding: 0 200px 0 200px;
}

.edit-form .ant-form-item-has-success.ant-form-item-has-feedback .ant-form-item-children-icon {
  color: #4f8bc7;
}

.ant-btn-link span {
  text-decoration: underline;
}

span.link {
  text-decoration: none;
  color: #083659;
  cursor: pointer;
}

.call-button {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  padding: 10px;
}

.call-button p {
  margin-top: 15px;
  margin-bottom: 0px;
  font-size: 20px;
  font-weight: normal;
}

.call-button .disabled {
  color: #C8C8C8;
}

.call-button img {
  width: 125px;
  height: 125px;
}

.about h2 {
  padding: 20px 0 0;
  margin: 0;
  font-size: 16px;
  text-align: center;
  color: #C8C8C8;
  word-break: keep-all;
}

.profile img, .edit-profile img {
  margin-bottom: 30px;
}

.grey-out:hover {
  filter: invert(49%) sepia(92%) saturate(1133%) hue-rotate(188deg) brightness(111%) contrast(101%); /* msie */
}

.profile h2, .edit-profile h2 {
  text-align: center;
  font-size: 24px;
  color: #C8C8C8;
}

.profile h1, .edit-profile h1 {
  font-size: 16px;
  color: #C8C8C8;
}

.profile .mb-40, .edit-profile .mb-40 {
  font-size: 16px;
  color: #C8C8C8;
  margin-bottom: 40px;
}

#modal-label, .profile .settings-label, .edit-profile .settings-label, .profile .profile-label, .edit-profile .profile-label {
  color: #0092D7;
  font-size: 16px;
  text-align: left;
}

.profile .profile-label, .edit-profile .profile-label {
  padding-left: 40px;
}

.profile .settings-label, .edit-profile .settings-label {
  padding-left: 20px;
}

.shrtcut .shortcuts-label {
  color: #C8C8C8;
  font-size: 16px;
  text-align: left;
}

.profile .edit-profile-label, .edit-profile .edit-profile-label {
  color: #0092D7;
  font-size: 12px;
  float: left;
}

.profile p, .edit-profile p {
  font-size: 16px;
  width: 250px;
  text-align: left;
}

.edit-profile img {
  margin-bottom: 30px;
  cursor: pointer;
}

.profile-pic-combined {
  height: 100px;
  width: 100px;
  margin-bottom: 30px;
}

.profile-pic-combined img {
  display: block;
  height: 100px;
  width: 100px;
  margin: 0;
  padding: 0;
  position: absolute;
}

.deleteProfile, .editProfile {
  border-radius: 50%;
  position: absolute;
  left: 10px;
  top: 80px;
  height: 20px;
  width: 20px;
  background-color: #0A1F33;
}

.editProfile {
  left: 72px;
}

#deleteProfile, #editProfile {
  height: 20px;
  width: 20px;
  padding: 5px;
}
#deleteProfile:hover, #editProfile:hover {
  filter: invert(49%) sepia(92%) saturate(1133%) hue-rotate(188deg) brightness(111%) contrast(101%); /* msie */
}

.modal-content {
  display: flex;
  align-items: center;
}

.modal-buttons {
  padding: 30px 0 0;
  text-align: center;
}

.modal-info {
  font-size: 16px;
  padding: 0 10px;
}

.shrtcut .shortcuts {
  text-align: right;
}

.shrtcut .and {
  font-size: 12px;
  padding: 0 10px;
}

.ant-drawer-wrapper-body p {
  color: white;
  font-size: 30px;
  padding-left: 40px;
}

.close-icon {
  display: flex;
  justify-content: flex-end;
  margin: 20px;
}

/******** new addition for new GUI *****/
/* Collapse */
.ant-collapse-borderless > .ant-collapse-item > .ant-collapse-content > .ant-collapse-content-box {
  padding: 0;
}

.f-sans, .f-20, .f-18, .vl-f-16, .vl-f-14 {
  font-family: "OpenSansReg";
  font-style: normal;
}

.vl-f-14 {
  font-size: 14px;
}

.vl-f-16 {
  font-size: 16px;
}

.f-18 {
  font-size: 18px;
}

.f-20 {
  font-size: 20px;
}

.w-100 {
  width: 110px;
}

.w-100.ant-collapse > .ant-collapse-item > .ant-collapse-header .ant-collapse-arrow svg {
  font-size: 18px;
}

.vl-collapse, .vl-collapse .vl-value, .vl-collapse .property-short, .vl-collapse .vl-property {
  display: inline-block;
  box-sizing: border-box;
  text-align: left;
}

.vl-collapse .vl-property {
  color: #0092D7;
  width: 86px;
  vertical-align: top;
}

.vl-collapse .property-short {
  color: #0092D7;
  width: 40%;
}

.vl-collapse .vl-value {
  color: #C8C8C8;
  padding-left: 10px;
  width: 60%;
}

.vl-value-text {
  width: 202px;
  overflow: hidden;
  color: #C8C8C8;
}

span.filled.anticon.anticon-star:hover {
  color: red !important;
}

span.outlined.anticon.anticon-star:hover {
  color: #0092D7 !important;
}

.ant-badge-status-processing, .search-profile1 .ant-badge-status-default, .search-profile .ant-badge-status-default {
  width: 12px;
  height: 12px;
}

.top-header.ant-layout-header {
  padding-right: 20px;
  height: 70px;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  box-shadow: 2px 2px 2px #000000;
  background: #083659;
}

.vl-profile-collapse-panel.vl-header {
  font-size: 18px;
}

.top-header-right .ant-collapse-borderless {
  background-color: transparent;
  border: 0;
  margin-top: 7px;
}

/******************** Footer ***********************/
@keyframes fade {
  0% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.vl-app-footer.ant-layout-footer {
  padding: 24px 0;
  position: relative;
  width: 100vw;
  bottom: 0;
  background-color: #083659;
}

.vl-app-footer .vl-footer-icon-on-red, .vl-header .vl-footer-icon-on-red, .vl-app-footer .vl-footer-icon-off-red, .vl-header .vl-footer-icon-off-red, .vl-app-footer .vl-footer-icon-on, .vl-header .vl-footer-icon-on, .vl-app-footer .vl-footer-icon-off, .vl-header .vl-footer-icon-off {
  height: 50px;
  width: 50px;
  display: inline-block;
  margin: 0 10px 0 10px;
  color: transparent;
  text-align: center;
  font-weight: normal;
  font-family: "OpenSansReg";
  font-size: 12px;
}

.vl-footer-img {
  display: block;
  padding: 0;
  width: 50px;
  height: 50px;
  margin: 0;
  border: 1px solid transparent;
}

.vl-app-footer, .vl-header {
  user-select: none;
}
.vl-app-footer .vl-app-footer-row, .vl-header .vl-app-footer-row {
  display: flex;
  justify-content: space-between;
}
.vl-app-footer .vl-footer-icon-off:hover, .vl-header .vl-footer-icon-off:hover {
  color: #C8C8C8;
}
.vl-app-footer .ant-badge .ant-badge-count, .vl-header .ant-badge .ant-badge-count {
  box-shadow: none;
  top: 5px;
  right: 14px;
}
.vl-app-footer .vl-footer-icon-on, .vl-header .vl-footer-icon-on {
  filter: invert(51%) sepia(81%) saturate(385%) hue-rotate(73deg) brightness(100%) contrast(89%);
}
.vl-app-footer .vl-footer-icon-on:hover, .vl-header .vl-footer-icon-on:hover {
  color: #C8C8C8;
  filter: invert(51%) sepia(81%) saturate(385%) hue-rotate(73deg) brightness(100%) contrast(89%);
}
.vl-app-footer .vl-footer-icon-off-red:hover, .vl-header .vl-footer-icon-off-red:hover {
  color: #C8C8C8;
}
.vl-app-footer .vl-footer-icon-on-red, .vl-header .vl-footer-icon-on-red {
  filter: invert(53%) sepia(91%) saturate(7484%) hue-rotate(350deg) brightness(88%) contrast(133%);
}
.vl-app-footer .vl-footer-icon-on-red:hover, .vl-header .vl-footer-icon-on-red:hover {
  color: #C8C8C8;
  filter: invert(53%) sepia(91%) saturate(7484%) hue-rotate(350deg) brightness(88%) contrast(133%);
}
.vl-app-footer .vl-left-section, .vl-header .vl-left-section {
  display: flex;
  justify-content: center;
}
.vl-app-footer .vl-middle-section, .vl-header .vl-middle-section {
  display: flex;
  justify-content: center;
}
.vl-app-footer .vl-right-section, .vl-header .vl-right-section {
  display: flex;
  justify-content: end;
}
.vl-app-footer .vl-right-section .eko-spin-icon, .vl-header .vl-right-section .eko-spin-icon {
  position: absolute;
  left: 10px;
}
.vl-app-footer .w-90, .vl-header .w-90 {
  width: 100px;
  text-align: center;
  overflow: visible;
  margin-left: -25px;
}
.vl-app-footer .vl-mr-50, .vl-header .vl-mr-50 {
  margin-right: 50px;
}
.vl-app-footer .left, .vl-header .left {
  float: left;
}
.vl-app-footer .right, .vl-header .right {
  float: right;
}

.vl-invite-scroll {
  /*** Firefox  ***/
  scrollbar-width: thin; /* "auto" or "thin" */
  scrollbar-color: #7D7D7D; /* scroll thumb and track */
  margin-top: 5px;
  margin-right: 20px;
  cursor: pointer;
  overflow-y: auto;
  /* width */
  /* Track */
  /* Handle */
  /* Handle on hover */
}
.vl-invite-scroll li {
  list-style-type: none;
}
.vl-invite-scroll::-webkit-scrollbar {
  width: 8px;
}
.vl-invite-scroll::-webkit-scrollbar-track {
  background: #0A1F33;
}
.vl-invite-scroll::-webkit-scrollbar-thumb {
  background: #7D7D7D;
  border-radius: 10px;
}
.vl-invite-scroll::-webkit-scrollbar-thumb:hover {
  background: #7D7D7D;
}

.ml-7 {
  margin-left: 5px;
}

.vl-poh-sign {
  position: fixed;
  bottom: 120px;
  left: 43%;
  background: #083659;
  width: 275px;
  height: 60px;
  color: #FF0000;
  font-size: 24px;
  font-weight: 500;
  text-align: center;
  vertical-align: middle;
  line-height: 60px;
}

.video-off {
  width: 410px;
  height: 250px;
  line-height: 250px;
  background-color: #0A1F33;
  color: #0092D7;
  text-align: center;
  font-size: 18px;
}

.backgroundImageHolder {
  padding-left: 34px;
  padding-right: 20px !important;
  height: 280px;
}

.backgroundImage {
  margin: 3px;
  background: none;
  width: 118px;
  height: 68px;
  display: flex;
  float: left;
  vertical-align: middle;
  cursor: pointer;
}

.fixed-h300 {
  height: 300px;
}

.fixed-h300.loaded {
  height: 300px;
}

.backgroundImageSelected {
  border: 2px solid #0096D7;
}

.backgroundImage img {
  border: none !important;
  cursor: pointer;
  margin: 2px;
  background: none;
  width: 110px;
  height: 60px;
  border: none;
}

.no-access-msg {
  height: 100%;
  font-size: 18px;
  text-align: center;
  background-color: #083659;
  color: #0092D7;
}
.no-access-msg p {
  margin-top: 5%;
}

/****************    Header Multi Call Styles  ********************/
.multi-call-header {
  margin-top: 90px;
  padding: 20px 0px 20px;
  background-color: #FFAF00;
}

#multi-call-button {
  margin-left: 25px;
  width: 200px;
}

.text-header-milti-call {
  font-family: "Open Sans", Arial, sans-serif;
  font-weight: 600;
  font-size: 20px;
  color: #000000;
  text-align: center;
}

/****************    label styles   *******************************/
.caption {
  color: #0092D7;
  font-family: "OpenSansReg";
  font-style: normal;
}

.f-24, .inner-panel-title {
  font-size: 24px;
}

.f-22 {
  font-size: 22px;
  margin: 10px 0 10px 40px;
}

/****************    basic styles   *******************************/
body {
  font-family: "OpenSansReg", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif !important;
  font-size: 16px;
}

/**************** layout *******************************/
.ant-layout-sider {
  background-color: transparent !important;
}

.ant-layout-sider-children {
  background-color: #083659;
}

/****************    Select drop-down appearance   *******************************/
.vl-select-field, .select-field-header,
.edit-profile-custom, .vl-select-field-lgr {
  margin-left: 40px;
  width: 225px;
  outline: none;
}
.vl-select-field .ant-select-single:not(.ant-select-customize-input) .ant-select-selector, .select-field-header .ant-select-single:not(.ant-select-customize-input) .ant-select-selector, .vl-select-field-lgr .ant-select-single:not(.ant-select-customize-input) .ant-select-selector,
.edit-profile-custom .ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
  font-family: "OpenSansReg";
  font-size: 16px;
  text-indent: 4px;
  color: #7D7D7D;
  background-color: rgba(10, 31, 51, 0.9) !important;
  border: none;
  border-radius: 4px;
  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  width: 100%;
  height: 40px;
  align-items: center;
  outline: none !important;
}
.vl-select-field .ant-select-single:not(.ant-select-customize-input) .ant-select-selector:focus, .select-field-header .ant-select-single:not(.ant-select-customize-input) .ant-select-selector:focus, .vl-select-field-lgr .ant-select-single:not(.ant-select-customize-input) .ant-select-selector:focus,
.edit-profile-custom .ant-select-single:not(.ant-select-customize-input) .ant-select-selector:focus {
  outline: none !important;
}
.vl-select-field .ant-select-selection-placeholder, .select-field-header .ant-select-selection-placeholder, .vl-select-field-lgr .ant-select-selection-placeholder,
.edit-profile-custom .ant-select-selection-placeholder {
  color: #7D7D7D;
}
.vl-select-field .ant-select-arrow, .select-field-header .ant-select-arrow, .vl-select-field-lgr .ant-select-arrow,
.edit-profile-custom .ant-select-arrow {
  color: #C8C8C8;
}
.vl-select-field .ant-select-item-option-selected:not(.ant-select-item-option-disabled), .select-field-header .ant-select-item-option-selected:not(.ant-select-item-option-disabled), .vl-select-field-lgr .ant-select-item-option-selected:not(.ant-select-item-option-disabled),
.edit-profile-custom .ant-select-item-option-selected:not(.ant-select-item-option-disabled) {
  background-color: transparent;
}
.vl-select-field .ant-select-item, .select-field-header .ant-select-item, .vl-select-field-lgr .ant-select-item,
.edit-profile-custom .ant-select-item {
  color: #C8C8C8;
  font-size: 16px;
}
.vl-select-field .ant-select-item-option-active:not(.ant-select-item-option-disabled), .select-field-header .ant-select-item-option-active:not(.ant-select-item-option-disabled), .vl-select-field-lgr .ant-select-item-option-active:not(.ant-select-item-option-disabled),
.edit-profile-custom .ant-select-item-option-active:not(.ant-select-item-option-disabled) {
  background-color: transparent !important;
  color: #0092D7 !important;
  font-size: 16px;
}
.vl-select-field .ant-select:not(.ant-select-disabled):hover .ant-select-selector, .select-field-header .ant-select:not(.ant-select-disabled):hover .ant-select-selector, .vl-select-field-lgr .ant-select:not(.ant-select-disabled):hover .ant-select-selector,
.edit-profile-custom .ant-select:not(.ant-select-disabled):hover .ant-select-selector {
  border-color: rgba(10, 31, 51, 0.9);
}
.vl-select-field .ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector, .select-field-header .ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector, .vl-select-field-lgr .ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector,
.edit-profile-custom .ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector {
  border-color: rgba(10, 31, 51, 0.9);
}
.vl-select-field .ant-select-single.ant-select-open .ant-select-selection-item, .select-field-header .ant-select-single.ant-select-open .ant-select-selection-item, .vl-select-field-lgr .ant-select-single.ant-select-open .ant-select-selection-item,
.edit-profile-custom .ant-select-single.ant-select-open .ant-select-selection-item {
  color: #0092D7;
}
.vl-select-field .ant-select-dropdown, .select-field-header .ant-select-dropdown, .vl-select-field-lgr .ant-select-dropdown,
.edit-profile-custom .ant-select-dropdown {
  background-color: #0C2A44;
  border-radius: 5px;
  color: #C8C8C8 !important;
  font-weight: normal;
  font-size: 16px;
  padding: 15px 8px;
}

.vl-select-field-lgr {
  width: 420px;
  margin-top: 10px;
}

.edit-profile-custom {
  margin-left: 0;
  width: 100%;
}

.vl-grey .vl-select-field .ant-select-single:not(.ant-select-customize-input) .ant-select-selector, .vl-grey .select-field-header .ant-select-single:not(.ant-select-customize-input) .ant-select-selector, .vl-grey .vl-select-field-lgr .ant-select-single:not(.ant-select-customize-input) .ant-select-selector, .vl-grey .edit-profile-custom .ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
  color: #7D7D7D;
}
.vl-grey .edit-profile-custom .ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
  color: #7D7D7D;
}

.select-field-header {
  margin-top: 10px;
}
.select-field-header .ant-select-single:not(.ant-select-customize-input) > .ant-select-selector {
  font-size: 30px;
  background-color: transparent;
  border: transparent;
  width: 200px;
}

/************************ input field  *****************/
.vl-input-guest input.ant-input.ant-input-lg {
  background-color: rgba(10, 31, 51, 0.9);
  border-color: transparent;
  width: 225px;
  margin-left: 40px;
  color: #7D7D7D;
}
.vl-input-guest input.ant-input.ant-input-lg::placeholder {
  color: #7D7D7D;
}
.vl-input-guest .ant-form-item-explain {
  margin-left: 40px;
  font-size: 12px;
}
.vl-input-guest .ant-form-item-explain .vl-help {
  height: 40px;
  padding: 5px 0 0 10px;
  color: #FF6666;
}

/************************ Search field  *****************/
.vl-search-field input.ant-input.ant-input-lg {
  background-color: transparent;
}

input-field, span.vl-search-field.ant-input-affix-wrapper.ant-input-affix-wrapper-lg, input.ant-input.ant-input-lg.dispay-name-edit {
  width: 100%;
  outline: none;
  background-color: rgba(10, 31, 51, 0.9);
  border: none;
  height: 40px;
  font-family: "OpenSansReg";
  font-style: normal;
  font-size: 16px;
  text-indent: 5px;
  color: #7D7D7D;
}

span.vl-search-field.ant-input-affix-wrapper.ant-input-affix-wrapper-lg > .ant-input {
  color: #7D7D7D;
  background-color: transparent;
}

span.vl-search-field.ant-input-affix-wrapper.ant-input-affix-wrapper-lg > .ant-input::placeholder {
  color: #7D7D7D;
}

/***************  Rows and margins  ***********************/
.vl-h-60.ant-row {
  height: 60px;
  line-height: 60px;
}

.vl-warning-message {
  align-items: center;
  border: 1px solid #7D7D7D;
  border-radius: 5px;
  font-size: 16px;
  margin: 0 40px 20px 40px;
}

.vl-text-warning {
  color: #FFAF00;
  margin: 0 0px 0px 50px;
}

.vl-image-warning {
  color: #FFAF00;
  font-size: 24px;
  margin: 0 0px -40px 12px;
}

/***************** Checkbox  ************************/
.vl-cb-right {
  margin-bottom: 20px;
  margin-left: 40px;
}

.inner-panel-title {
  margin-bottom: 10px;
  margin-left: 40px;
  margin-top: 10px;
}

.inner-panel-divider {
  margin: 0 40px 20px 40px;
  border-top: 0;
  border-left: 0;
  border-right: 0;
  border-bottom: 1px solid #7D7D7D;
}

div.cb-bedside.ant-row.ant-form-item {
  margin: 12px 0 0 32px;
}

.vl-bedside-star {
  margin: 3px 0 0 7px;
  font-family: "OpenSansReg";
  font-style: normal;
  font-size: 16px;
  color: #C8C8C8;
  cursor: pointer;
}

.vl-part-text {
  display: flex;
  align-items: center;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: 300px;
}

.vl-part-text:hover {
  overflow: visible;
  white-space: normal;
}

.vl-part-button-wrap {
  display: flex;
  align-items: center;
}

.vl-part-button {
  margin: 0 0 0 17px;
  padding-top: 3px;
  line-height: 50px;
  cursor: pointer;
}
.vl-part-button img {
  height: 32px;
}
.vl-part-button:hover {
  opacity: 0.7;
  filter: alpha(opacity=70);
}

/*************** Checkbox ********************/
.vl-cb .ant-checkbox {
  border: 1px solid #C8C8C8;
  border-radius: 3px;
  margin: 8px;
}
.vl-cb .ant-checkbox-inner {
  background-color: transparent;
  border: 0;
  width: 14px;
  height: 14px;
}
.vl-cb .ant-checkbox-inner:checked {
  background-color: #0092D7;
  border-color: #0092D7;
}
.vl-cb .ant-checkbox-checked .ant-checkbox-inner {
  background-color: #0092D7;
  border-color: #0092D7;
}
.vl-cb .ant-checkbox + span {
  padding: 0;
}
.vl-cb .ant-checkbox-wrapper:hover .ant-checkbox-inner,
.vl-cb .ant-checkbox:hover .ant-checkbox-inner,
.vl-cb .ant-checkbox-input:focus + .ant-checkbox-inner {
  border-color: #083659;
}
.vl-cb .ant-checkbox-checked::after {
  border-color: #083659;
}

.profile-spec.ant-select:not(.ant-select-customize-input) .ant-select-selector {
  color: #7D7D7D;
  background-color: #0A1F33;
  border: none;
}

.profile-spec {
  width: 100%;
  min-width: 200px;
}
.profile-spec .ant-select-arrow {
  color: #C8C8C8;
}

.profile-spec.ant-select-multiple .ant-select-selection-item {
  background-color: #0A1F33;
  border: none;
  font-size: 16px;
}

.vl-cb-label, .fav-layer, .cb-label-active, .inner-panel-title {
  color: #C8C8C8;
  font-family: "OpenSansReg";
  font-style: normal;
}

.cb-label-active, .inner-panel-title {
  color: #0092D7;
}

/********** image with text style and hover together ************/
.fav-section {
  padding-top: 4px;
  text-align: right;
  margin-right: 40px;
}
.fav-section .ant-btn-link {
  padding: 0;
}

.fav-section:hover img,
.fav-section:hover .fav-layer {
  filter: invert(54%) sepia(100%) saturate(1009%) hue-rotate(181deg) brightness(103%) contrast(102%);
}

.noFavorites {
  color: #C8C8C8;
  font-family: "OpenSansReg";
  font-style: normal;
  font-size: 16px;
  padding: 40px;
}

/*************************** Divider ***************/
.vl-hr-invite {
  margin: 0 40px;
  border-top: 0;
  border-left: 0;
  border-right: 0;
  border-bottom: 1px solid #7D7D7D;
}

/*************************** invite panel ***************/
.invite-header .ant-switch,
.profile .ant-switch,
.edit-profile .ant-switch,
.custom-switches .ant-switch {
  height: 18px;
  line-height: 18px;
  width: 32px;
  min-width: 32px;
  background-color: #7D7D7D;
}
.invite-header .ant-switch .ant-switch-handle,
.profile .ant-switch .ant-switch-handle,
.edit-profile .ant-switch .ant-switch-handle,
.custom-switches .ant-switch .ant-switch-handle {
  top: 4px;
  left: 4px;
  width: 10px;
  height: 10px;
}
.invite-header .ant-switch .ant-switch-handle::before,
.profile .ant-switch .ant-switch-handle::before,
.edit-profile .ant-switch .ant-switch-handle::before,
.custom-switches .ant-switch .ant-switch-handle::before {
  background-color: #FFFFFF;
}
.invite-header .ant-switch.ant-switch-checked,
.profile .ant-switch.ant-switch-checked,
.edit-profile .ant-switch.ant-switch-checked,
.custom-switches .ant-switch.ant-switch-checked {
  background-color: #0092D7;
}
.invite-header .ant-switch.ant-switch-checked .ant-switch-handle,
.profile .ant-switch.ant-switch-checked .ant-switch-handle,
.edit-profile .ant-switch.ant-switch-checked .ant-switch-handle,
.custom-switches .ant-switch.ant-switch-checked .ant-switch-handle {
  left: 60%;
}
.invite-header .ant-switch.ant-switch-checked .ant-switch-handle::before,
.profile .ant-switch.ant-switch-checked .ant-switch-handle::before,
.edit-profile .ant-switch.ant-switch-checked .ant-switch-handle::before,
.custom-switches .ant-switch.ant-switch-checked .ant-switch-handle::before {
  background-color: #FFFFFF;
}
.invite-header .switch-label,
.profile .switch-label,
.edit-profile .switch-label,
.custom-switches .switch-label {
  display: inline-block;
  margin: 0 10px 0 5px;
  vertical-align: middle;
}
.invite-header .switch-icon,
.profile .switch-icon,
.edit-profile .switch-icon,
.custom-switches .switch-icon {
  display: inline-block;
  margin: 0 10px 0 5px;
  height: 35px;
}

.invite-panel {
  display: flex;
  flex-flow: column;
  height: 100%;
  padding-bottom: 60px;
}

.invite-header {
  margin-right: 65px;
  height: 55px;
  line-height: 55px;
  position: absolute;
  top: 0;
  right: 0;
  text-align: right;
}

.vl-invite-tabs {
  margin: 0 40px;
  height: 40px;
  line-height: 40px;
  display: flex;
  border-top: 1px solid #7D7D7D;
  border-bottom: 1px solid #7D7D7D;
  cursor: pointer;
  font-size: 16px;
}
.vl-invite-tabs div {
  flex: 1 0 auto;
  text-align: center;
  height: 100%;
  color: #7D7D7D;
}
.vl-invite-tabs div.vl-selected {
  background-color: #0091D6;
  color: #FFFFFF;
}

.vl-saveToFav {
  height: 80px;
  margin-left: 40px;
  padding-top: 20px;
}

/**************************  List **********************/
li.ant-list-item.vl-list-item {
  margin: 0 40px;
  padding: 5px 0;
  width: 420px;
  min-height: 60px;
}

@media screen and (max-width: 1024px) {
  .vl-movableMod {
    z-index: 1000;
    width: 100vw;
    height: calc(100vh - 50px);
  }
  .ant-layout-footer {
    padding: 0;
  }
  .vl-header {
    min-height: 70px;
  }
  .vl-header .vl-right-section {
    display: flex;
    align-items: center;
  }
  .vl-app-footer.ant-layout-footer {
    min-height: 70px !important;
    padding: 10px !important;
  }
  .vl-footer-img {
    height: 40px !important;
  }
  .vl-chat-main {
    height: calc(100vh - 320px);
  }
  .vl-chat-footer {
    bottom: 10px !important;
  }
  .vl-chat-form .vl-select-field, .vl-chat-form .vl-select-field-lgr, .vl-chat-form .edit-profile-custom, .vl-chat-form .select-field-header {
    margin-left: 0 !important;
  }
  .vl-modalDivider {
    width: calc(100% - 20px);
  }
  .vl-select-field, .vl-select-field-lgr, .edit-profile-custom, .select-field-header {
    width: calc(100% - 80px);
  }
}
.list-star {
  line-height: 50px;
}

.list-star-hidden {
  padding-right: 23px;
}

.profile-available .ant-badge-status-default {
  background-color: #44B449;
}

.profile-oncall .ant-badge-status-default {
  background-color: #1990cf;
}

.profile-dnd .ant-badge-status-processing, .profile-dnd .search-profile1 .ant-badge-status-default, .search-profile1 .profile-dnd .ant-badge-status-default, .profile-dnd .search-profile .ant-badge-status-default, .search-profile .profile-dnd .ant-badge-status-default {
  background-color: #FF0000;
}

.profile-offline .ant-badge-status-default {
  background-color: #7D7D7D;
}

.circle1 {
  background-color: #0092D7;
  border: 1px solid #0092D7;
  height: 40px;
  border-radius: 50%;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  width: 40px;
}

.vl-circle-inner1, .circle-inner-100, .circle-inner-big {
  width: 40px;
  height: 40px;
  border-radius: 40px;
  color: #083659;
  line-height: 40px;
  text-align: center;
  background: #0092D7;
  font-weight: bold;
  font-size: 15px;
  display: inline-block;
  margin: 5px 0;
}

.circle-inner-big {
  width: 300px;
  height: 300px;
  border-radius: 300px;
  line-height: 300px;
  font-size: 100px;
  user-select: none;
}
.circle-inner-big:hover {
  background-color: #0092D7;
}

.circle-inner-100 {
  width: 100px;
  height: 100px;
  border-radius: 100px;
  line-height: 100px;
  font-size: 30px;
  cursor: pointer;
  margin-bottom: 15px;
}

.badge-style {
  display: inline-block;
  color: #C8C8C8;
  font-family: "OpenSansReg";
  font-style: normal;
  font-size: 16px;
  margin: 0 10px;
}

.search-profile1 .ant-badge-status-text {
  color: red;
}
.search-profile1 .ant-badge-status-processing, .search-profile1 .ant-badge-status-default {
  width: 12px;
  height: 12px;
  margin: 12px;
}
.ant-collapse > .ant-collapse-item > .ant-collapse-header .ant-collapse-arrow svg {
  fill: #C8C8C8;
}

span.filled.anticon.anticon-star:hover {
  color: red !important;
}

.video-button1 {
  width: 25px;
}

.icon1 {
  margin-top: 10px;
}

.full-width, .full-size, .main-spin, .search-content, .vl-profiles-list-item, .top-header, .edit-form, .devices-form, .top-header.ant-layout-header, .vl-app-footer.ant-layout-footer {
  width: 100%;
}

.ant-tabs > .ant-tabs-nav .ant-tabs-nav-wrap,
.ant-tabs > div > .ant-tabs-nav .ant-tabs-nav-wrap {
  justify-content: center;
}

.vl-radio-group .ant-radio-group {
  margin: 20px 40px 0;
  display: flex;
  flex-flow: row wrap;
}
.vl-radio-group .ant-radio-group label {
  display: inline-block;
  margin: 0;
  flex: 1 0 auto;
  text-align: center;
  height: 100%;
}
.vl-radio-group.ipc-modal .ant-radio-group {
  flex-flow: column wrap;
}
.vl-radio-group.ipc-modal .ant-radio-wrapper {
  text-align: left;
}
.vl-radio-group.ipc-modal .ant-radio-wrapper-checked {
  color: #0092D7 !important;
}
.vl-radio-group.ipc-modal .ant-radio-wrapper::after {
  height: 0;
}
.vl-radio-group.ipc-modal .note {
  color: #FFFFFF;
  font-size: 12px;
  margin: 0 0 0 25px;
}
.vl-radio-group .ant-radio-wrapper {
  font-family: "OpenSansReg";
  font-weight: normal;
  font-size: 16px;
  color: #C8C8C8;
}
.vl-radio-group .ant-radio-wrapper.ant-radio-wrapper-checked {
  color: #44B449;
}
.vl-radio-group .ant-radio-inner {
  border-color: #C8C8C8 !important;
  background-color: #083659 !important;
  border-width: 2px;
}
.vl-radio-group .ant-radio-checked .ant-radio-inner {
  border-color: #C8C8C8 !important;
  background-color: #083659 !important;
  border-width: 2px;
}
.vl-radio-group .ant-radio-checked .ant-radio-inner::after {
  background-color: #44B449 !important;
}
.vl-radio-group .ant-radio-inner:hover,
.vl-radio-group .ant-radio:hover .ant-radio-inner,
.vl-radio-group .ant-radio-wrapper:hover,
.vl-radio-group .ant-radio-input:focus .ant-radio-inner {
  border-color: #44B449 !important;
}

.vl-header-menu.ant-dropdown-menu {
  background-color: #0C2A44;
  border-radius: 5px;
  color: #C8C8C8 !important;
  font-weight: normal;
  font-size: 16px;
  padding: 15px 8px;
}

.vl-header-menu .ant-dropdown-menu-item,
.vl-header-menu .ant-dropdown-menu-submenu-title {
  color: #C8C8C8;
  font-weight: normal;
  font-size: 16px;
}
.vl-header-menu .ant-dropdown-menu-item:hover,
.vl-header-menu .ant-dropdown-menu-submenu-title:hover {
  background-color: transparent;
  color: #0092D7;
}

.ant-notification-notice {
  background-color: #0C2A44 !important;
  border-radius: 5px;
  color: #C8C8C8 !important;
  font-weight: normal;
  font-size: 16px;
  padding: 15px 8px;
}
.ant-notification-notice .ant-notification-notice-message {
  color: #FFFFFF;
}

.ant-notification-topRight {
  top: 120px !important;
}

.header-modal, .common-modal {
  background: rgba(12, 42, 68, 0.9);
  border-radius: 10px;
  padding-bottom: 0 !important;
}
.header-modal .ant-modal-content, .common-modal .ant-modal-content {
  background-color: transparent;
}
.header-modal .ant-modal-header, .common-modal .ant-modal-header {
  background-color: transparent;
  border-bottom: 0;
  padding: 0 40px;
}
.header-modal .ant-modal-title, .common-modal .ant-modal-title {
  color: #0092D7;
  width: 100%;
}
.header-modal .ant-modal-close, .common-modal .ant-modal-close {
  right: 18px;
}
.header-modal .ant-modal-body, .common-modal .ant-modal-body {
  padding: 20px 40px 40px 40px;
  color: #C8C8C8;
}
.header-modal .anticon:not(.ant-select-suffix), .common-modal .anticon:not(.ant-select-suffix) {
  color: #0092D7;
}
.header-modal .anticon:not(.ant-select-suffix):hover, .common-modal .anticon:not(.ant-select-suffix):hover {
  color: #49B2FF;
}

.modal-title {
  color: #0092D7;
  box-sizing: content-box !important;
  width: 100%;
  height: 55px;
  line-height: 55px;
  font-size: 24px;
  margin-right: 25px;
  border-bottom: 1px solid #7D7D7D;
}

.profile-edit-btn:hover {
  color: #0092D7;
  filter: invert(59%) sepia(84%) saturate(1302%) hue-rotate(179deg) brightness(100%) contrast(102%);
}

.profile-edit {
  color: #0092D7;
  font-family: "OpenSansReg";
  font-size: 16px;
  margin: 0 10px;
}
/*!***************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!../src/assets/styles/videodevices.scss ***!
  \***************************************************************************************************************************************************************************************/
.vl-bars-wrapper {
  width: 100%;
}

.vl-bar {
  width: calc(10% - 10px);
  height: 5px;
  display: inline-block;
  margin: 5px;
  background-color: #C8C8C8;
}
/*!********************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!../src/assets/styles/video.scss ***!
  \********************************************************************************************************************************************************************************/
.video-container {
  border: 0;
  background-color: transparent;
  width: 100%;
  background-color: black;
  height: calc(100vh - 200px);
  margin-top: 0px;
}
.video-container .ant-layout {
  height: 100%;
}
.video-container .ant-layout-header, .video-container .ant-layout-footer {
  height: 60px;
  padding: 0;
  margin: 0;
}
.video-container .video-button {
  width: 50px;
  height: 50px;
  margin-left: 10px;
  margin-right: 10px;
}
.video-container .video-button-background {
  background-color: #080A0B;
  opacity: 0.83;
  border-radius: 5px;
}
.video-container .main-video {
  height: 100%;
  max-height: 100%;
  background-color: black;
  position: relative;
}
.video-container .main-video .vl-video-spin {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 200px;
  height: 200px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.video-container .main-video video {
  width: 100% !important;
  height: 100% !important;
  max-height: 100% !important;
}
.video-container .main-video .selfview-video, .video-container .main-video .eko-video {
  position: absolute;
  z-index: 2;
  width: auto;
  height: 113px;
  cursor: move;
}
.video-container .main-video .eko-video {
  border: 2px solid #216ba5;
}
.video-container .main-video .selfview-video-off {
  border-style: solid;
  border-color: red;
}
.video-container .main-video .camera-right-layout {
  position: absolute;
  z-index: 2;
  width: 200px;
  height: 300px;
  right: 10px;
  bottom: 150px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.video-container .video-buttons {
  display: flex;
  flex-direction: row;
  width: 100%;
  height: 60px;
  padding-top: 5px;
  padding-bottom: 5px;
  justify-content: center;
}

.vl-screenshot-canvas {
  position: absolute;
  visibility: hidden;
  display: none;
}

.video-camera-modal .ant-modal-header {
  background: none;
  color: transparent;
}
.video-camera-modal .ant-modal-title {
  color: white;
}
.video-camera-modal .ant-modal-close {
  color: white;
}
.video-camera-modal .ant-modal-content {
  background-color: rgba(0, 0, 0, 0.3);
  border-radius: 25px;
}
.video-camera-modal .ant-slider-track {
  background-color: white;
}
.video-camera-modal .ant-slider-rail {
  background-color: white;
}
.video-camera-modal .ant-slider-handle {
  background-color: #083659;
  border: solid 2px #083659;
}
.video-camera-modal .menu-button {
  width: 20px;
  height: 20px;
}
.video-camera-modal h3 {
  color: white;
  margin: 0;
}
.video-camera-modal .ant-row {
  margin-bottom: 10px;
}

.vl-movableDiv {
  border: 0.5px solid #c6c6c8;
}

.video-container:-webkit-fullscreen {
  width: 100vw;
  height: 100vh;
  /** etc.. */
}

.video-container:-moz-fullscreen {
  width: 100vw;
  height: 100vh;
  /** etc.. */
}

.video-container:-ms-fullscreen {
  width: 100vw;
  height: 100vh;
  /** etc.. */
}

.video-container:fullscreen {
  width: 100vw;
  height: 100vh;
  /** etc.. */
}
/*!*******************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!../src/assets/styles/zoom.scss ***!
  \*******************************************************************************************************************************************************************************/
.vl-zoomContainer > div {
  transform: translate(0px, 0px) !important;
}

.vl-zoomContainer * {
  box-shadow: none !important;
}

.vl-zoomContainer {
  position: relative;
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  background-color: #242424;
}

#zmmtg-root {
  display: none;
}

[data-no-focus-lock=true] {
  display: none !important;
}

.video-avatar__mute-button {
  display: none !important;
}

.meeting-info-container {
  display: none !important;
}

#wc-footer {
  height: 72px;
}

.vl-app-footer {
  height: inherit;
}

.vl-right-section,
.vl-middle-section,
.vl-left-section {
  padding-top: 5px;
}
/*!*****************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[3].use[1]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[3].use[2]!./src/assets/styles/app.scss ***!
  \*****************************************************************************************************************************************************************************/
html {
  overflow: hidden;
}

body {
  margin: 0;
  overflow: scroll;
  overflow-y: auto !important;
}

.demo-root {
  display: flex;
  flex-direction: column;
}

.demo-buttons {
  margin: 10px 0 0 14px;
}
.demo-buttons button {
  margin-right: 5px;
  padding: 5px !important;
  background: inherit !important;
  border: 1px solid black !important;
}

.demo-input {
  margin: 10px 0 0 10px;
  display: flex;
  flex-direction: column;
}
.demo-input input, .demo-input select {
  margin: 5px;
}

.zoom-demo-component {
  margin: 0;
  width: 100vw;
  height: 100vh;
}

.pexip-demo-component {
  height: 100% !important;
  max-height: 100% !important;
  width: 100% !important;
  background-color: black;
}

.vl-zoomContainer > div {
  transform: translate(0px, 0px) !important;
}

.vl-zoomContainer * {
  box-shadow: none !important;
}

.vl-zoomContainer {
  position: relative;
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  background-color: #242424;
}

/*# sourceMappingURL=main.css.map*/