/* --- /styles/layout-util.css--- */ 

.layout-util-full-screen .fixed-layout {
    width: 100vw;
}
.layout-util-full-screen #right-container-secondary,
.layout-util-full-screen .right-container-dynamic {
    width: calc(100vw - 350px);
}
.layout-util-full-screen .full-page-layout {
    left: 0;
    width: 100vw;
}
.layout-util-full-screen .contacts-selector-slider-container {
    left: 0
}
.layout-util-side-bar-toggle {
    display: none;
    position: fixed;
    left: 350px;
    top: calc(50vh - 23px);
    width: 22px;
    height: 46px;
    z-index: 1001;
}
.layout-util-side-bar-toggle span {
    display: none;
    position: absolute;
    left: 5px;
    top: 16px;
}
.layout-util-full-screen-toggle {
    display: none;
    position: fixed;
    right: 5px;
    bottom: 5px;
    width: 46px;
    height: 46px;
    z-index: 2000;
}
body:not(.layout-util-full-screen) .layout-util-full-screen-toggle {
    right: calc((100vw - 1260px) / 2);
}
body:not(.layout-util-full-screen) .layout-util-side-bar-toggle {
    left: calc((100vw - 1260px) / 2 + 351px);
}
body:not(.layout-util-full-screen).layout-util-side-bar-off .layout-util-side-bar-toggle {
    left: calc((100vw - 1260px ) / 2);
}
.layout-util-full-screen-toggle span {
    display: none;
    position: absolute;
    left: 12px;
    top: 9.5px;
}
.full-screen-controls .layout-util-full-screen-toggle {
    display: block;
}
.side-bar-controls .layout-util-side-bar-toggle {
    display: block;
}
body:not(.layout-util-side-bar-off) .layout-util-side-bar-toggle [data-role="toggle-off"] {
    display: block;
}
.layout-util-side-bar-off .layout-util-side-bar-toggle [data-role="toggle-on"] {
    display: block;
}
.layout-util-side-bar-off .layout-util-side-bar-toggle {
    left: 0;
}
.layout-util-side-bar-off .right-container {
    width: 100vw !important;
}
.layout-util-side-bar-off .full-page-layout .areas-separator {
    display: none;
}
body[data-selected-menu-item="menu-item-conversation-list"].layout-util-side-bar-off .full-page-layout .right-area {
    width: 100vw;
    left: 0;
    position: fixed;
}
body[data-selected-menu-item="menu-item-conversation-list"].layout-util-side-bar-off [data-role="chat-window-main"] {
    display: none !important;
}
body[data-selected-menu-item="menu-item-conversation-list"].layout-util-side-bar-off .left-area {
    display: none !important;
}
body:not(.layout-util-full-screen) .layout-util-full-screen-toggle [data-role="toggle-off"] {
    display: block;
}
.layout-util-full-screen .layout-util-full-screen-toggle [data-role="toggle-on"] {
    display: block;
}
body:not(.layout-util-full-screen).layout-util-side-bar-off .geolocation-page {
    left: calc((100% - 1260px) / 2) !important;
    width: 1260px !important;
}
body.layout-util-full-screen.layout-util-side-bar-off .geolocation-page {
    left: 0;
    width: 100vw;
}
body.layout-util-full-screen:not(.layout-util-side-bar-off) .geolocation-page {
    left: 350px;
    width: calc(100vw - 350px);
}
body.layout-util-full-screen .forwarder {
    width: 100vw;
    left: 0;
}
body.forwarder-on .layout-util-side-bar-toggle {
    display: none;
}
body.forwarder-on .geolocation-page {
    display: none !important;
}
body.forwarder-on .forwarder .bar .sw-button {
    margin-right: 60px;
}

/* --- /styles/full-page-layout-manager.css--- */ 

.full-page-layout {
  display: none;
  position: absolute;
  top: 54px;
  left: calc((100% - 1260px) / 2);
  width: 1260px;
  height: calc(100% - 54px);
  z-index: 3;
}
.full-page-layout .left-area .sliding-layer-container {
  top: 75px;
  height: calc(100% - 75px);
}
.full-page-layout .left-area {
  position: absolute;
  display: flex;
  flex-direction: column;
  top: 0px;
  width: 350px;
  height: 100%;
}
.full-page-layout .right-area {
  position: absolute;
  display: block;
  top: 0px;
  left: 352px;
  width: calc(100% - 352px);
  height: 100%;
}
.full-page-layout .left-area .ps-scrollbar-y-rail {
  right: 0px !important;
}
.full-page-layout .left-area .ps-scrollbar-x-rail {
  bottom: 0px !important;
}
.full-page-layout .company-logo {
  display: none;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 350px;
  height: 159px;
  padding: 32px 41px 10px 40px;
  text-align: center;
  overflow: hidden;
}
.full-page-layout .company-logo .border {
  position: absolute;
  bottom: -1px;
  left: 20px;
  width: calc(100% - 40px);
  height: 1px;
}
.full-page-layout .company-logo img {
  margin: 0 auto;
  display: block;
  max-height: 100%;
  max-width: 100%;
}
.full-page-layout .left-area > .title {
  position: relative;
  height: 60px;
  padding-top: 28px;
  padding-left: 20px;
  padding-right: 20px;
}
.full-page-layout .left-area > .content {
  position: relative;
  width: 100%;
  height: calc(100% - 162px);
  z-index: 1;
  overflow: hidden;
}
.full-page-layout .left-area.with-logo {
  top: 149px;
  height: calc(100% - 149px);
}
.full-page-layout .areas-separator {
  position: absolute;
  top: 0px;
  left: 350px;
  width: 2px;
  height: 100%;
  z-index: 2;
}
.full-page-layout .content > * {
  display: none;
}
.full-page-layout .ps-container {
  overflow: hidden;
  position: relative;
}
.full-page-layout .ps-container.ps-active-x {
  padding-bottom: 12px;
}
.search-manager {
  position: relative;
  margin: 15px 15px 0;
  height: 30px;
}
.search-manager input {
  position: absolute;
  width: 100%;
  height: 100%;
  line-height: 30px;
  padding-right: 32px;
  left: 0;
}
.search-manager .reset-button {
  position: absolute;
  right: 0px;
  top: 0px;
  width: 30px;
  height: 100%;
  line-height: 30px;
}
.search-manager .reset-button span {
  display: block;
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  line-height: 30px !important;
  text-align: left;
}
.search-manager .reset-button .stw-search-clear {
  display: none;
}
.search-manager .reset-button .stw-search-general {
  display: block;
}
.search-manager.active .reset-button .stw-search-clear {
  display: block;
}
.search-manager.active .reset-button .stw-search-general {
  display: none;
}
.full-page-layout .disablement-mask {
  display: none;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
}
.full-page-layout .disablement-mask .bg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  opacity: 0.1;
}
.full-page-layout .disablement-mask #loading {
  position: absolute;
  top: calc(50% - 25px);
}
.full-page-layout .disablement-mask.active {
  display: block;
}
.full-page-layout .disablement-mask.interface-blocker {
  /* this will come under toaster */
  z-index: 999;
}
.full-page-layout .full-page-layer {
  display: none;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  z-index: 100;
}
.full-page-layout .controls-bar {
  display: flex;
  height: 42px;
  line-height: 42px;
}
.full-page-layout .multiselection-controls {
  flex-grow: 1;
  height: 100%;
}
.full-page-layout .multiselection-controls .layer .icon {
  font-size: 20px !important;
}
.full-page-layout .multiselection-controls .layer {
  display: flex;
  width: 100%;
  height: 100%;
  padding-left: 17px;
}
.full-page-layout .multiselection-controls .layer .control {
  display: flex;
  width: auto;
  cursor: pointer;
}
.full-page-layout .multiselection-controls .text {
  margin-left: 5px;
  font-size: 14px;
}
.full-page-layout
  .multiselection-controls:not(.multi-select-on)
  [data-role='open-selection'] {
  display: flex;
}
.full-page-layout
  .multiselection-controls:not(.multi-select-on)
  [data-role='close-selection'] {
  display: none;
}
.full-page-layout
  .multiselection-controls.multi-select-on
  [data-role='open-selection'] {
  display: none;
}
.full-page-layout
  .multiselection-controls.multi-select-on
  [data-role='close-selection'] {
  display: flex;
}
.full-page-layout
  .multiselection-controls.multi-select-on
  [data-role='close-selection']
  .control {
  margin-right: 10px;
}
.full-page-layout .controls-bar .controls {
  flex-shrink: 0;
  margin-right: 20px;
}
.full-page-layout .controls .control {
  display: inline-block;
  width: 20px;
  text-align: center;
  font-size: 17px;
}
.full-page-layout .control-icon,
.full-page-layout .control-label {
  position: relative;
  height: 100%;
  display: inline-block;
  vertical-align: top;
  line-height: 42px;
}
.full-page-layout .control-icon {
  width: 30px;
  margin-left: 10px;
}
.full-page-layer.left-side-only {
  width: 350px !important;
}
.full-page-layer.left-side-only .right-area {
  display: none;
}
body.with-full-page-layout .organization-logo-container {
    display: none;
}
@media (max-width: 1260px) {
  .full-page-layout {
    left: 0px;
  }
}


/* --- /styles/select2.css--- */ 

.select2-container {
    max-width: 100%;
    width: auto;
}
.select2-selection--multiple:after {
    position: absolute;
    right: 5px;
    top: 12px;
    width: 10px;
    height: 10px;
    display: inline-block;
    content: "";
}
.select2-container.with-search-icon .select2-selection--multiple:after {
    display: none !important;
}
.select2-container.with-search-icon:before {
    position: absolute;
    right: 20px;
    top: -4px;
    width: 10px;
    height: 10px;
    display: block;
    z-index: 2;
}
.select2-selection__choice__remove {
    margin-top: 4px;
}
.select2-drop.select2-message-disabled {
    display: none !important;
}
.select2-container--default .select2-selection--multiple {
    padding-right: 25px;
}
.select2-results {
    max-height: 240px;
}
.select2-container--default .select2-selection--multiple .select2-search__field {
    min-width: 0px !important;
}

/* --- /styles/style.css--- */ 

/* GLOBAL STYLES
-------------------------------------------------- */

:root {
    font-size: 14px;
}

/* Padding below the footer and lighter body text */
body {
    position: relative;
    overflow-y: hidden;
}
#global-preloader {
    position: fixed;
    top:0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 1003;
    transition: all 0.5s linear;
    display: flex;
}
#global-preloader img {
    opacity: 1;
    animation: globalPreloaderOpacity 1s infinite;
    position: relative;
    margin: auto;
    animation-timing-function: ease-in-out;
}
@keyframes globalPreloaderOpacity {
    50% {opacity: .5;}
    100% {opacity: 1;}
}
#global-preloader.will-remove {
    opacity: 0;
}
#loki-pages {
    display: none;
    margin: 0 auto;
    width: 1260px;
    padding-top: 54px;
    height: 100%;
}
body.layout-util-full-screen #loki-pages {
    width: 100vw;
    left: 0;
}
.container {

    position: relative
}
h1 {
    margin: 0;
}
a {
    outline: none;
}
.container:before, .container:after, .container-fluid:before, .container-fluid:after, .row:before, .row:after, .form-horizontal .form-group:before, .form-horizontal .form-group:after, .btn-toolbar:before, .btn-toolbar:after, .btn-group-vertical > .btn-group:before, .btn-group-vertical > .btn-group:after, .nav:before, .nav:after, .navbar:before, .navbar:after, .navbar-header:before, .navbar-header:after, .navbar-collapse:before, .navbar-collapse:after, .pager:before, .pager:after, .panel-body:before, .panel-body:after, .modal-footer:before, .modal-footer:after {
    display: none;
    content: " ";
}
.preloader-loading-mask {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
}
.preloader-loading-mask-global {
    position: fixed !important;
    z-index: 1049;
}
.preloader-loading-mask .label-container
{
    position: absolute;
    width: 100%;
    height: 10%;
    top: 45%;
    left: 0px;
    display: block;
    text-align: center;
}
.disabled-control * {
    cursor: default !important;
}
#loading {
    width: 100%;
    height: 50px;
}

/* inputs */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
textarea {
    width: 272px;
    height: 30px;
    padding-left: 5px;
}
textarea {
    resize: vertical;
}
/* modal */
.modal-header {
    padding: 15px 15px 17px 20px;
    display: block;
}
.modal-header .close {
    width: 21px;
    height: 21px;
}
body.modal-open {
    overflow: visible;
}
.modal {
    top: 60px;
    overflow-y: auto;
}
.checkbox-container {
    position: relative;
    width:20px;
    height:20px;
    float:left;
}

select::-ms-expand {
    display: none;
}

/* checkbox */
input[type="checkbox"] {
    display:none;
}
input[type="checkbox"] + label span {
    display:inline-block;
    width:20px;
    height:20px;
    margin:-1px 4px 0 0;
    vertical-align:middle;
    cursor:pointer;
}
/* messages */
.message-area {
    float: left;
    max-width: 100%;
    position: relative;
    padding: 10px 5px 10px 30px;
    min-height: 12px;
    display: none;
    min-width: 220px;
}
.message-area.error,
.message-area.success {
    padding-left: 25px;
    min-height: 20px;
}
.message-area {
    position: relative
}
.message-area .arrow {
    width:10px;
    height:10px;
    position: absolute;
}
.message-area .arrow-left {
    left: -4px
}
.message-area.password .arrow,
.message-area .arrow-top {
    top: -4px
}
.message-area .arrow-right {
    right: -4px
}
.message-area .arrow-bottom {
    bottom: -4px;
    left: 10px;
}
.login .message-area {
    width: 100%;
}
.ie8 select,
.ie9 select {
    padding-right: 12px !important;
    width:145% !important;
}
select {
    -moz-appearance: none;
    padding: 2px 25px 2px 5px;
    text-indent: 0.01px;
    text-overflow: ellipsis;
    width: 120% !important;
}
.ie8 .checkbox-container label {
    display: none;
}
.user-info {
    margin: 7px 7px 7px 20px;
    float: left;
}
.user-image {
    width: 40px;
    height: 40px;
    float: left;
    margin-right: 10px;
    position: relative;
}
span.user-name {
    max-width: 268px;
    display: block;
    overflow: hidden;
    height: 30px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.circle {
    height: 24px;
    line-height: 24px;
    min-width: 24px;
    width: auto;
    padding-left: 3px;
    padding-right: 3px;
    margin-left: 5px;
    display: block;
    text-align: center;
    vertical-align: middle;
    position: absolute;
    left: 50%;
    top: 8px;
}
.user-image .circle {
    margin-left: 5px;
    left: 24px;
    top: -5px;
}
.copyright {
    position: absolute;
    bottom: 0;
    margin: 10px 0;
}
.copyright .privacy {
    margin-top: 5px;
}
/* tooltip */
.tooltip {
    position: fixed;
    z-index: 1060;
}
.info {
    display: block;
    width: 30px;
    height: 30px;
}
.organization-logo-container {
    width: 100%;
    height: auto;
    margin-top: -66px;
    padding-top: 66px;
    position: relative;
    z-index: 100;
}
.organization-logo {
    padding:20px;
    width: 100%;
    height: 148px;
    overflow: hidden;
}
.organization-logo.no-logo {
    padding: 0 !important;
}
.organization-logo img {
    margin: 0 auto;
    display: block;
    max-height: 100%;
    max-width: 100%;
}

.ie8 input[type='checkbox'] {
    width:20px;
    height:20px;
}

.ie8 .checkbox-text {
    padding-left: 23px;
    height: 20px;
    padding-top: 5px;
    display: block;
}
.no-results {
    margin: 20px;
    text-align: center;
}
.conversation-controls .no-results {
    position: absolute;
    top: 179px;
    margin: 0px;
    text-align: center;
    width: 100%;
    height: 38px;
    z-index: 1;
}
.js-confirmation-dialog {
    z-index: 2001;
}
.js-confirmation-dialog .modal-sm{
    width: 410px !important;
}
.js-confirmation-dialog .modal-dialog .modal-content .modal-footer {
    justify-content: space-between;
}
.js-confirmation-dialog .modal-footer button {
    height: 30px;
    padding: 0px 30px;
}
.js-confirmation-dialog .modal-body {
    padding-bottom: 0;
    padding-left: 20px;
    margin-bottom: 16px;
}
.js-confirmation-dialog .modal-body .text-message {
    word-break: break-word;
}
.js-confirmation-dialog .modal-footer {
    margin-top: 10px;
}
.js-confirmation-dialog .info {
    display: inline-block;
    vertical-align: middle;
}
.js-call-notification-dialog .confirmation-checkbox-container {
    margin-top: 40px;
}
.js-call-notification-dialog p.text-message {
    margin-bottom: 30px;
}

/* Uploader */
.qq-upload-list {
    display: none;
}
.error-notification-bar {
    position: absolute;
    top: 230px;
    left: 0px;
    width: 100%;
    height: 30px;
    text-align: center;
    z-index: 99999;
    display: none;
}
.error-notification-bar button,
.error-notification-bar label {
    height: 30px;
    line-height: 30px;
    display: inline-block;
}
.form-container {
    margin: 50px 0;
}
.container {
    width: 100%;
    /* to override max-width from bootstrap*/
    max-width: 100%;
    padding: 0 !important;
}
.container.container-menu {
    width: 1260px;
    margin: 0;
    padding: 0 !important;
    float:left;
    height:66px;
}
.navbar-brand {
    width: 138px !important;
    height: 66px !important;
    margin: 0 !important;
}
.nav-left,
.nav-right {
    width:calc(50% - 630px);
    height: 54px;
}
.menu-left {
    height: 54px;
    width: 213px;
    float: left;
}
.menu-right {
    float: right;
    width: calc(100% - 351px);
    height: 54px;
}
.navbar-collapse {
    padding: 0 !important;
}
.pull-left-sm,
.nav-left {
    float: left;
}
.pull-right-sm,
.nav-right {
    float: right;
}
.left-container {
    width: 351px;
    float: left;
    padding: 66px 20px 0px 20px;
    position: absolute;
    z-index: 1;
    display: flex;
    flex-direction: column;
}
.left-container.login {
    height: 100%;
    position: relative;
    min-height: 620px;
    z-index: 2;
}
#right-container{
    position: relative;
    width: calc(100% - 351px);
    float: right;
    padding: 66px 30px 30px 30px;
    overflow: hidden;
}
#right-container-secondary,
.right-container-dynamic {
    width: 909px;
    height: calc(100% - 54px);
    z-index: 3;
    position: absolute;
    top: 54px;
    right: 0px;
    display: none;
}
.welcome {
    margin: 0 auto;
    width: 510px;
}
.left-container .logo {
    text-align: center;
}

.settings-menu {
    float: right;
}
.fixed-layout {
    width: 1260px;
    height: 100%;
    margin: 0 auto;
    position: relative;
    overflow-y: hidden;
}
.fixed-layout > #loading {
    position: absolute;
    z-index: 1049;
    height: 100%;
}
.deactivation-mask {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 99998;
    cursor: default !important;
}
.deactivation-mask-message {
    position: absolute;
    left: 0px;
    top: 200px;
    width: 100%;
    height: auto;
    min-height: 30px;
    line-height: 30px;
    z-index: 99999;
    text-align: center;
}
.extra-scroll {
    position: relative;
    display: block;
    height: 50px;
    width: 100%;
}
.settings-password .error {
    position: absolute;
    right: 20px;
}
.contact-scroll {
    position: relative;
    overflow: hidden;
}
.no-contacts {
    min-height: 100px;
}
.no-contacts:after {
    content: attr(data-content);
    position: absolute;
    top: 20px;
    left: 0;
    width: 100%;
    height: auto;
    text-align: center;
}
.highlighting {
    line-height: 20px;
}
.chat-window-header .names .highlighting {
    line-height: inherit !important;
}
.details-group-name .highlighting,
.subscriber-details .title .highlighting {
    line-height: 25px !important;
}
.subscriber-details .user-status {
    width: 100%;
    display: block;
    text-overflow: ellipsis;
    overflow: hidden;
}
.modal-dialogs {
    display: none;
}
.modal-dialogs,
.modal-dialogs .background {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 2050;
}
.modal-dialogs .background {
    z-index: 1;
}
.modal-dialogs .dialogs {
    position: absolute !important;
    top: 100px;
    left: calc(50% - 350px);
    width: 700px;
    height: calc(100% - 100px);
    z-index: 2;
}
@media (max-height: 600px) {
    .modal-dialogs .dialogs {
        top: 54px;
        height: calc(100% - 54px);
    }
}
.custom-popup-container {
    position: absolute !important;
    top: 54px !important;
    left: 100px !important;
    width: calc(100vw - 200px) !important;
    height: calc(100vh - 100px) !important;
    z-index: 2;
    overflow-y: auto;
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}
.custom-popup-container .custom-popup {
    width: auto;
    position: relative;
    display: inline-block;
}
#modal .modal-header .close {
    display: none;
}
#modal .modal-header .sw-modal-btn-visible .close {
    display: block;
}
#modal .modal-header .sw-modal-btn-visible {
    margin-top: -17px;
}
#modal .modal-body .sw-modal-paragraph {
    text-align: left;
    padding-left: 35px;
}
#js-templates .js-call-notification-dialog {
    display: none;
}
.areas-splitter {
    position: absolute;
    left: 350px;
    top: 54px;
    width: 1px;
    height: calc(100% - 54px);
    z-index: 2;
    opacity: 1;
    display: block
}
.popover-content {
    padding: 5px 8px !important;
    min-width: 160px;
}

/* Scroll bar */
#call-banner-manager .ps-scrollbar-y-rail,
.fixed-layout .ps-scrollbar-y-rail {
    right: 0px !important;
}
.ps-scrollbar-y-rail {
    width: 15px !important;
}

.fixed-layout .ps-scrollbar-x-rail {
    bottom: 0px !important;
}
.ps-scrollbar-x-rail {
    height: 14px !important;
    border-top: 1px solid #d7d7d7;
}
.ps-scrollbar-y {
    right: 3px !important;
    width: 8px !important;
}
.ps-scrollbar-x {
    bottom: 2px !important;
    height: 8px !important;
}

/* The animation for entities which shoule be barked as loading */
.loading-entity {
    -webkit-animation-name: loadingEntity;
    -webkit-animation-duration: 0.3s;
    animation-name: loadingEntity;
    animation-duration: 0.3s;
    animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
}

.show-element {
    display: block;
}
.remove-element {
    display:none !important;
}
.hide-element {
    visibility: hidden;
}
.preloader-bar {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 40px;
    z-index: 2;
}
.preloader-bar .spinner {
    position: absolute;
    left: 10px;
    top: 5px;
    width: 29px;
    height: 28px;
}
.preloader-bar .bg {
    position: absolute;
    top: 0px;
    width: 100%;
    height: 100%;
    opacity: 0.7;
}
.preloader-bar .message {
    position: absolute;
    left: 47px;
    height: 40px;
    line-height: 40px;
}
.prevent-select-on-click,
.prevent-select-on-click * {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
@-webkit-keyframes loadingEntity {
    from {opacity: 0.2;}
    to {opacity: 1;}
}
@keyframes loadingEntity {
    from {opacity: 0.2;}
    to {opacity: 1;}
}

.contacts-container .search-more-contacts-container{
    position: relative;
    width: 100%;
    text-align: center;
}

.contacts-container .search-more-contacts{
    position: relative;
    border: none;
    border-radius: 20px;
    padding-left: 1em;
    padding-right: 1em;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}

.active-inactive-selector {
    font-family: General-font-bold, Arial, Verdana, sans-serif !important;
    text-transform: uppercase;
}
.video-conf-modal #loading {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
}
/* add member to conv */
#add-members {
    width: 200px;
    padding: 0px 0px 0px 40px;
    cursor: pointer
}

.add-to-conversation-dropdown-arrow {
    margin-right: 10px;
}

.add-to-conversation-container .option-row {
    height: 30px;
    line-height: 30px;
    white-space: nowrap;
    cursor: pointer;
}

/* Guest invite modal */
.guest-invite-modal-content {
    overflow: auto;
    width: 410px;
    max-height: 80vh;
}

.guest-invite-modal-content input[type="text"] {
    min-width: auto;
    border-radius: 4px !important;
    margin-top: 8px;
}

.guest-invite-modal-content textarea {
    margin-top: 8px;
}

.guest-invite-modal-content .modal-body {
    padding: 0 20px 0 20px;
}

.guest-invite-modal {
    position: absolute;
    top: 10%;
    right: 50%;
    bottom: 0;
    left: 50%;
    z-index: 1050;
    width: 450px;
}

.guest-invite-modal.modal {
    overflow: hidden;
}

.guest-invite-modal .modal-dialog  {
    width: auto;
    margin: 30px auto;
}

.guest-invite-confirmation-msg{
    position: absolute;
    top: 15%;
    right: 50%;
    bottom: 0;
    left: 50%;
}
.guest-invite-confirmation-msg .modal-footer button {
    width: 85px;
    height: 30px;
    border-radius: 2px;
}

.guest-phone-number {
    display: grid;
}

.guest-invite-confirmation-msg .modal-content {
    padding: 0px 5px 15px 5px;
}

.guest-invite-confirmation-msg .modal-content .modal-footer button {
    padding: 0;
}

.guest-invite-confirmation-msg .modal-content .modal-body p {
    padding: 0px 0px 10px 15px;
    text-align: left;
}

.guest-invite-modal-content .modal-body .email-phn {
    margin-top: 20px;
    display: inline-block;
    width: 100%;
}

.guest-email {
    margin-bottom: 20px;
}

.guest-invite-modal-content input[type="text"] {
    border-radius: 4px !important;
}

.invitation-mode input {
    display: inline-flex;
}

.let-me-be {
    padding-right: 50px;
}

#lokiChannelsLeft {
    height: 100%;
    display: flex;
}

.user-status-feature-disabled .user-availability-flag,
.user-status-feature-disabled .contact-item.with-availability-flag .user-availability-flag,
.user-status-feature-disabled .sw-Avatar__status,
.user-status-feature-disabled .settings-user-availability-selector,
.user-status-feature-disabled .geolocation-subscriber-marker .availability {
    display: none !important;
}
.date-picker-container ul, .bootstrap-datetimepicker-widget ul {
    padding-inline-start: 0;
}
/* WCF UI SECTION - BEGIN */
#wcf-ui-root {
    z-index: 1054 !important;
}
#wcf-ui-root.raised {
    z-index: 1055 !important;
}
@media (min-width: 1260px) {
    .wcf-ui-master-page .sidebar {
        left: calc((100vw - var(--CONTENT_WIDTH)) / 2) !important;
    }
    .wcf-ui-master-page .main-area,
    .wcf-ui-main-area-layers-container {
        left: calc((100vw - var(--CONTENT_WIDTH)) / 2 + var(--SIDE_WIDTH)) !important;
        max-width: calc(var(--CONTENT_WIDTH) - var(--SIDE_WIDTH));
    }
}
.MuiDialog-container input[type=text],
.MuiInputBase-root input[type=text] {
    border: none !important;
    box-shadow: none !important;
    height: auto !important;
    padding-left: 10px;
    min-width: 0;
}
.MuiDialog-container label,
.meeting-rooms-section label {
    font-weight: normal;
}
.wcf-ui-toaster-manager {
    top: 56px !important;
    right: calc((100vw - 1260px) / 2) !important;
}
.wcf-ui-label-with-siblings input[type=checkbox],
.wcf-ui-label-with-siblings input[type=radio] {
    display: inline-block;
}
.wcf-ui-floating-resizable-window {
    position: relative;
    /* must go over the full screen controls from Geolcation which have 2000*/
    z-index: 2001;
}
.wcf-ui-floating-resizable-window .MuiPaper-root {
    z-index: 10;
}
body.with-wcf-ui-master-page #webchat-pages > :not(#call-banner-manager) {
    display: none;
}
/* WCF UI SECTION - END */


/* --- /styles/settings.css--- */ 

#settings-left-container {
    position: absolute;
    left: 0px;
    top: 0px;
    height: 100%;
    width: 350px;
    z-index: 2;
    display: none;
}
.settings h2 {
    margin: 20px 0;
    display: block;
}
.settings h3 {
    padding: 10px 0 5px 0;
}
.settings h4 {
    padding: 10px 0 0 0;
    margin-bottom: 5px !important; 
}
.settings p {
    margin: 0 !important;
}
.setting {
    margin: 15px 0;
}
.settings .organization-logo-container {
    display: none;
}
.settings .organization-logo {
    padding: 0 20px 0 0;
    height: 128px;
}
.settings.left-container .subscriber {
    position: relative;
    overflow: hidden;
}
.left-container.settings {
    padding: 54px 0 30px 20px;
}
.settings .status,
.settings .image-container-edit,
.settings .availability {
    margin-right: 20px;
}
.form-element {
    margin: 20px 0;
}
.setting .info {
    display: inline-block;
    margin-bottom: -11px;
}
[data-role=settings-selection] {
    width: 285px;
}
[data-role=settings-selection] select {
    width: 100% !important;
}
.setting .col-sm-4,
.setting .col-sm-8 {
    padding: 0 !important;
}
.settings-password {
    padding-bottom: 20px;
}
.settings-language {
    margin: 20px 0;
    max-width: 600px;
}
.form-container,
.form-footer {
    max-width: 600px;
}
.setting table {
    width: 100%;
}
.setting td:first-child {
    width: 360px;
}
.es_ES .setting td:first-child,
.fr_FR .setting td:first-child
{
    width: 365px;
    white-space: nowrap;
}
.user-preferences .setting td:first-child {
    width: auto;
}
.setting td {
    padding: 10px;
}
.right-container.settings {
    padding-right: 0px !important;
    padding-left:0px !important;
    padding-top: 54px;
    padding-bottom: 0px !important;
    z-index: 1;
}
.settings-container {
    padding-left: 30px;
    padding-right: 30px;
    position: relative;
    overflow: hidden;
}

.settings-container #settings-new-password{
    position: relative;
}
.edit-user-image {
    margin: 0 auto;
    width: 240px;
    height: 240px;
    position: relative;
    margin-bottom: 20px;
}
.edit-image {
    width: 30px;
    height: 30px;
    position: absolute;
    bottom: -15px;
    right: 105px;
    cursor: pointer;
}
#image-options-list {
    min-width: 178px;
    top: -74px;
    left: -67px;
    z-index: 1001;
    position: absolute;
    display:none;
    list-style-type: none;
    padding: 0;
    margin: 0;
}
#image-edit .modal-dialog {
    width: 530px;
    height:460px;
}
#image-options-list li {
    margin: 0 6px;
    text-align: left;
    padding: 10px 0 10px 35px;
    cursor: pointer;
    white-space: nowrap;
    width:auto;
}
#image-options-list li:first-child {
    cursor: pointer;
}

img.ui-draggable {
    cursor: move;
}
/* jQuery Resize And Crop (jrac) */
.jrac_viewport {
    position: relative;
    overflow: hidden;
    width: 528px;
    height: 400px;
}
.edit-image-container {
    width: 528px;
    height: 400px;
}
.jrac_loading {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.jrac_crop {
    position: absolute;
    overflow: hidden;
    cursor: move;
}
.no-move {
    cursor: default !important;
}
.jrac_crop_drag_handler {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
/* Zoom slider reskin*/
.jrac_zoom_slider {
    height: 28px;
    width: 296px;
    display: inline-block;
}
.jrac_zoom_slider_wrapper{
    margin: 12px auto;
    padding: 0px 12px;
    width: 320px;
    height: 28px;
    display: none;
}
.ui-slider-horizontal .ui-slider-handle {
    margin-left: -12px;
    top: 0px;
    width:24px;
    height: 28px;
}
.pane {
    position:relative;
}
#image-edit .modal-body {
    padding: 0;
}
#image-edit .modal-footer {
    margin-top: 0;
}
#image-edit .sw-button {
    min-width: 150px;
}
#image-edit .btn-cancel {
    float: left;
}
#image-edit .message-area {
    float: none;
    margin: 15px 0;
}
.no-profile-image input {
    font-size: 160px !important;
}
.left-container.settings .message-area-container {
    display: block;
    height: 20px;
    width: 100%;
    float: none;
}
.left-container .availability-form select {
    width: 109% !important;
    height: 34px;
}
.left-container .operational-status-form select {
    width: 109% !important;
    height: 34px;
}
.left-container .operational-status{
    display:none;
}
/* The user status */
div.settings div.status {
    position: relative;
}

div.settings div.status textarea {
    resize: none;
    padding-top: 5px;
    padding-bottom: 6px;
    padding-right: 24px;
    min-height: 30px;
    outline:none;
}

div.settings div.status div.emoji-wysiwyg-editor {
    width: 100%;
    min-height: 25px;
    padding-right: 25px;
}

div.settings div.status div.emoji-wysiwyg-editor img {
    margin-top: -6px;
}

div.settings div.status div.fake-input {
    padding: 5px 24px 6px 5px;
    word-wrap: break-word;
}

div.settings div.status div.fake-input .emoji-sizer {
    margin: 0 !important;
}
div.settings div.status div.show-emoticons {
    bottom: 0;
    cursor: pointer;
    float: none;
    height: 22px;
    margin: 1px;
    position: absolute;
    right: 0;
    width: 22px;
}

div.settings div.status div.submit {
    width:15px;
    height: 20px;
    cursor:pointer;
    position:absolute;
    bottom: 3px;
    right: 5px;
    display: none;
}

.setting .selectBox {
    width: 285px;
}
.setting .overSelect {
    position: absolute;
    left: 0;
    top: 0;
    width: 285px;
    height: 100%;
}
.setting .user-preferences-container {
    position: relative;
}
.setting .checkboxes-list {
    display: none;
    position: absolute;
    min-width: 190px;
}
.setting .checkboxes-list.bottom-list {
    bottom: 34px;
}
.setting .settings-checkbox-container {
    height: 30px;
    line-height: 30px;
    white-space: nowrap;
    margin: 0 5px;
    padding-left: 5px;
}

.setting.last-settings-related {
    margin-bottom: 200px;
    border-bottom: none;
}
#lokiSettings .wcf-ui-portal-row {
    padding-right: 8px;
}

/* --- /styles/index.css--- */ 

label {
    display: initial;
}
.left-container.contact,
.left-container.conversation {
    padding-left:0;
    padding-right:0
}
.contact .organization-logo,
.conversation .organization-logo {
    margin: 0 20px;
    width: auto;
}
#right-container,
.left-container {
    height: 100vh;
}
#right-container #loading,
.right-area-owner #loading,
.geolocation-chat-window #loading{
    position: absolute;
    top: calc(50% - 25px);
}
#right-container.conversation {
    padding: 54px 0 30px 0;
    position: relative;
    z-index: 2;
}
#left-content-container {
    position: relative;
    display: flex;
    flex-direction: column;
}
.index .conversations-title,
.index .contact-title {
    margin: 20px;
}
.index h1 {
    display: inline-block;
}
#subscriber.filter-type,
#group.filter-type,
#only_available.filter-type  {
    width: 32px;
    height: 32px;
    line-height: 32px;
    display: inline-block;
    float: right;
    cursor: pointer;
    margin: -4px 2px 0 2px;
    border-radius: 100%;
    text-align: center;
    font-size: 16px;
}
#group.filter-type {
    font-size: 23px;
}
#only_available.filter-type {
    font-size: 18px;
}
.search-reset-button {
    height: 30px;
    width: 30px;
    display: block;
    cursor: default;
    position: absolute;
    top: 0;
    right: 0;
}
.search-reset-button span {
    line-height: 30px;
    width: 30px;
}
.search-reset-button span.stw-search-general {
    display: block;
}
.search-reset-button span.stw-search-clear {
    cursor: pointer;
    display: none;
}

.search-reset-button.cancel span.stw-search-clear,
.search-reset-button.remove-search span.stw-search-clear,
.search-reset-button.active span.stw-search-clear {
    display: block !important;
}
.search-reset-button.cancel span.stw-search-general,
.search-reset-button.remove-search span.stw-search-general,
.search-reset-button.active span.stw-search-general {
    display: none !important;
}
.name-reset,
.search-reset-button.remove-search,
.search-reset-button.active {
    cursor: pointer;
}
.search-input {
    position: relative;
    padding-right: 35px;
}
.search-input-preloader {
    display: none;
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
}
.search-box {
    position: relative;
    margin: 0 20px
}
.multiselection {
    margin: 20px;
    padding-left: 28px;
    cursor: pointer;
    width: auto;
    display: inline-block;
}
.multi-select-all {
    margin: 20px;
    padding-left: 28px;
    cursor: pointer;
    width: auto;
    display: block;
}
.multi-select-all {
    padding-left: 28px;
    cursor: pointer;
    width: auto;
    margin: 0 0 10px 20px;
    display: none;
}
.conversations-controls .multiselection {
    display: inline-block;
    padding-left: 28px;
    margin-right: 6px;
}
.contact-user,
.contact-group {
    width: 100%;
    height: 62px;
    padding: 10px 20px;
}
.group-image {
    position: relative;
}
.group-image,
.index .user-image {
    width: 42px;
    height: 42px;
    float:left;
    margin-right: 10px;
    position: relative;
}
.user-availability-flag {
    display: none;
    position: absolute;
    width: 12px;
    height: 12px;
    top: 0px;
    right: 2px;
}
.group-image .user-availability-flag.available,
.contact-item.with-availability-flag .user-availability-flag {
    display: block !important;
}
.no-subscribers {
    position: absolute;
    bottom: 1px;
    left: 0;
    text-align: center;
    display: block;
    width: 100%;
}
.contact-user .name,
.contact-group .name{
    width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.no-image {
    position: relative;
    width: 40px;
    height: 40px;
    line-height: 40px;
}
.no-image.hovered {
    position: relative;
    width: 35px;
    height: 35px;
    line-height: 35px;
}

.no-image.external_video_source::before {
    position: relative;
    top: 6px;
    left: 2px;
}
.new-conversation,
.conversation-options-button,
.video-streaming
{
    width:31px;
    height:30px;
    float: right;
    margin-top: 6px;
    cursor: pointer;
}
.contact-options-button {
    width: 40px;
    height: 40px;
    /*float: right;*/
    cursor: pointer;
    margin-left: auto;
}
.app-not-installed {
    width: 17px;
    height: 20px;
    float: right;
    margin-top: 10px;
}
.recipient .app-not-installed {
    margin-top: 0;
}
.checkbox-container {
    margin: 11px 11px 11px 0;
}
.conversation-item,
.contact-item {
    cursor: pointer;
    position: relative;
}
.conversation-item .checkbox-container,
.contact-item .checkbox-container {
    display: none;
}
.conversation .title {
    height: 70px;
    line-height: 70px;
    padding: 0 20px;
}
#right-container .subscriber-details-icon,
#right-container .title .app-not-installed,
#right-container .conversation-options-button,
#right-container .new-conversation,
#right-container .video-streaming,
#right-container .contacts-manager-button
{
    width: 40px;
    height: 40px;
    margin-top:15px;
}
#right-container .subscriber-details-icon,
#right-container .contacts-manager-button {
    cursor: pointer;
    float: right;
    margin-left: 5px;
    line-height: 40px;
}
.info-title {
    display: block;
    margin-bottom: 10px; 
}
.subscriber-details {
    height: 100%;
    overflow: auto;
    width: 100%;
}
.subscriber-details .title {
    position: sticky;
    top: 0px;
}
.subscriber-details .details {
    padding: 30px;
}
.subscriber-details .details.popup {
    padding-top: 50px;
    margin-left: -5px;
    padding-bottom: 20px;
    
}
.subscriber-details .image {
    position: relative;
    float: left;
    width: 132px;
    height: 132px;
}
.subscriber-details .image-wrapper {
    position: relative;
    border-radius: 100px;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.subscriber-details .user-availability-flag {
    display: block;
    top: 8px;
    right: 9px;
    width: 20px;
    height: 20px;
}
.subscriber-details .image img {
    position: absolute;
    top: 0;
    left: 0;
}
.subscriber-details .image.external_video_source::before {
    position: relative;
    top: 12px;
    left: 20px;
}
.image img {
    width: 132px;
}
.subscriber-details .no-image {
    width: 100%;
    height: 100%;
    line-height: 100%;
}
.info-subscriber {
    margin-left: 20px;
    float: left;
    width: calc(100% - 170px);
}
.info-row {
    padding: 10px 0;
}
.info-row .email,
.info-row .position {
    float: left;
    width: 40%;
}
.call-user-details .modal-dialog {
    width: 700px;
}

.info-row .position {
    padding-left: 20px;
}
.groups-list {
    padding: 0px 30px 30px 30px;
}
.subscriber-details .wt-supervisor {
    padding: 30px;
}
.modal-dialog .subscriber-details .groups-list {
    padding: 0;
}
.subscribers-list .name {
    flex-grow: 1;
}
.subscribers-list .position {
    line-height: 42px;
    width: 349px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex-shrink: 0;
}
.subscribers-list .app-not-installed {
    margin-right: 5px;
}
.group-info {
    float: left;
    min-width: 75px;
    height: 30px;
    line-height: 30px;
    margin-right: 15px;
    cursor: pointer;
    margin-bottom: 15px;
    max-width: 250px;
}
.group-label {
    padding-left: 38px;
    padding-right: 7px;
    width:100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.group-details .no-subscribers {
    line-height: 1.4;
}
.group-details .group-image {
    margin-top: 14px;
}
.group-details .contact-group .group-image {
    margin: 0px;
}
.details-group-name {
    width: 690px;
    height: 70px;
    float: left;
    display: flex;
    flex-direction: column;
}

.details-group-name span.name {
    line-height: 50px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.details-group-name span.count {
    line-height: 15px;
    font-size: 15px;
}


.edit-conversation .edit-title,
.create-title {
    padding: 30px;
}
#switch-conversation-type {
   width: 100px;
    height: 40px;
    float: left;
    margin-right: 15px;
    cursor: pointer;
}
.conversation-edit-controls {
    height: 70px;
    position: absolute;
    width: 100%;
    bottom: 0;
    display: none;
}
.conversation-edit-controls .create-conversation-info {
    height: 100%;
    width: calc(100% - 320px);
    position: absolute;
    left: 0px;
}
.conversation-edit-controls .button-container {
    height: 70px;
    padding: 15px;
    width: 320px;
    position: absolute;
    right: 0px;
    white-space: nowrap;
    text-align: right;
}
.conversation-edit-controls .button-container button {
    width: auto;
    max-width: 140px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 2px;
}
.conversation-edit-controls .button-container button:last-child {
    margin-left: 10px;
}
.selected-subscribers {
    margin: 12px;
    position: relative;
    overflow:hidden;
}
.right-container .contact-info {
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 60%;
    height: 10%;
    text-align: center;
}
.new-conversation.subscriber-icon {
    margin: 0 !important;
}

/* conversation page */
.conversations-title h1 {
    vertical-align: top
}
.conversations-title .info {
    display: inline-block;
}
.conversations-title .tooltip-inner {
    width: 300px;
    max-width: 300px;
    text-align: left;
}
.conversations-controls {
    position: relative;
}
.conversations-controls .search-box {
    height: 35px;
    width: 305px;
    float: left;
    margin: 0px 15px 0px 20px;
}
.conversations-controls .conversations-trash {
    height: 28px;
    cursor: pointer;
    display: inline-block;
    padding-left: 27px;
    float: right;
    margin: 20px 25px 0 20px;
}
.conversations-controls .progress-bar-container {
    position: absolute;
    left: 21px;
    top: 35px;
    height: 2px;
    width: 309px;
    display: none;
}
.conversation-item {
    width: 100%;
    height: 80px;
    padding: 19px 20px;
}
.conversation-item .user-image {
    position: relative;
}
.conversation-item .name {
    float: left;
}
.create-conversation .conversation-item .name {
    width: calc(100% - 120px);
}
.last-message {
    max-width: 210px;
    height: 24px;
    line-height: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.multi-select-on .last-message {
    max-width: 180px;
}
.conversation-item .group .names {
    padding-left: 0px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.conversation-item .group.process .names {
    padding-left: 0px;
}
.conversation-item .group.process .names span.process-icon {   
    width: 23px;
    height: 23px;
    display: inline-block;
    vertical-align: middle;
}
.left-container .conversation-item {
    position: relative;
}
.left-container .names,
.contact-item .name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 200px;
    /*position: absolute;*/
    /*left: 75px;*/
    margin-left: 5px;
}
.left-container .names {
    top: 22px;
}
.contact-item .name {
    display: flex;
}
.contact-user .stw-lightning.high-speed-tracking {
    display: none;
    color: #39B54A;
}
.contact-user.high-speed-tracking-enabled .stw-lightning.high-speed-tracking {
    display: block;
}
.contact-user.with-availability-flag.offline .stw-lightning.high-speed-tracking {
    color: #888888;
}
.left-container .contact-item .name {
    /*top: 13px;*/
}

.with-no-app-installed.contact-item .name {
    width: 190px;
}
.contact-item.multi-select-on .name.with-status {
    /*top: 13px !important;*/
}
.left-container .contact-item .name.with-status {
    /*top: 4px;*/
}
.left-container .contact-item .user-operational-status-container {
    position: relative;
    left: 5px;
    cursor: default;
    display: block;
}
.left-container .contact-item {
    display:flex;
    align-items: center;
}
.left-container .contact-item .user-custom-status-container {
    /*top: 33px;*/
    position: relative;
    left: 5px;
    cursor: default;
    display: block;
}
.left-container .contact-item .user-operational-status-container + .left-container .contact-item .user-custom-status-container {
    top: 150px;
}
.left-container .contact-item .user-custom-status-container span.emoji-sizer {
    margin: 0 !important;
}
.left-container .contact-item .user-custom-status-container span.emoji-sizer {
    margin: 0 !important;
}
.left-container .contact-item .user-custom-status {
    max-width: 200px;
    width: auto;
    padding-right: 5px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    cursor: default;
    /*height: 30px;*/
}
.left-container .multi-select-on .user-custom-status-container {
    display: none;
}
.left-container .contact-item .user-custom-status-container .tooltip{
    display: block;
    top: 0px !important;
    left: 0px !important;
    width: 250px;
}
.left-container .contact-item .user-custom-status-container .tooltip-arrow {
    display: none !important;
}
.left-container .contact-item .user-custom-status-container .tooltip-inner {
    width: auto;
    max-width: 300px;
}
.left-container .last-message {
    position: absolute;
    top: 40px;
    left: 75px;
}
.conversation-date {
    float: none;
    position: absolute;
    top: 10px;
    right: 20px;
}
.attachment-placeholder {
    width: 45px;
    height: 31px;
    position: absolute;
    right: 17px;
    bottom: 18px;
    display: none;
    overflow: hidden;
    text-align: center;
}
.attachment-placeholder img {
    width: 45px;
    height: auto;
    margin-top:-7px;
}
.attachment-placeholder.location img,
.attachment-placeholder.locations img{
    width: 100%;
    height: 115%;
    display: block;
}
.attachment-placeholder.video:after,
.attachment-placeholder.location:after {
    position: absolute;
    content: "";
    top: 0;
    width: 45px;
    height: 31px;
    display: block;
}
.ui-draggable-dragging {
    z-index: 4;
}
.multi-select-on .name,
.multi-select-on .names,
.multi-select-on .last-message
{
    left: 105px !important;
}
.existing-conversations {
    position:relative;
    overflow: hidden;
}
.existing-conversations .names,
.right-container .last-message,
.subscriber-details .title-text {
    white-space: nowrap;
    max-width: 510px;
    min-height: 24px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.subscriber-details .title-text {
    position: absolute;
}

.subscriber-details .details.popup{    
    margin-left: -35px;
}
.modal-dialog .subscriber-details .details.popup {
    margin-left: 0px;
    padding: 50px 0 20px 0;
}
.modal-dialog .subscriber-details .info-row .email{
    width: 65%;
    overflow: hidden;
    text-overflow: ellipsis;
}
.modal-dialog .subscriber-details .info-row .position{
    width: 35%;
}
.subscriber-details .title-text.popup{
    position: absolute;
    font-size: 20px;
}

.subscriber-details .popup .info-row .position {
    float: right;
}

.conversations-container .names {
    width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.conversations-container .extra-scroll {
    height: 30px;
}
.names .recipients {
    position: absolute;
    top: 45px;
    left: 72px;
    max-width: 550px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.names .recipients.shorter-names {
    max-width: 692px;
}
.group .names .recipients.shorter-names {
    max-width: 620px;
}
.right-container .conversation-item .group .names {
    padding-left: 0px;
}
.create-new-conversation {
    cursor: pointer;
}
.conversation-controls .new-conversation {
    margin-left: 0px;
    margin-top: 0px !important;
    float: left;
}
.conversation-controls {
    height:26px; 
    position: absolute;
    right: 17px;
    top: 5px;
}
.chat-window-header {
    position: relative;
    height: 80px;
    width: 100%;
    display: flex;
    margin-top: 3px;
}
.chat-window-header .conversation-item {
    display: flex;
    width: 100%;
    height: 100%;
    position: relative;
    padding: 0;
    padding-left: 60px;
    padding-right: 10px;
    margin: 0;
}
.chat-window-header .conversation-item .user-image {
    float: none;
    margin: 0;
    display: inline-block;
    height: 40px;
    width: 40px;
    position: absolute;
    left: 10px;
    top: 20px;
;
}
.chat-window-header .conversation-item .user-image .group-image {
    float: none;
    margin: 0;
}
.chat-window-header .conversation-item .name {
    float: none;
    display: inline-block;
    height: 100%;
    width: auto;
    flex-grow: 1;
}
.chat-window-header .conversation-item .names {
    padding: 0;
    overflow: hidden;
    width: 100%;
    height: 100%;
    white-space: normal;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.chat-window-header .names .editable {
    float: none;
    position: relative;
}
.chat-window-header .names .editable .edit-group {
    position: absolute;
    right: 0;
    top: 6px;
}
.chat-window-header .user-availability-flag {
    display: block;
    right: 0;
}
.chat-window-header .names span {
    float: none;
    display: block;
    width: calc(100% - 15px);
    overflow: hidden;
    white-space: normal;
    word-break: break-all;
    max-height: 40px;
}
.chat-window-header .recipients {
    position: relative;
    top: auto;
    left: 2px;
    min-height: 20px;
    white-space: normal;
    word-break: break-all;
    overflow-y: auto;
    overflow-x: hidden;
    display: block;
    line-height: 14px;
    margin-bottom: 10px;
}
.chat-window-header .conversation-controls {
    width: auto;
    height: 40px;
    display: inline-flex;
    position: relative;
    top:auto;
    right: auto;
}
.chat-window-header .edit-group-name {
    height: 57px;
    width: calc(100% - 15px);
    position: relative;
    display: none;
    margin-right: 15px;
}
.chat-window-header.broadcast-call .conversation-options-button,
.chat-window-header.broadcast-call .streaming-options-button,
.chat-window-header.broadcast-call .track-users-location,
.chat-window-header.broadcast-call .leave-group-conversation,
.chat-window-header.broadcast-call .close-group-conversation,
.chat-window-header.broadcast-call .edit-group-conversation,
.chat-window-header.broadcast-call [data-role="view-group-conversation"] {
    display: none !important;
}
.chat-window-header.outcall [data-role="recipient-name"] {
    display: inline-block;
    margin-top: 7px;
}
.chat-window-send-messages .loading-bar {
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 2;
    left: 0px;
    top: 0px;
}
.chat-window-send-messages.connection-check-in-progress .loading-bar {
    display: block;
}
.chat-window-send-messages .alert-stop-button {
    cursor: pointer;
    padding: 8px 0;
    height: 40px;
    width: 100%;
    display: none;
}
.show-emoticons {
    width: 22px;
    height: 22px;
    font-size: 22px;
    line-height: 22px;
    margin: 18px 10px 0 10px;
}
.chat-window-send-actions {
    position: relative;
    z-index: 1001;
}
.message-input-buttons {
    flex-shrink: 0;
    position: relative;
    margin-left: 10px;
}
.message-input-textarea {
    position: relative;
    margin-top: 10px;
    margin-bottom: 10px;
    flex-grow: 1;
}

.message-input-textarea textarea {
    position: relative;
    width: calc(100% - 20px) !important;
    margin-left: 10px;
    margin-top: 5px;
    min-height: 26px !important;
    height: 26px;
    resize: none !important;
    outline: none;
    line-height: 22px;
    border: 0;
    white-space: pre-wrap;
    max-height: 20vh;
}

/*Audio Clip related*/
.audio-player {
    text-align: center;
    display: flex;
    flex-flow: row;
}

.player-controls {
    flex: 3;
    margin-right: 15px;
}
.message-audioclip-control {
    cursor: pointer;
}
.audioclip-overlay,
.audioclip-overlay .recording-time-container {
    display: none;
    position: absolute;
    z-index: 2;
    width: 100%;
    height: 100%;
    height: 36px;
    line-height: 36px;
}
.audioclip-overlay .recording-time-container {
    display: flex;
    justify-content: center;
}
.audioclip-overlay .trash-button {
    position: absolute;
    font-size: 24px;
    height: 21px;
    width: 20px;
    border-radius: 11px;
    left: -33px;
    top: 8px;
    line-height: 23px;
}
.emoji-menu {
    width: 215px !important;
    top: auto !important;
    bottom: 110px !important;
    opacity: 1 !important;
}
.emoji-menu a {
    margin: 6px 3px 8px 13px !important;
    padding: 0px !important;
}
.emoji-corner {
    width: 21px;
    height: 8px;
    position: absolute;
    bottom: -8px;
    right: 50%;
    margin-right: -10px;
    box-shadow: none !important;
}
.text-message-area {
    width: 100%;
    margin: 0 auto;
    position: relative;
    min-height: 40px;
    display: flex;
}
.message-utilities {
    position: relative;
    height: 25px;
    line-height: 25px;
    display: flex;
    margin-bottom: 10px;
    margin-left: 10px;
}
.message-utilities.no-buttons-texts {
    justify-content: center;
    margin-left: 0px;
}
.message-utilities.no-buttons-texts .utility-button .text {
    display: none;
}
.message-utilities .utility-button {
    display: flex;
    position: relative;
    margin-right: 10px;
}
.message-utilities .utility-button:not(:first-child) {
    padding-left: 10px
}
.message-utilities.no-buttons-texts .utility-button:not(:first-child) {
    padding-left: 15px;
}
.message-utilities .utility-button .icon {
    margin-right: 5px;
    font-size: 20px;
}
.message-utilities #message-ack-control .ack-text {
    position: absolute;
    left: 11px;
}
.message-utilities.no-buttons-texts #message-ack-control .ack-text {
    top: -2px;
    left: 16px;
}
.message-utilities #message-ack-control .tick {
    display: none;
    position: absolute;
    left: 22px;
    top: 6px;
}
.message-utilities.no-buttons-texts #message-ack-control .tick {
    left: 29px;
    top: 9px;
}
.message-utilities #message-ack-control.active .tick {
    display: block;
}
.message-utilities #fileuploader {
    position: absolute !important;
    z-index: 2;
    opacity: 0;
    width: 100%;
}
.message-utilities #fileuploader > input[type="file"] {
    position: relative !important;
    height: 25px;
}
.message-utilities.no-buttons-texts #fileuploader {
    width: 30px;
}
.attachment-clickable {
    width: 23px !important;
}
.attachment-clickable .qq-uploader {
    width: 23px;
    padding: 0 !important 
}
.attachment-clickable .qq-upload-button {
    position: relative;
    top: -30px;
    width: 23px;
    overflow: hidden;
    padding: 0;
}
.message-utilities .send-location span, .message-utilities .message-ack-control span {
    white-space: nowrap;
    cursor: pointer;
    display: block;
    padding-left: 22px;
}
.message-utilities .message-ack-control span {
    padding-left: 4px;
}
.chat-messages {
    padding-bottom: 20px;
    overflow:hidden;
}
.chat-messages .message {
    margin: 10px 0;
    position: relative;
}
.chat-messages .message-checkbox-container {
    display: none;
    width: 20px;
    height: 100%;
    position: absolute;
    left: 10px;
    top:0px;
}
.chat-messages .message.with-multiple-selection {
    padding-left: 30px;
}
.message.with-multiple-selection .message-checkbox-container {
    display: block !important;
}
.message.preview .message-checkbox-container {
    display: none;
}
.message.preview .message-status div:not(.time) {
    display: none !important;
}
.message-checkbox-container label {
    position: absolute;
    top: calc(50% - 12px);
}
.message-container {
    width: calc(100% - 40px);
    padding: 10px;
    margin: 10px 20px 0 20px;
    position: relative;
    word-wrap: break-word;
    text-align: left;
}
.message-container.no-body {
    display: none;
}
.message-container:after {
    content: '';
    position: absolute;
    display: block;
    width: 0;
    bottom: 0;
}
.message-container span:not(.emoji):not(.vc-start-date):not(.vc-end-date) {
    min-height: 20px;
    width: 100%;
    height: auto;
    overflow: auto;
    white-space: pre-wrap;
}
.message-container.with-caption span:not(.emoji) {
    display: inline-block;
    margin-top: 10px;
    text-align: left;
}
.message-ambient-listening-on,
.message-ambient-listening-off,
.message-alert-mode-on,
.message-alert-mode-off {
    margin: 10px auto !important;
}
.message-ambient-listening-on .message-container,
.message-ambient-listening-off .message-container,
.message-alert-mode-on .message-container, 
.message-alert-mode-off .message-container {
    height: 35px;
    line-height: 35px;
    padding: 0;
}
.message-ambient-listening-on .time,
.message-ambient-listening-off .time,
.message-alert-mode-on .time,
.message-alert-mode-off .time {
    display: inline-block;
    margin-left: 20px;
    width: 60px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.message-ambient-listening-off .recipient-alert,
.message-ambient-listening-on .recipient-alert,
.message-alert-mode-off .recipient-alert,
.message-alert-mode-on .recipient-alert {
    display: inline-block;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    margin-right: 20px;
    width: 293px;
}
.message-sent .message-container:after {
    right: -10px;
}
.message-received .message-container:after {
    left: -10px;
}
.message-sent .message-container span {
    text-align: right;
}
.message-received .message-container span {
    text-align: left;
}
.message-sent .message-status {
    float: right;
    margin-right: 20px;
    margin-top: 5px;
}
.message-received .message-status {
    margin-left: 15px;
    margin-top: 7px;
}
.recipient .message-status {
    margin-right: 6px;
}
.message-status .pending,
.message-status .isc-success-counter,
.message-status .isc-success.success,
.message-status .isc-failure-counter,
.message-status .isc-failure.failure,
.message-status .status {
    display: none;
}

.message-status .pending,
.message-status .failure,
.message-status .success{
    width: 13px;
    height: 13px;
    margin-right: 2px;
}
.isc-failure-counter,
.isc-success-counter {
    width: auto;
    height: 13px;
    margin-right: 2px;
}
.message-status .status {
    margin-left: -3px;
}
.message-status .time  {
    display: inline-block;
}
.message-status td {
    padding: 0px;
    line-height: 13px;
    height: 13px;
}
.message-status label {
    display: block;
    margin-right: 10px;
}
.message-aggregate {
    position: relative;
    width: 350px;
    height: 34px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    margin-bottom: 20px;
}
.message-aggregate .call-icon {
    width: 34px;
    height: 34px;
    line-height: 34px;
    margin-left: 10px;
    text-align: center;
}
.message-aggregate .counter {
    position: absolute;
    height: 28px;
    min-width: 28px;
    width: auto;
    line-height: 28px;
    right: 22px;
    top: 3px;
}
.message-aggregate .call-type {
    height: 34px;
    line-height: 34px;
    width: calc(100% - 100px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.message-aggregate .date {
    width: 100%;
    display: block;
    position: absolute;
    bottom: -18px;
}
.conversation-controls .go-to-process,
.conversation-controls .details-group-conversation,
.conversation-controls .conversation-options-button,
.conversation-controls .streaming-options-button,
.conversation-controls .new-conversation,
.conversation-controls .user-icon,
.conversation-controls .screen-share,
.conversation-controls .camera-share,
.contact-process-list,
.track-users-location,
.open-attachment-manager,
.export-conversation,
.mute-conversation,
.leave-group-conversation,
.available-recipients-details,
.group-conv-info,
.edit-group-conversation,
.video-features {
    width: 40px;
    height: 40px;
    float: left;
    cursor: pointer;
    position: relative;
    text-align: center;
}
.conversation-controls .available-recipients-details span,
.conversation-controls .details-group-conversation span {
    width: 100%;
    height: 100%;
    display: block;
}
.conversation-controls .go-to-process {
    width: 30px;
    height: 30px;
    margin-top: 5px;
}
.conversation-controls .streaming-options-button {
    margin-right: 5px;
}
.conversation-controls .conversation-options-button {
   margin-top: 0 !important; 
}
.conversation-controls .conversation-options-button.feature-walkie-talkie,
.conversation-controls .conversation-options-button.feature-conference-call {
    display: flex;
    width: auto;
    min-width: 40px;
    justify-content: center;
}
.conversation-controls .conversation-options-button.feature-walkie-talkie.with-join-button,
.conversation-controls .conversation-options-button.feature-conference-call.with-join-button {
    display: flex !important;
}
.conversation-controls .conversation-options-button.feature-walkie-talkie .join-button-container,
.conversation-controls .conversation-options-button.feature-conference-call .join-button-container {
    display: none;
    margin-right: 10px;
    margin-top: 6px;
}
.conversation-controls .conversation-options-button.feature-walkie-talkie.with-join-button .join-button-container,
.conversation-controls .conversation-options-button.feature-conference-call.with-join-button .join-button-container {
    display: block;
}
.conversation-controls .conversation-options-button.feature-walkie-talkie.with-join-button .place-call-block,
.conversation-controls .conversation-options-button.feature-conference-call.with-join-button .place-call-block {
    display: none;
}
.export-conversation.disabled,
.open-attachment-manager.disabled,
.track-users-location.disabled,
.leave-group-conversation.disabled-control,
.edit-group-conversation.disabled-control {
    cursor: default;
}
.right-container .name.broadcast {
    width: calc(100% - 250px);
}
.right-container .chat-window-send-messages #send-message, .geolocation-chat-window .chat-window-send-messages #send-message {
    font-size: 32px !important;
}
.sliding-layer-content .chat-window-send-messages .message-utilities .message-ack .tick {
    right: -6px;
    top: 7px;
}
.sliding-layer-content .chat-window-send-messages #send-message {
    font-size: 20px !important;
}
.sent-details {
    width: 25px;
    height: 20px;
    cursor: pointer;
}
.message-received {
    position: relative;
}
.message-received .user-image {
    position: absolute;
    bottom: 20px;
    left: 13px;
}
.message-received .user-image.hovered {
    border: 2px solid var(--COLOR_01);
    border-radius: 50%;
    cursor: pointer;
}
.message-received .user-image.hovered img {
    width: 36px;
    height: 36px;
    line-height: 36px;
    border: 0px;
}
.message.with-multiple-selection.message-received .user-image {
    left: 43px;
}
.message-received .multiple.message-container {
    width: calc(100% - 90px);
    float: right;
}
.message-container.with-attachment.locations,
.message-container.with-attachment.location,
.message-container.with-attachment.image,
.message-container.with-attachment.video {
    padding: 0;
    width: auto;
}
.message-container.with-attachment.locations .attachment,
.message-container.with-attachment.location .attachment {
    width: auto;
    height: 137px;
}
.message-container.with-attachment.image .attachment,
.message-container.with-attachment.video .attachment {
    height: auto;
    width: auto;
    min-width: 50px;
    max-width: 350px;
}
.message-container.with-attachment:not(.image):not(.video):not(.location):not(.locations):not(.audio) {
    width: auto;
}
.message-received .message-container.with-attachment {
    float: left;
}
.message-received .multiple.message-container.with-attachment {
    margin-left: 70px;
}
.message-sent .message-container.with-attachment {
    float: right;
}
.message-received .message-container.with-caption,
.message-sent .message-container.with-caption {
    padding: 10px;
    max-width: 55%;
}
.editable {
    float: left;
    padding: 3px;
    cursor: pointer;
}
.editable .edit-group {
    width: 15px;
    height: 13px;
    display: none;
    float: left;
    margin: 2px 0 0 3px;
}
.editable span {
    float: left;
    margin-top: 0;
    display: block
}
.edit-group-name {
  height: 57px;
  width: 550px;
  display: none;
}
.process .editable .edit-group-name {
    display: none !important;
}
.process .editable {
    cursor: default;
}
.edit-group-name.modal-header {
    float: left;
    padding-bottom: 15px;
}
.edit-group-name input {
    width: calc(100% - 118px);
    float: left;
}
.edit-group-name .close {
    margin-top: 6px;
}
.edit-conversation .close {
    margin-top: 0px;
    padding-top: 8px;
}
.edit-group-name button {
    height: 30px;
    margin-left: 10px;
}
.message-received .user-name {
    margin-left: 75px;
}
.edit-conversation .button-container {
    display: block
}
.edit-conversation .edit-users-info {
    display: block;
    margin: 10px 30px 0;
}
.add-group .edit-group-name.modal-header {
    width: calc(100% - 53px);
}
.add-group .edit-group-name input {
    width: calc(100% - 173px);
}
.group-name button,
.edit-group-name button {
    width: 74px;
    height: 30px;
}
.group-name button {
    margin-top: 3px;
}
.edit-group-name button {
    margin-top: -2px;
}
.add-group.chat-messages {
    position: relative;
}
.add-group .edit-group-name {
    display: block;
}
.quit-info {
    height: auto;
    display: block;
    padding: 0 10px;
    margin: 0 auto;
    right: 0;
    bottom: 0;
    /*width: 50%;*/
    text-align: center;
}
.message.inform hr {
    padding: 0;
    margin: 0;
}
.message.inform {
    position: relative;
    height: auto;
    margin-top: 20px;
    margin-right: 20px;
    margin-left: 15px;
}

.existing.create-conversation .new-conversation {
    margin-top: 0px !important;
}
.details-list,
.sent-list {
    max-height: 400px !important;
    padding-bottom: 7px;
}
.sent-list p {
    text-align: center;
    line-height: 160px
}
.date-details,
.sent-list .recipient {
    padding: 10px 10px 10px 20px;
    height: 37px;
}
.sent-list .recipient .name {
    float: left;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 200px;  
}
.sent-list .recipient .message-status {
    float: right;
}
.sent-message-details .modal-body {
    padding: 0;
}
.sent-message-details .large-group-conv {
    padding: 10px;
    padding-top: 0;
}
.qq-upload-button input {
    position: absolute;
    left: 0 !important;
    top: 0 !important;
    width: 100%;
    height: 100%;
    z-index: 2;
}
.messages-load-status,
.messages-load-status .progress-bar {
    height: 2px;
    width: 100%;
    position: absolute;
    bottom: 0px;
    left: 0px;
}
.messages-load-status .progress-bar {
    height: 2px;
    width: 0%;
}
.messages-load-status:hover,
.messages-load-status:hover .progress-bar {
    height: 4px !important;
}
.messcontainer {
    /*overflow: hidden;*/
    width: 100%;
    position: relative;
}
.messcontainer .availability-info {
    display: none;
    position: absolute;
    top: -6px;
    left: 0px;
    z-index: 3;
    height: 40px;
    width: 100%;
}
.messcontainer .availability-info .info-icon {
    display: none;
    position: absolute;
    top: 11px;
    right: 35px;
}
.messcontainer.with-availability-info .availability-info {
    display: block;
}
.messcontainer .availability-info .info-text {
    display: block;
    width: 100%;
    height: auto;
    padding-top: 5px;
    padding-bottom: 5px;
}
#attachment-drop-zone {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 500;
    padding-top: inherit;
    display: none;
}
#drop-zone-inner {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 15px;
    /* substract margin */
    width: calc(100% - 30px);
    height: calc(100% - 30px);
}
.chat-messages{
    overflow-y: auto !important;
    width: 100%;
}
.chat-messages .ps-scrollbar-y-rail {
    right: 5px !important;
}
.controllers-space {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 4;
    display: none;
}
.date-input {
    width: auto !important;
    min-width: 100px !important;
    padding-right: 30px;
}
.download-as-csv,
.download-as-pdf {
    width: 20px;
    height: 20px;
}
.tooltip {
    z-index: 1060;
}
.popover {
    position: fixed;
    max-width: 400px;
}
.popover-title {
    display: none;
}
.date-sticker {
    position: absolute;
    z-index: 1000;
    width: 100%;
    top: 10px;
    text-align: center;
    pointer-events:none;
}
.date-sticker .day-block-title {
    display: inline-block;
    padding: 6px 20px;
}
.day-block .day-block-title {
    text-align: center;
    height: 30px;
    line-height: 26px;
    margin-left: 15px;
    position: relative !important;
}
.day-block.empty {
    display: none;
}
.max-upload-info {
    line-height: 12px;
    padding-left: 23px;
}
#date-time-interval-picker .message-area {
    margin: 10px 0;
    position: absolute;
}
#date-time-interval-picker .modal-footer {
    border-top: none !important;
    padding: 0 !important;
    margin-top: 50px;
}
#date-time-interval-picker .modal-footer .buttons {
    display: flex;
    gap: 0.25rem;
}
.conversation-details-modal .conversation-details-participants .details-group-name {
    width: auto;
    height: auto;
    float: none;
}
.conversation-details-modal .conversation-details-participants .details-group-name span {
    height: 18px;
    width: 18px;
    display: inline-block;
    vertical-align: middle;
}
.recipients-availability-details-modal .modal-dialog,
.conversation-details-modal .modal-dialog {
    width: 700px;
}
.modal-dialog .conversation-details {
    width: 600px;
}
.modal-dialog.conversation-details-modal .group-details .title .group-image {
    margin-top: 0;
}
.conversation-details-content {
    margin-left: 15px;
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    padding-top: 10px;
}
.conversation-details-content .conversation-contacts {
    display: flex;
}
.conversation-details-content .conversation-contacts .user-image,
.conversation-details-content .conversation-contacts .user-info {
    float: none;
}
.conversation-details-content .conversation-contacts .user-info {
    margin: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 200px;
}
.conversation-details-modal .conversation-details-content {
    min-height: 200px;
    max-height: 500px;
    margin-left: 36px;
}
.conversation-details-participants .title {
    min-height: 70px;
    height: auto;
}
.recipients-availability-details-modal .conversation-details-participants .title {
    min-height: 55px;
}
.conversation-details .participants-status {
    line-height: 30px;
}
.bootstrap-datetimepicker-widget::after {
    width: 12px;
    right: calc(50% - 6px) !important;
    left :auto !important;
}
.bootstrap-datetimepicker-widget::before {
    border: none !important;
}
.load-more-button {
    position: absolute;
    display: none;
    bottom: 0px;
    width: 100%;
    height: 40px;
    text-align: center;
}
.load-more-button span {
    position: relative;
    display: inline-block;
    width: auto;
    height: 30px;
    line-height: 30px;
    margin: 5px;
    border-radius: 20px;
    text-align: center;
    padding-left: 10px;
    padding-right: 10px;
}
.load-more-button:after {
    display: none;
    position: absolute;
    top: 0px;
    width: 100%;
    height: 40px;
    line-height: 40px;
    content: "";
}
.load-more-button.active:after {
    display: block;
}
.mandatory {
    position: relative;
    display: inline-block;
    width: auto;
    padding-right: 10px;
}
.mandatory:after {
    content: "*";
    width: 10px;
    height: 10px;
    display: inline-block;
}
/** Hide the call buttons when there is a clip recording started */
.clip-recording-on .call-out-button,
.clip-recording-on .option-row.popup-walkie-talkie,
.clip-recording-on .option-row.popup-call,
.clip-recording-on .option-row.popup-out-call,
.clip-recording-on .option-row.popup-video-call,
.clip-recording-on .conversation-options-button,
.clip-recording-on .walkie-talkie-conversation
{
    display: none !important;
}
.skin-only {
    display: none;
}
.message-status .success-status-container{
    position: relative;
    display: table-cell;
}
.message-status .success-status-sent{
    position: relative;
    vertical-align: middle;
    font-size: 14px;
}
.message-status .success-status-received{
    position: relative;
    vertical-align: middle;
    font-size: 18px;
}
/* former class from bootstrapjs */
.hidden {
    display: none !important;
}
/** LATE CALL ENTRY FEATURE (GLOBAL SETTINGS) */
.join-button {
    display: flex;
    position: relative;
    height: 25px;
    line-height: 25px;
    white-space: nowrap;
    padding-left: 10px;
    padding-right: 8px;
}
.join-button .join-icon {
    display: inline-block;
    margin-left: 5px;
    line-height: 25px !important;
}
.message-filter-reason {
    position: relative;
    display: table-cell;
    width: auto;
    padding-right: 10px;
}
.conversation-contacts .contact-options-button {
    top: -50px;
    right: 10px;
    position: relative;
}

.highlight-element {
    display: inline-block;
}
.emoji {
    display: inline-block !important;
    width: 22px !important;
    height: 22px !important;
    background-size: 21px !important;
    background-position: center !important;
}

.index .contacts-controls .selection-controls {
    display: flex;
    height: 62px;
    line-height: 62px;
}


.index .contacts-controls .selection-controls .multiselection{
    flex-grow: 1;
}

.index .contacts-controls .selection-controls .transfer-call {
    border: 1px solid;
    margin-right: 17px;
    border-radius: 20px;
    height: 28px;
    line-height: 19px;
    margin-top: 20px;
    padding-right: 12px;
    padding-bottom: 10px;
    padding-top: 4px;
    font-weight: bold;
    cursor: pointer;
}

.index .contacts-controls .selection-controls .transfer-call-icon {
    width: 25px;
    height: 18px;
    float: left;
    margin-left: 10px;
}
body.skin-details {
    overflow-x: hidden;
}
.skin-colors-colors-container {
    width: 100vw;
    height: auto;
    display: flex;
    flex-wrap: wrap;
}
.skin-colors-colors-container .color-square {
    width: 150px;
    height: 60px;
    margin: 10px;
}
.skin-colors-colors-container .color-square .square {
    width: 100%;
    height: calc(100% - 15px);
}
.contacts-manager-info p {
    text-align: left !important;
}
.contacts-manager-info ul {
    text-align: left;
    list-style: none;
    padding-left: 15px;
}

/*
 * NOTE: This settings are correlated with the webchat-ui which is publishing these variables.
*/
::-webkit-scrollbar {
    width: 10px !important;
}
::-webkit-scrollbar-track {
    background: var(--COLOR_11);
    cursor: pointer;
}
::-webkit-scrollbar-track:hover {
    background: var(--COLOR_10);
}
::-webkit-scrollbar-thumb {
    background: var(--COLOR_08);
    border-radius: 10px;
    cursor: pointer;
}


/* --- /styles/login.css--- */ 

.forgot-password-button label {
    margin: 0px;
    width: auto;
    white-space: nowrap;
}
.form-forgot-pass label {
    width: 145px;
}
.iti.pretty .iti__flag-container .iti__selected-flag {
    width: 37px !important;
    height: 98%;
}
.forgot-password .message-area {
    margin: 2px 0;
    text-align: left;
}
.login .iti {
    display: block !important;
    width: 100%;
}
.iti input[type="text"] {
    padding-left: 40px !important;
}
.remember-me.login span {
    margin-left: 4px;
}
.login .row {
    margin: 15px 0;
}
.body-area input {
    width: 270px !important;
    display: inline-block;
    margin-top:3px;
}
.insert-password table {
    width: 100%;
    text-align: left;
}
.insert-password input {
    min-width: 150px !important;
    width: 97% !important;
}

input#form-recover-code {
    width: 150px !important;
    min-width: 150px !important;
}
.form-forgot-pass .form-element {
    margin: 10px 0;
}
#submit-login.loading {
    text-indent: -99999px;
}
.secret-code .message-area {
    text-align: left;
    margin-left: 10px;
}
#forgot-confirm-password {
    min-width: 100px;
}
.forgot-password .form-element.info {
    padding-left: 25px;
    background-position: -6px -5px;
    margin-top: 30px;
    width: 100%;
    height: auto;
}
.forgot-password .modal-body {
    padding: 20px !important;
}
.form-forgot-pass td span {
    margin-top: 10px;
    margin-bottom: 5px;
    display: block;
}
.form-forgot-pass .right {
    text-align: right;
}
.form-forgot-pass table {
    margin-left: -3px;
    margin-bottom: 6px;
}
.form-forgot-pass .iti {
    margin-top: 5px;
}
.forgot-password .modal-dialog {
    width: 440px;
}
.form-forgot-pass table,
.form-forgot-pass input {
    width: 420px !important;
}
.form-forgot-pass .error {
    text-align: left !important;
    white-space: normal !important;
    position: relative;
}
.form-forgot-pass .error {
    position: relative !important;
    margin: 0px;
    width: 100%;
}
.form-forgot-pass button {
    width: 150px;
    margin-top: 10px;
    margin-bottom: 10px;
}
.form-forgot-pass .forgot-password-button p {
    margin: 10px 0px;
    text-align: left !important;
}
.form-forgot-pass #reset-password {
    max-width: 232px;
    width: auto;
}
.remember-me {
    float: left;
    margin-top: 6px;
}
.remember-me-container {
    width: 100% !important;
}
#login_form .info {
    float: left;
}
#login_form .row.line {
    position: relative;
}
.line span {
    display: block;
    position: absolute;
    width: 14%;
    left: 43%;
    top: -9px;
}

.line span#label_or{
    position: relative;
    top:28px;
}
.forgot-password .modal-header {
    height:70px;
}
.forgot-password .modal-footer {
    margin-top: 0;
}
.forgot-password #password{
    position: relative;
}
.insert-code label,
.insert-phone label {
    line-height: 30px;
    position: relative;
}
.insert-code span.info,
.insert-phone span.info {
    display: inline-block;
    vertical-align: middle;
}
.login .message-area {
    float: none;
}
.resend-code {
    margin-top: 20px;
}
.row.check {
    position: relative;
    width: 200px;
    margin: 0 auto;
}
.row.check .info,
.row.check .remember-me {
    float: left;
}
.forgot-password .message-area {
    float: none;
    margin-bottom: 15px;
}
.forgot-password .tooltip-inner {
    width: 350px;
    max-width: 400px;
}
.forgot-password label[for="sent-msisdn"] {
    display: block;
    margin-bottom: 10px;
}
#sent-email,
.code-resent .iti {
    margin-bottom: 15px;
    cursor: default;
}
#sent-msisdn {
    cursor: default;
}
.iti__selected-flag.deactivated {
    text-align: left;
    cursor: default;
}
.step-title {
    margin-bottom: 20px;
}
.iti.pretty .iti__flag-container .iti__selected-flag.deactivated {
    width: 33px !important;
}
.iti__selected-flag.deactivated .iti__arrow {
    display: none;
}
.robot-verification {
    margin: 10px 0;
}
.forgot-password .send-code-label, .forgot-password .no-retries {
    margin-bottom: 10px;
    line-height: 22px;
}
.forgot-password-label {
    padding-top: 5px;
    padding-right: 5px;
    text-align: right;
}
.forgot-password .footer-area {
    margin-top: 15px;
    line-height: 22px;
}


/* --- /styles/toaster-manager.css--- */ 

.toaster-manager {
    position: fixed;
    top: 56px;
    right: calc((100% - 1260px) / 2);
    width: auto;
    height: auto;
    z-index: 1054;
}
.toaster-overlay-notifications {
    position: fixed;
    right: 105px;
    bottom: 20px;
    width: 360px;
    height: auto;
    z-index: 1000;
    vertical-align: bottom;
    max-height: calc(100vh - 75px);
    overflow: auto;
    padding-left: 20px;
    padding-right: 5px;
    padding-bottom: 10px;
    display: none;
}
.toaster-overlay-notification {
    display: flex;
    position: relative;
    width: 100%;
    height: auto;
    margin-top: 20px;
}
.toaster-overlay-notification .overlay-title-container {
    margin-top: 5px;
    margin-bottom: 5px;
}
.toaster-overlay-notification .overlay-icons-container {
    display: inline-block;
    position: relative;
    width: 100px;
    height: 100px;
    flex-shrink: 0;
}
.toaster-overlay-notification .overlay-main-icon {
    position: absolute;
    width: 80px;
    height: 80px;
    margin: 5px;
    font-size: 55px;
    text-align: center;
    line-height: 80px !important;
    z-index: 2;
}
.toaster-overlay-notification .overlay-icon {
    width: 30px;
    height: 30px;
    line-height: 26px !important;
    text-align: center;
    font-size: 20px;
    border-radius: 20px;
    z-index: 2;
    position: absolute;
    right: 15px;
    top: 5px;
}
.toaster-overlay-notification .overlay-content-container {
    padding-right: 25px;
    padding-bottom: 10px;
    position: relative;
    flex-grow: 1;
}
.toaster-overlay-notification .overlay-close-button {
    width: 20px;
    height: 20px;
    position: absolute;
    right: 5px;
    top: 5px;
    text-align: center;
    line-height: 20px!important;
}
.toaster[data-role=template] {
    display: none;
}
.toaster-manager .toaster {
    min-width: 320px;
    width: auto;
    position: relative;
    margin-top: 5px;
}
.toaster-manager .toaster .message {
    padding: 10px 50px 15px 30px;
}
.toaster-manager .toaster .message .toaster-message{
    width: 300px;
}
.toaster-manager .toaster .controls-bar {
    position: absolute;
    display: flex;
    width: auto;
    top: 5px;
    right: 5px;
}
.toaster-manager .toaster .controls-bar div {
    margin-left: 5px;
}
.toaster-manager .toaster.hidden-by-page{
    display: none;
}
.toaster-manager .title {
    display: none;
    text-align: center;
    width: calc(100% - 40px);
    min-height: 31px;
    margin-left: 15px;
    padding-top: 4px;
}


/* --- /styles/forwarder.css--- */ 

.forwarder {
    display: none;
    position: absolute;
    top: 54px;
    left: calc((100% - 1260px) / 2);
    width: 1260px;
    height: calc(100% - 54px);
    z-index: 1052;
}
.forwarder .areas-splitter {
    left: 349px;
    z-index: 3;
}
.forwarder .new-conversation {
    width: 40px;
    height: 40px;
}
.forwarder .ps-container {
    overflow: hidden;
    position: relative;
}
.forwarder .contacts-selector-container {
    position: absolute;
    top: 64px;
    width: 350px;
    height: calc(100% - 64px);
    z-index: 1;
}
body.with-logo .forwarder .contacts-selector-container,
.forwarder .contacts-selector-container.with-logo {
    top: 210px;
    height: calc(100% - 210px);
}
.forwarder .tools-area {
    position: absolute;
    top: 0px;
    left: 350px;
    width: calc(100% - 350px);
    height: 100%;
}
.forwarder .bar {
    width: 100%;
    height: 70px;
    position: absolute;
    bottom: 0;
    display: flex;
    z-index: 2;
}
.forwarder.actions-bar-top .bar {
    top: 0;
    bottom: auto;
}
.forwarder .bar .sw-button {
    margin-top: 19px;
    margin-right: 15px !important;
}
.forwarder .action-label {
    position: relative;
    display: table-cell;
    flex-grow: 1;
    vertical-align: middle;
}
.forwarder .action-label span {
    display: block;
    position: absolute;
    padding-left: 20px;
    top: 27px;
    width: 100%;
    height: auto;
    min-height: 16px;
    line-height: 16px;
    word-wrap: break-word;
    word-break: break-all;
}
.forwarder .buttons-container {
    display: block;
    width: auto;
    height: 100%;
}
.forwarder[data-working-mode^=messages-forwarder] .buttons-container {
    display: none;
}
.forwarder #conversation-create-helper-container {
    height: 100% !important;
    top: 0 !important;
}
.forwarder .chat-messages-container {
    position: absolute;
    width: 100%;
    height: calc(100% - 70px);
    top: 0;
    overflow: hidden;
    display: none;
}
.forwarder .chat-messages-container .chat-window-send-messages {
    display: none;
}
.forwarder .blank-state {
    position: absolute;
    top: 0px;
    width: 100%;
    height: calc(100% - 70px);
    z-index: 2;
}
.forwarder.actions-bar-top .blank-state {
    top: 70px;
}
.forwarder .blank-state span {
    position: absolute;
    top: calc(50% - 30px);
    left: 25%;
    width: 50%;
    height: auto;
    min-height: 60px;
    display: block;
    word-wrap: break-word;
}
.forwarder .conversation-helper-container {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}
.forwarder .selected-items-container {
    width: 100%;
    height: calc(100% - 70px);
    display: flex;
    flex-direction: column;
    position: absolute;
}
.forwarder.actions-bar-top .selected-items-container {
    top: 70px;
}
.forwarder .selected-items-container .conversation-list-item .last-message-attachment-preview-block {
    position: absolute;
    right: 4px;
    top: 4px;
}
.forwarder .list-counter {
    width: 100%;
    height: 35px;
    line-height: 50px;
    padding-left: 15px;
}
.forwarder .list-items {
    width: 100%;
    flex-grow: 1;
    overflow-y: auto;
}
.forwarder .list-items .contacts-selector-item {
    display: inline-flex;
    width: calc(33% - 20px);
    margin: 15px 0 0 15px;
}

.forwarder .buttons-container-messages {
    display: none;
    width: auto;
    height: 100%;
}
.forwarder[data-working-mode^=messages-forwarder] .buttons-container-messages {
    display: flex;
    width: 100%;
    padding-left: 10px;
    justify-content: space-between;
}
.forwarder[data-working-mode^=messages-forwarder] .btn:not(.btn-cancel) {
    position: relative;
}
.forwarder[data-working-mode^=messages-forwarder] .btn span {
    position: absolute;
    display: inline-block;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}
.forwarder[data-working-mode=messages-forwarder-conversations] .btn span[data-role=contacts] {
    display: none;
}
.forwarder.messages-forwarder[data-working-mode=messages-forwarder-contacts] .btn span[data-role=conversations] {
    display: none;
}

.forwarder .list-items .conversation-list-item {
    width: 280px;
    margin: 10px;
    display: inline-flex;
}
.forwarder .list-items .conversation-list-item .last-message-text {
    max-width: 166px;
}
.forwarder [data-role="cancel-button-container"] {
    position: absolute;
    right: 10px;
}
.forwarder [data-role="conversation-name-controls"] {
    display: flex;
    height: 30px;
    position: absolute;
    top: 20px;
    left: 20px;
}
.forwarder [data-role="conversation-name-controls"] .small-button {
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    flex-shrink: 0;
    margin: 0;
    display: inline-block;
}
.forwarder [data-role="conversation-name-controls"] .sw-button {
    height: 30px;
    margin: 0;
    padding-right: 36px !important;
}
.forwarder [data-role="conversation-name-controls"] input {
    margin: 0;
    display: none;
    display: inline-block;
    margin-left: 24px;
    margin-top: -2px;
    height: 33px;
    width: 300px;
    border: 0;
    margin-right: 24px;
}

@media (max-width: 1260px) {

    .forwarder {
        left: 0px;
    }

}

.with-wcf-ui-master-page .forwarder {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: auto;
}

.with-wcf-ui-master-page .forwarder .tools-area {
    position: absolute;
    top: calc(var(--TOP_BAR_HEIGHT) + var(--MASTER_PAGE_BANNERS_SPACE_HEIGHT));
    left: calc((100vw - var(--CONTENT_WIDTH)) / 2 + var(--SIDE_WIDTH));
    width: 100%;
    max-width: calc(var(--CONTENT_WIDTH) - var(--SIDE_WIDTH));
    height: calc(100vh - var(--TOP_BAR_HEIGHT) - var(--MASTER_PAGE_BANNERS_SPACE_HEIGHT));
    z-index: 1055;
}

/* --- /styles/sliding-layer.css--- */ 

.sliding-layer-container {
    position: absolute;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 2;
    overflow: hidden;
    display: none;
}
.full-page-layout.conversations .sliding-layer-container {
    z-index: 3;
}
.sliding-layer-floating-container {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: visible;
}
.sliding-layer-slide {
    width: 350px;
    height: 100%;
    position: absolute;
    display: inline-block;
}
.sliding-layer-bar {
    position: absolute;
    width: 100%;
    height: 53px;
}
.sliding-layer-content {
    position: absolute;
    top: 53px;
    width: 100%;
    height: calc(100% - 53px);
}
.sliding-layer-content .message-aggregate {
    width: 100%;
}
.sliding-layer-title {
    position: absolute;
    left: 40px;
    width: calc(100% - 40px);
    height: 100%;
    padding-left: 10px;
    padding-right: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 53px;
    display: flex;
}
.sliding-layer-bar .back-button {
    position: absolute;
    left: 0px;
    width: 40px;
    height: 100%;
}
.sliding-layer-bar .back-button span {
    width: 100%;
    height: 100%;
    display: block;
    text-align: center;
    line-height: 53px;
}


/* --- /styles/html-customizer.css--- */ 

/* SWITCHER */
[type=checkbox].converted-to-switcher {
    display: none;
}
.checkbox-switcher {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 24px;
    overflow: hidden;
    cursor: pointer;
}
.checkbox-switcher .switcher-bar {
    position: absolute;
    left: 1px;
    top: 5px;
    width: calc(100% - 2px);
    height: 14px;
    border-radius: 7px;
    transition: background-color .1s;
}
.checkbox-switcher .switcher-stroke {
    position: absolute;
    right: calc(100% - 24px);
    top: 0px;
    width: 24px;
    height: 24px;
    border-radius: 12px;
    -webkit-transition: right .1s; /* Safari */
    transition: right .1s;
    transition-timing-function: ease-in-out;
}
.checkbox-switcher .switcher-circle {
    position: absolute;
    right: calc(100% - 22px);
    top: 2px;
    width: 20px;
    height: 20px;
    border-radius: 10px;
    z-index: 2;
    -webkit-transition: right .1s, background-color .1s; /* Safari */
    transition: right .1s, background-color .1s;
    transition-timing-function: ease-in-out;
}
.checkbox-switcher.on .switcher-stroke {
    right: 0px;
}
.checkbox-switcher.on .switcher-circle {
    right: 2px;
}

/* CHECKBOXES (SQUARE or ROUND) */
.customized-checkbox {
    margin: 0;
    width: auto;
    display: inline;
    min-width: 20px;
    height: 20px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-left: 1px;
}
.customized-checkbox span[data-role='check-icon'] {
    width: 20px;
    height: 20px;
    vertical-align: middle;
}
.customized-checkbox span.customized-checkbox-label {
    display: inline;
}
.customized-checkbox.checked span.checked {
    display: inline-block !important;
}
.customized-checkbox.checked span.unchecked {
    display: none !important;
}
.customized-checkbox:not(.checked) span.unchecked {
    display: inline-block !important;
}
.customized-checkbox:not(.checked) span.checked {
    display: none !important;
}

/* RADIO BUTTON */
.customized-radio {
    margin: 0;
    width: auto;
    display: inline;
    line-height: 14px;
    overflow: unset;
    text-overflow: unset;
    white-space: break-spaces;
    padding-left: 1px;
}
.customized-radio span[data-role='check-icon'] {
    width: 20px;
    height: 20px;
    vertical-align: middle;
}
.customized-radio span.customized-radio-label {
    display: inline;
    max-width: 290px;
    width: 100%;
    text-align: left;
    overflow-wrap: break-word;
}
.customized-radio.checked span.checked {
    display: inline-block !important;
}
.customized-radio.checked span.unchecked {
    display: none !important;
}
.customized-radio:not(.checked) span.unchecked {
    display: inline-block !important;
}
.customized-radio:not(.checked) span.checked {
    display: none !important;
}
/*
.customized-radio.checked:hover span.unchecked {
    display: inline-block;
    opacity: 0.3;
}
.customized-radio.checked:hover span.checked {
    display: none;
}
.customized-radio:not(.checked):hover span.checked {
    display: inline-block;
    opacity: 0.3;
}
.customized-radio:not(.checked):hover span.unchecked {
    display: none;
}
*/

/* --- /styles/conversations.css--- */ 

.conversations .filtering-controls {
    position: relative;
    display: flex;
    width: 100%;
    height: 42px;
    line-height: 29px;
    padding-left: 14px;
}
.conversations .filtering-controls .filter-button {
    display: inline-block;
    text-align: center;
    width: 30px;
    height: 30px;
    margin-top: 4px;
    margin-right: 10px;
}
.conversations .filtering-controls .meeting-rooms-launcher {
    position: absolute;
    right: 15px;
    top: 4px;
    width: 30px;
    height: 30px;
    border-radius: 15px;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-radius: 15px;
}
.conversations .controls .drop-active {
    opacity: 1 !important;
    font-size: 21px;
}
.conversations .listing-container {
    position: relative;
    display: block;
    overflow-x: hidden;
    overflow-y: auto;
    flex-grow: 1;
}
.conversations .left-area-owner {
    position: absolute;
    width: 100%;
    height: auto;
    min-height: 100%;
}
.conversations .left-area-owner[data-role="conversations-list-search"] {
    display: none;
}
.conversations .user-messages {
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 3;
}
.conversations .user-messages .user-message {
    position: absolute;
    top: 50px;
    width: 90%;
    margin-left: 5%;
    height: auto;
    text-align: center;
}
.conversations .left-area.with-user-message .listing-container .user-messages {
    display: block;
}
.conversations .left-area[data-filter] .load-more-button {
    display: none;
}
.conversations .left-area[data-filter=totr] .conversation-list-item[data-filter=external] {
    display: none;
}
.conversations .left-area[data-filter=external] .conversation-list-item[data-filter=totr] {
    display: none;
}

.conversations-list {
    position: relative;
    min-height: 0 !important;
}
.conversations .list-title {
    position: relative;
    text-align: center;
    height: 72px;
    line-height: 72px;
    font-size: 17px;
}
.conversations-list.with-more-records {
    padding-bottom: 40px;
}
.conversations-list.with-more-records .load-more-button {
    position: absolute;
    bottom: 0;
    display: block;
}
.sliding-layer-container .conversations-list {
    position: inherit;
}
.conversations .right-area-owner {
    display: none;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
}
.conversations .right-area-owner[data-role=blank-state] .info-message {
    position: relative;
    width: 100%;
    text-align: center;
    top: 50%;
    font-size: 15px;
}
.conversations .search-manager {
    margin: 10px 15px 10px 15px;
}
/* CONVERSATIONS ITEMS */
.conversation-list-item {
    position: relative;
    display: flex;
    width: 100%;
    height: 80px;
    padding-right: 3px;
}
.conversation-list-item .checkbox-block {
    position: relative;
    display: none;
    width: 30px;
    height: 100%;
    line-height: 80px;
    flex-shrink: 0;
    text-align: right;
}
.multi-select-on .checkbox-block {
    display: inline-block;
}
.conversation-list-item .picture-block .picture-container {
    display: none;
}
.conversation-list-item .picture-block .user-availability-flag {
    top: 20px;
    right: 0px;
}
.conversation-list-item .picture-block.subscriber .subscriber-picture {
    display: block;
}
.conversation-list-item .picture-block.group .group-picture {
    display: block;
}
.conversation-list-item .picture-block {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 100%;
    line-height: 80px;
    flex-shrink: 0;
    text-align: center;
    margin-left: 10px;
}
.conversations .messages-search .conversation-list-item .picture-block {
    display: none !important;
}
.conversation-list-item .picture-block .picture-container {
    position: absolute;
    top: 20px;
    left: 0;
    width: 40px;
    height: 40px;
    line-height: 80px;
    border-radius: 20px;
    overflow: hidden;
}
.conversation-list-item .picture-block img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 25px;
}
.conversation-list-item .picture-block .group-picture {
    line-height: 38px;
    font-size: 30px;
}
.conversation-list-item .date-row {
    position: absolute;
    top: 3px;
    right: 3px;
    width: auto;
    height: 20px;
    line-height: 20px;
    font-size: 10px;
}
.conversation-list-item .details-block {
    display: inline-block;
    flex-grow: 1;
    margin-top: 21px;
    height: 60px;
    padding-left: 10px;
    overflow: hidden;
    position: relative;
    margin-right: 5px;
}
.conversation-list-item .details-block .title-row,
.conversation-list-item .flex-content {
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 19px;
    line-height: 19px;
    white-space: nowrap;
}
.conversation-list-item .join-button-container{
    display: none;
    position: absolute;
    right:5px;
    top:22px;
}

.conversation-list-item.with-join-button .last-message-attachment-preview-block{
    display: none !important;
}

.conversation-list-item.with-join-button .join-button-container{
    display: block;
}

.conversation-list-item.with-join-button .title-row {
    width: calc(100% - 90px);
}
.conversation-list-item.with-join-button .flex-content {
    margin-top: 5px;
}

.conversation-list-item .title-text,
.conversation-list-item .last-message-text {
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 10px;
}
.conversation-list-item .last-message-text .deleted-icon {
    width: 16px;
    height: 16px;
    display: inline-block;
    vertical-align: text-top;
    margin-left: 1px;
}
.conversation-list-item .last-message-text .deleted-for-everyone {
    color: #6e6e6e;
    font-style: italic;
}
.conversation-list-item .title-icon {
    font-size: 20px;
    margin-right: 5px;
}
.conversation-list-item .last-message-icon {
    font-size: 20px;
    margin-right: 5px;
    position: relative;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
}
.conversation-list-item .last-message-icon .clip-duration {
    display: none;
    width: 100px;
    height: 13px;
    line-height: 11px;
    position: absolute;
    bottom: -15px;
    left: -40px;
}
.conversation-list-item .last-message-icon.with-clip-duration .clip-duration {
    display: block;
}
.conversation-list-item .last-message-attachment-preview-block {
    margin-top: 21px;
    width: 38px;
    height: 38px;
    line-height: 38px;
    text-align: right;
    overflow: hidden;
    flex-shrink: 0;
    margin-left: 10px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 3px;
}
.conversation-list-item .border {
    position: absolute;
    bottom: 0px;
    left: -7px;
    width: calc(100% + 7px);
    height: 1px;
}
.conversation-list-item .unread-bubble {
    position: absolute;
    display: none;
    top: 10px;
    right: -5px;
    width: auto;
    min-width: 24px;
    height: 24px;
    line-height: 24px;
    border-radius: 12px;
    text-align: center;
    padding-left: 3px;
    padding-right: 3px;
    z-index: 2;
}

.conversation-list-item.dragged-conversation {
    position: absolute;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    z-index: 100000;
    opacity: .8;
}
.conversation-list-item.dragged-conversation .picture-block,
.conversation-list-item.dragged-conversation .picture-container {
    position: absolute;
    top: 0;
    left: -3px;
    margin: 0 !important;
}
.conversation-list-item.dragged-conversation .picture-block .stw-group {
    margin-top: 5px;
}
.conversation-list-item .favorite-marker {
    display: none;
    position: absolute;
    right: 2px;
    top: 28px;
    font-size: 19px;
    color: var(--COLOR_22);
}
.conversation-list-item.with-favorite-marker .favorite-marker {
    display: block;
}
    /* THE NEXT CODE IS COMMENTED ON PURPOSE, AS FIX FOR https://jira.streamwide.com/browse/SMARTMS-3540
 * SEE DETAILS IN THE SPECIFIED TICKET
 * THE CODE SHOULD BE KET, IF THE MARKETING COMES BACK ON THE DECISION
 */
/*
.conversation-list-item.selected {
   height: auto;
   min-height: 80px;
}
.conversation-list-item.selected .title-row {
   height: auto;
}
.conversation-list-item.selected .title-text {
   overflow: hidden;
   width: 100%;
   white-space: nowrap;
   text-overflow: ellipsis;
}
.conversation-list-item.selected.with-group-picture .title-text {
   text-indent: 25px;
}
.conversation-list-item.selected.with-group-picture .title-icon {
   position: absolute;
}
.conversation-list-item.selected .flex-content {
   height: auto;
}
.conversation-list-item.selected .details-block {
   height: auto;
}
.conversation-list-item.selected .last-message-text {
   overflow: auto;
   white-space: normal;
   word-break: break-word;
   margin-bottom: 10px;
   max-height: 200px;
}
*/

.create-conversation {
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.create-conversation .selected-entities-counter {
    margin: 10px;
    margin-left: 12px;
}
.create-conversation .controls-bar {
    width: 100%;
    min-height: 68px;
    overflow: hidden;
    white-space: nowrap;
    padding-top: 20px;
    padding-left: 30px;
    padding-right: 30px;
}
.create-conversation .selected-contacts-counter,
.create-conversation .select-conversation-title {
    width: 100%;
    padding-left: 20px;
    height: 35px;
    line-height: 35px;
}
.create-conversation .content-container {
    display: none;
    width: calc(100% - 20px);
    left: 10px;
    position: relative;
    flex-grow: 1;
}
.create-conversation .help-container  {
    display: none;
    width: calc(100% - 20px);
    left: 10px;
    height: auto;
    position: absolute;
}
.create-conversation .availability-switcher-bar .checkbox-switcher {
    position: absolute;
    top: 19px;
    left: 0px;
}
.create-conversation .availability-switcher-bar .switcher-label {
    width: auto;
    height: 22px;
    line-height: 22px;
    position: absolute;
    top: 20px;
    left: 45px;
}
.create-conversation.with-availability-switcher .help-container  {
    height: calc(100% - 128px);
    top: 128px;
}
.create-conversation .selected-entities,
.create-conversation .select-conversation {
    display: none;
    width: 100%;
    height: 100%;
    max-height: 100%;
    position: relative;
}
.create-conversation .selected-entities .scrolled-container,
.create-conversation .select-conversation .scrolled-container {
    position: absolute !important;
    width: 100%;
    height: calc(100% - 106px);
    top: 94px;
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
}

.create-conversation .action-buttons,
.create-conversation .group-name-controls {
    display: none;
}
.create-conversation .action-buttons.visible {
    display: flex;
    flex-wrap: wrap;
}
.create-conversation .group-name-controls.visible {
    display: block;
}
.create-conversation .controls-bar table {
    width: 100%;
}
.create-conversation .controls-bar td.scale {
    width: 100%;
}
.create-conversation .controls-bar td.scale.input {
    vertical-align: top;
}

.create-conversation .controls-bar td.cancel-btn {
    vertical-align:top
}

.create-conversation .controls-bar td.cancel-btn .sw-button {
    margin-left: 20px;
}

.create-conversation .controls-bar .sw-button {
    margin-right: 15px;
    margin-bottom: 10px;
    float: left;
    width: auto;
    flex-grow: 1;
    flex-basis: 0;
    max-width: 280px;
}
.create-conversation .controls-bar .sw-button.group-name-controls-submit {
    margin-left:20px;
    margin-right: 0;
}

.create-conversation .action-buttons,
.create-conversation .group-name-controls {
    width: 100%;
    display: none;
}
.create-conversation .create-group-conversation {
    width: 100%;
    margin-left: 0px !important;
}
.create-conversation .group-name-controls-close {
    width: 36px !important;
    min-width: 36px !important;
    margin-left: 0px !important;
    height: 32px;
}
.create-conversation .group-name-input {
    height: 33px;
}
.create-conversation .help-item {
    position: absolute;
    top: 150px;
    text-align: center;
    width: 60%;
    left: 20%;
}
.create-conversation .help-item [data-role="with-availability"] {
    display: none;
}
.create-conversation .help-item span {
    display: block;
    margin: 30px;
}
.create-conversation .availability-switcher-bar {
    display: none;
    position: relative;
    left: 20px;
    width: calc(100% - 40px);
    height: 60px;
    flex-shrink: 0;
}
.create-conversation .availability-switcher-bar .info-icon {
    position: absolute;
    right: -20px;
    top: 4px;
}
.create-conversation.with-availability-switcher .availability-switcher-bar {
    display: block;
}
.create-conversation.availability-off [data-role="with-availability"] {
    display: none;
}
.create-conversation.availability-off [data-role="no-availability"] {
    display: block;
}
.create-conversation.availability-on [data-role="with-availability"] {
    display: block;
}
.create-conversation.availability-on [data-role="no-availability"] {
    display: none;
}
.conversation-contacts {
    height: 65px;
    width: 270px;
    margin: 10px;
    margin-top: 0px;
    display:inline-block;
}
.conversation-contacts .group-image,
.conversation-contacts .user-image {
    margin: 11px;
}
.conversation-contacts .name {
    max-width: 200px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.conversation-contacts .name:after {
    clear: both;
    content: "";
}
#conversation-create-helper-container {
    z-index: 5;
}
.conversations-page-layer {
    position: absolute;
    top: 100px;
    left: 0px;
    width: 100%;
    height: calc(100% - 100px);
    display: none;
}
.conversations-page-layer .info-message {
    position: absolute;
    top: 150px;
    width: 100%;
    text-align: center;
}
.conversations-page-layer.conversations-container {
    top: auto;
    padding-bottom: 60px;
}
.conversations-filter {
    display: none;
    position: relative;
    padding-left: 18px;
    height: 42px;
    padding-top: 5px;
    z-index: 2;
}
.conversations-filter > div {
    width: 30px;
    height: 30px;
    display: inline-block;
    cursor: pointer;
    margin-right: 8px;
    line-height: 28px;
    text-align: center;
}
.conversations .title {
    display: flex;
}
.conversations .title.with-tooltip .info {
    display: inline-block;
}
.conversations .title .info {
    margin-top: 3px;
    display: none;
}
.contact-options-button.admin-conversation {
    float: right;
}

.create-conversation .selected-entities .entities-types-container {
    width: 98%;
    margin: 10px;
    display: inline-block;
    height: 25px;
}
.entities-types-container .entities-types-container-tab {
    width: 50%;
    float: left;
    text-align: center;
    cursor: pointer;
    font-size: 14px;
    font-weight: bold;
    padding-bottom: 3px;
}
.conv-admin-controls-bar {
    float: right;
    padding-right: 10px;
    cursor: pointer;
}
.conv-admin-controls-bar > div {
    float: right;
    padding-left: 5px;
}
.conv-admin-controls-bar > div.control {
    padding-top: 2px;
}
.conv-admin-controls-bar .multiselection-controls .layer .control {
    float: left;
    padding-right: 5px;
}
.admin-group-checkbox {
    padding: 13px 0 0 10px;
}
.modal-body .text-message .dialog-admin-conv-message {
    border-bottom: 2px solid #e5e5e5;
    text-align: left;
    margin: 0px;
    padding-bottom: 5px;
}
.modal-body .text-message .dialog-admin-conv-user {
    background-color: #f7f6f6;
    padding: 5px;
    margin: 0px;
    border-bottom: 1px solid #e5e5e5;
    text-align: left;
}
.modal-body .text-message .dialog-admin-conv-container {
    max-height: 150px;
    overflow-y: auto;
}
.controls-bar td.scale .assign-admin {
    float: right;
}
.controls-bar td.scale .assign-admin-title {
    float: left;
    width: 70%;
    font-size: 18px;
}
#conversation-sliding-layer {
    top: 64px;
    height: calc(100% - 64px);
}
#conversation-sliding-layer .sliding-layer-slide {
    top: 0 !important;
}
#conversation-sliding-layer .sliding-layer-bar .content > * {
    display: inline-block;
}
#conversation-sliding-layer .sliding-layer-bar .content {
    width: 100%;
    display: flex;
}
#conversation-sliding-layer .sliding-layer-bar .content .recipient-details {
    flex-grow: 1;
}
#conversation-sliding-layer .sliding-layer-bar .content .entity-detail-name {
    position: relative;
    top: auto;
    left: auto;
    margin: 0;
}
#conversation-sliding-layer .sliding-layer-bar .content .entity-image {
    margin-top: 5px;
    position: relative !important;
    top: auto;
    left: auto;
}
#conversation-sliding-layer .sliding-layer-bar .content .entity-image img {
    vertical-align: inherit;
}
#conversation-sliding-layer .sliding-layer-bar .content .contact-features .call-controls {
    width: auto;
    display: flex;
}
#conversation-sliding-layer .sliding-layer-bar .content .contact-features .details-options {
    margin-top: 5px;
}
#conversation-sliding-layer .sliding-layer-bar .content .contact-features .join-button-container {
    height: auto;
    padding: 0;
    height: 25px;
    margin-top: 12px;
}
#conversation-sliding-layer .call-message,
#conversation-sliding-layer .message-aggregate {
    max-width: 320px !important;
}
.create-conversation .conversation-contacts {
    display: inline-flex;
}
.create-conversation .conversation-contacts .name {
    width: auto;
    max-width: 166px;
    flex-grow: 1;
    height: auto;
    max-height: 40px;
    margin-top: auto;
    margin-bottom: auto;
    white-space: normal;
    line-height: 20px;
    overflow: hidden;
}
.create-conversation .conversation-contacts .contact-options-button {
    top: auto;
    right: auto;
    position: relative;
    margin-top: auto;
    margin-bottom: auto;
}
.conversations-selector-slider-container {
    position: absolute;
    left: calc((100% - 1260px) / 2);
    width: 350px;
    height: calc(100vh - 117px);
    top: 117px;
    z-index: 1052;
}
.conversations-selector-slider-container .split-border {
    width: 100%;
    height: 1px;
}
.conversations-selector-slider-container .search-box {
    margin-bottom: 20px;
}
.conversations-selector-slider-container .search-box #loading {
    position: absolute;
    top: -10px;
}
.conversations-selector-slider-container .no-records {
    top: 116px !important;
}
.conversations-selector-slider-container.with-logo {
    top: 266px;
    height: calc(100vh - 266px);
}
.conversations-selector-layer .list-block-search {
    display: none;
}
.conversations-selector-layer.contacts-selector-layer .list-block-search {
    height: auto;
}
.conversations-selector-layer .load-more-button {
    position: absolute;
    bottom: 0;
}

.conversations-list .favorite-conversations {
    &::after {
        display: block;
        content: "";
        width: 100%;
        height: 11px;
        background-color: var(--clNeutral09);
    }
}

/* --- /styles/contacts.css--- */ 

.right-container .group-of-groups-slider {
    position: relative;
    float: left;
    padding-right: 60px;
}
.right-container .group-of-groups-slider .top-bar {
    position: relative;
    width: 100%;
    height: 70px;
}
.right-container .group-of-groups-slider .top-bar > div.arrow:first-child {
    width: 51px;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
}
.right-container .group-of-groups-slider .top-bar .content {
    width: calc(100% - 51px);
    height: 100%;
    position: absolute;
    left: 51px;
    padding-top: 21px;
    text-indent: 10px;
    font-size: 14px;
}
.right-container .group-of-groups-slider .top-bar .arrow span {
    width: 30px;
    height: 30px;
    display: block;
    left: calc(50% - 15px);
    top: calc(50% - 15px);
    position: absolute;
}

.btn-wrapper {
    display: inline-table;
    margin-right: 10px;
}
.contact-details-modal {
    width: 900px;
    left: calc(50vw - 450px);
}
.contact-details-modal .modal-dialog {
    width: 100% !important;
}

/* --- /styles/dispatcher-pins-layer.css--- */ 

.dispatcher-pin-marker {
    position: absolute;
    top: -60px;
    left: -31px;
    width: 60px;
    height: 60px;
    overflow: visible;
}
.dispatcher-pin-marker .pins,
.dispatcher-pin-marker .mask {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;

} 
.dispatcher-pin-marker .selector-flag {
    position: absolute;
    top: 17px;
    left: 17px;
    z-index: 3;
}
.dispatcher-pin-marker .background-pin {
    position: absolute;
    width: 46px;
    height: 46px;
    border-radius: 23px;
    top: 7px;
    left: 7px;
    z-index: 2;
}
.dispatcher-pin-marker .border-pin {
    position: absolute;
    width: 52px;
    height: 52px;
    border-radius: 26px;
    top: 4px;
    left: 4px;
    z-index: 1;
}
.dispatcher-pin-marker .selector-flag {
    display: none;
}
.dispatcher-pin-marker.selected .icon {
    display: none;
}
.dispatcher-pin-marker.selected .selector-flag {
    display: block;
}
.dispatcher-pin-marker .pin-name {
    position: absolute;
    width: auto;
    height: auto;
    bottom: -22px;
    padding-left: 10px;
    padding-right: 10px;
}
.dispatcher-pin-marker .pin-name .background {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}
.dispatcher-pin-marker .pin-name .text {
    position: relative;
    white-space: nowrap;
    margin-top: 4px;
}
.dispatcher-pin-marker .icon {
    position: absolute;
    top: 14px;
    left: 15px;
    width: 30px;
    height: 30px;
    z-index: 3;
}
.dispatcher-pin-marker .background-pin .arrow {
    width: 10px;
    height: 10px;
    transform: rotate(45deg);
    position: absolute;
    bottom: -3px;
    left: 19px;
}
.dispatcher-pin-marker .border-pin .arrow {
    width: 10px;
    height: 10px;
    transform: rotate(45deg);
    position: absolute;
    bottom: -3px;
    left: 22px;
}
.icons-container {
    position: relative;
    width: calc(100% - 27px);
    height: auto;
    font-size: 0;
}
.dispatcher-pin-icon-container {
    position: relative;
    width: 25%;
    height: 88px;
    display: inline-block;
}
.dispatcher-pin-icon-container:nth-child(4n) {
    border-right: 0;
}
.dispatcher-pin-icon-container:nth-child(4n+1):nth-last-child(1) {
    border-bottom: 0;
}
.dispatcher-pin-icon-container:nth-child(4n+2):nth-last-child(2) {
    border-bottom: 0;
}
.dispatcher-pin-icon-container:nth-child(4n+3):nth-last-child(4n) {
    border-bottom: 0;
}
.dispatcher-pin-icon-svg {
    width: 50%;
    height: 50%;
    margin: 25%;
}

.dispatcher-pin-icons-selector .modal-dialog {
    width: 430px;
    margin: 180px auto;
}

.dispatcher-pin-icons-selector .modal-footer {
    display: flex;
    justify-content: space-between;
}

.dispatcher-pin-icons-selector .scrolable-container {
    width: 100%;
    height: 265px;
    overflow: hidden;
    position: relative;
}
.dispatcher-pin-icons-selector .btn {
    width: auto;
    min-width: 120px;
}

/* --- /styles/dispatcher-pins-list.css--- */ 

/* hide the default multiple select controls from geolc tabs*/
.geolocation-tabs.multi-select-on[data-active-tab="tab-locations"] .multi-select-controls {
    display: none !important;
}
.geolocation-tabs.multi-select-on[data-active-tab="tab-locations"] .dispatcher-pins-list.with-multiple-selection .multi-select-controls {
    display: block !important;
    top: 0;
    height: 80px;
    border-bottom: none;
}
.geolocation-tabs.multi-select-on[data-active-tab="tab-locations"] .tab-content {
    padding-top: 40px;
}
.dispatcher-pins-list {
    position: absolute;
    top: 40px;
    left: 0px;
    width: 100%;
    height: calc(100% - 40px);
}
.dispatcher-pins-list .no-results,
.dispatcher-pins-list .loading,
.dispatcher-pins-list .blank-state,
.dispatcher-pins-list .listing-container {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    overflow: hidden;
    margin: 0px;
}
.dispatcher-pins-list .listing-container .scrollable-container {
    padding-bottom: 100px;
}
.dispatcher-pins-list .loading {
    display: none;
    z-index: 3;
}
.dispatcher-pins-list .no-results, 
.dispatcher-pins-list .no-locations {
    display: none;
    height: 50px;

}
.dispatcher-pins-list .no-locations {
    margin: 20px;
    text-align: center;
}
.dispatcher-pins-list.with-multiple-selection .no-results,
.dispatcher-pins-list.with-multiple-selection .blank-state,
.dispatcher-pins-list.with-multiple-selection .listing-container {
    top: 80px;
    height: calc(100% - 80px);
}
.dispatcher-pins-list .blank-state .message {
    position: absolute;
    top: calc(50% - 65px);
    text-align: center;
    width: 80%;
    min-height: 20px;
    height: auto;
    margin: 0 10%;
}
.dispatcher-pins-list .blank-state .message .message-info {
    margin-bottom: 20px;
}
.dispatcher-pins-list .blank-state .message .icon {
    display: inline-block;
}
.dispatcher-pins-list .dispatcher-pin-item {
    position: relative;
    display: flex;
    width: 100%;
    height: 60px;
}
.dispatcher-pins-list .dispatcher-pin-item .checkbox-block {
    position: absolute;
    left: 5px;
    top: 0;
    width: 30px;
    height: 100%;
    display: none;
}
.dispatcher-pins-list.with-multiple-selection .dispatcher-pin-item .checkbox-block {
    display: block;
}
.dispatcher-pins-list .dispatcher-pin-item .icon-block {
    position: absolute;
    left: 5px;
    top: 10px;
    width: 40px;
    height: 40px;
    text-align: center;
    border-radius: 20px;
}

.dispatcher-pins-list.with-multiple-selection .dispatcher-pin-item .icon-block {
    left: 35px;
}
.dispatcher-pins-list .dispatcher-pin-item .icon-block .icon {
    width: 25px;
    height: 25px;
    position: absolute;
    left: 8px;
    top: 7px;
}
.dispatcher-pins-list .dispatcher-pin-item .pin-details-block {
    width: calc(100% - 105px);
    height: 100%;
    position: absolute;
    left: 50px;
}
.dispatcher-pins-list.with-multiple-selection .dispatcher-pin-item .pin-details-block {
    width: calc(100% - 125px);
    left: 80px;
}
.dispatcher-pins-list .dispatcher-pin-item .pin-details-block .pin-label {
    line-height: 20px;
    height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 20px;
    white-space: nowrap;
    width: 100%;
}
.dispatcher-pins-list .dispatcher-pin-item .pin-details-block .pin-address {
    height: 33px;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    line-height: 15px;
}
.dispatcher-pins-list .dispatcher-pin-item .pin-details-block .distance-to-address {
    display: none;
    height: 17px;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    white-space: nowrap;
}
.dispatcher-pins-list.with-searched-address .dispatcher-pin-item .distance-to-address {
    display: block;
}
.dispatcher-pins-list .dispatcher-pin-item .pin-details-block .pin-address {
    height:18px;
    white-space: nowrap;
}
.dispatcher-pins-list .dispatcher-pin-item .visibility-control {
    position: absolute;
    right: 0;
    width: 60px;
    height: 100%;
    text-align: center;
    line-height: 60px;
}
.dispatcher-pins-list .dispatcher-pin-item .visibility-control .icon {
    line-height: 60px;
    display: block;
}
.dispatcher-pins-list .dispatcher-pin-item .visibility-control .icon-closed {
    display: none;
}
.dispatcher-pins-list .dispatcher-pin-item .visibility-control.closed .icon {
    display: none;
}
.dispatcher-pins-list .dispatcher-pin-item .visibility-control.closed .icon-closed {
    display: block;
}
.dispatcher-pins-list .dispatcher-pin-item .checkbox-block .stw-checked,
.dispatcher-pins-list .dispatcher-pin-item .checkbox-block .stw-unchecked {
    line-height: 60px !important;
    height: 100%;
}
.dispatcher-pins-list .multi-select-controls .control-button {
    position: absolute;
    cursor: pointer;
}
.dispatcher-pins-list .multi-select-controls .control-button .icon {
    display: inline-block;
    vertical-align: top;
}
.dispatcher-pins-list .multi-select-controls .control-button .action {
    height: 18px;
    display: inline-block;
    line-height: 18px;
}
.dispatcher-pins-list #cancel {
    top: 10px;
}
.dispatcher-pins-list #delete-execute {
    right: 15px;
    top: 10px;
}
.dispatcher-pins-list #select-all,
.dispatcher-pins-list #unselect-all {
    top: 45px;
}
.dispatcher-pins-list #unselect-all {
    display: none;
}

/* --- /styles/tracking-rules-list.css--- */ 

.tracking-rules-container {
    position: absolute;
    top: 85px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 99;
    display: block;
}
.tracking-rules-container.visible {
    height: calc(100% - 85px);
}
.tracking-rules-container .trigger-button {
    position: absolute;
    top: -38px;
    right: 20px;
    width: 31px;
    height: 31px;
}
.tracking-rules-container .scroll-container {
    position: relative;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.tracking-rules-container .list-container {
    position: relative;
    top: 0px;
    left: 0px;
    width: 100%;
    height: auto;
    min-height: 100%;
    display: block;
}
.tracking-rule-item {
    position: relative;
    display: block;
    width: 100%;
    height: 60px;
}
.tracking-rule-item.for-slider-bar {
    width: auto;
    top: 10px;
}
.tracking-rule-item .icon-container {
    position: absolute;
    width: 40px;
    height: 40px;
    left: 20px;
    top: 8px;
}
.tracking-rule-item.for-slider-bar .icon-container {
    left: 10px
}
.tracking-rule-item .light-area {
    position: absolute;
    width: 100%;
    height: 50%;
    top: 0px;
}
.tracking-rule-item .dark-area {
    position: absolute;
    width: 100%;
    height: 50%;
    top: 50%;
}
.tracking-rule-item .icon {
    position: absolute;
    top: 7px;
    left: 8px;
    height: 24px;
    width: 24px;
}
.tracking-rule-item .users-counter {
    position: absolute;
    width: 100%;
    height: 50%;
    top: 50%;
}
.tracking-rule-item .name-container {
    position: absolute;
    left: 84px;
    top: 0px;
    width: calc(100% - 84px - 34px);
    height: 50%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 32px;
}
.tracking-rule-item.for-slider-bar .name-container {
    left: 64px;
    width: calc(100% - 64px);
}
.tracking-rule-item .details-container {
    position: absolute;
    left: 84px;
    top: calc(50% - 4px);
    width: calc(100% - 84px - 34px);
    height: 50%;
    overflow: hidden;
    line-height: 14px;
}
.tracking-rule-item.for-slider-bar .details-container {
    left: 64px;
    width: calc(100% - 64px);
    height: calc(50% + 12px);
    white-space: normal;
}
.tracking-rule-item .controls-container {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 34px;
    height: 100%;
}
.tracking-rule-item.inactive .controls-container,
.tracking-rule-item.for-slider-bar .controls-container {
    display: none;
}
.tracking-rule-item .controls-container .open-control {
    position: absolute;
    right: 0px;
    top: calc(50% - 10px);
    width: 34px;
    height: 20px;
    line-height: 20px;
}
.tracking-rule-slider-bar {
    position: absolute;
    display: flex;
    top: 0px;
    left: 40px;
    width: calc(100% - 41px);
    height: 100%;
}
.tracking-rule-slider-bar .rule-container {
    position: relative;
    display: inline-block;
    flex-grow: 1;
}
.tracking-rule-slider-bar .controls {
    margin-right: 5px;
}
.tracking-rules-container .sliding-layer-bar {
    height: 80px;
}
.tracking-rules-container .sliding-layer-content {
    top: 80px;
}
.tracking-rules-container .sliding-layer-bar .back-button span {
    line-height: 80px;
}
.tracking-rules-container .sliding-layer-container {
    position: absolute;
    top: -184px;
    width: 100%;
    height: calc(100% + 184px);
    z-index: 99;
    overflow: hidden;
}
.tracking-rule-slide {
    width: 100%;
    height: 100%;
}
.tracking-rule-slide .search-box {
    margin-top: 15px;
}
.tracking-rule-slide .subscribers-container {
    position: relative;
    top: 10px;
    width: 100%;
    height: calc(100% - 82px) !important;
    overflow: hidden;
}
.tracking-rule-slide .contact-scroll {
    height: 100% !important;
}
.tracking-rule-slider-bar .controls .button {
    width: 25px;
    height: 30px;
    line-height: 30px;
    display: inline-block;
    margin-top: 25px;
}


/* --- /styles/unrelated-dispatcher-pins-popup.css--- */ 

.unrelated-dispatcher-pins-popup .modal-dialog {
    width: 900px;
    max-width: 900px;
    height: 600px;
}
.unrelated-dispatcher-pins-popup .modal-content {
    height: 600px;
}
.unrelated-dispatcher-pins-popup .modal-body {
    width: 100%;
    height: calc(100% - 45px);
    padding: 0px;
}

.unrelated-dispatcher-pins-popup .map-container {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 2;
}
.unrelated-dispatcher-pins-popup .leaflet-icon {
    margin-top: -53px;
    margin-left: -22px;
}
.unrelated-dispatcher-pins-popup .modal-title {
    width: auto;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display:inline-block;
    vertical-align: top;
    cursor: pointer;
}
.unrelated-dispatcher-pins-popup .expand-collapse {
    display: inline-block;
}
.unrelated-dispatcher-pins-popup .modal-header span {
    display: inline-block;
    height: 22px;
    line-height: 22px;
    width: 40px;
    vertical-align: top;
}
.unrelated-dispatcher-pins-popup .modal-header span.title {
    width: auto;
}

.unrelated-dispatcher-pins-popup .modal-header span.expand-icon {
    display: inline-block;
}
.unrelated-dispatcher-pins-popup .modal-header span.collapse-icon {
    display: none;
}
.unrelated-dispatcher-pins-popup .modal-content .opened span.collapse-icon {
    display: inline-block;
}

.unrelated-dispatcher-pins-popup .modal-content .opened span.expand-icon {
    display: none;
}
.unrelated-dispatcher-pins-popup .modal-content .pins-selector {
    position: absolute;
    height: 351px;
    width: 280px;
    display: none;
    overflow: hidden;
    z-index: 3;
}
.unrelated-dispatcher-pins-popup .unrelated-dispatcher-pin-item {
    position: relative;
    display: flex;
    width: 100%;
    height: 70px;
}
.unrelated-dispatcher-pins-popup .unrelated-dispatcher-pin-item .icon-block {
    position: absolute;
    left: 5px;
    top: 15px;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    text-align: center;
}

.unrelated-dispatcher-pins-popup .unrelated-dispatcher-pin-item .icon-block .icon {
    width: 26px;
    height: 26px;
    left: 7px;
    position: absolute;
    top: 7px;
}

.unrelated-dispatcher-pins-popup .unrelated-dispatcher-pin-item .pin-details-block {
    width: calc(100% - 53px);
    height: 100%;
    position: absolute;
    left: 50px;
}

.unrelated-dispatcher-pins-popup .unrelated-dispatcher-pin-item .pin-details-block .pin-label {
    line-height: 18px;
    height: 18px;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 2px;
    white-space: nowrap;
    width: 100%;
}
.unrelated-dispatcher-pins-popup .unrelated-dispatcher-pin-item .pin-details-block .pin-address {
    max-height: 30px;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    line-height: 15px;
}
.unrelated-dispatcher-pins-popup .unrelated-dispatcher-pin-item .pin-details-block .pin-geoloc {
    height: 15px;
}
.unrelated-dispatcher-pins-popup .dispatcher-pin-marker {
    cursor: pointer !important;
}
.unrelated-dispatcher-pins-popup .leaflet-map-pane .dispatcher-pin-marker {
    cursor: default !important;
}



/* --- /styles/geolocation-search-input.css--- */ 

.geolocation-search-input {
    position: relative;
    width: 100%;
    height: 100%;
}
.geolocation-search-input input {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
}
.geolocation-search-input .reset-button {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 30px;
    height: 30px;
}
.geolocation-search-input .reset-button span {
    display: block;
    width: 100%;
    height: 100%;
    line-height: 30px;
}
.geolocation-search-input .reset-button .stw-search-clear {
    display: none;
}
.geolocation-search-input .reset-button.active .stw-search-general {
    display: none;
}
.geolocation-search-input .reset-button.active .stw-search-clear {
    display: block;
}
.geolocation-search-input .results-container {
    position: absolute;
    top: 30px;
    width: 100%;
    height: auto;
    max-height: 200px;
    overflow: hidden;
}
.geolocation-search-input .results-list {
    position: relative;
    width: 100%;
    height: auto;
}
.geolocation-search-input .result-entry {
    position: relative;
    display: block;
    width: calc(100% - 5px);
    height: 40px;
}
.geolocation-search-input .result-entry .marker {
    position: absolute;
    left:0px;
    top:0px;
    width: 40px;
    height: 40px;
    line-height: 40px;
}
.geolocation-search-input .result-entry .display-name,
.geolocation-search-input .result-entry .address {
    position: absolute;
    top:0px;
    left: 40px;
    height: 20px;
    width: calc(100% - 56px);
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.geolocation-search-input .result-entry .address {
    top: 20px;
}


/* --- /styles/geolocation.css--- */ 

.geolocation-map .selector-flag {
    display: none;
}
.geolocation-subscriber-marker {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 60px;
    height: 90px;
    opacity: 0;
}
.geolocation-subscriber-marker.with-picture-set {
    opacity: 1;
}
.geolocation-subscriber-marker .selector-flag {
    display: none;
    position: absolute;
    top: 12px;
    left: 1px;
    width: 100%;
    height: 100%;
    padding-right: 3px;
    z-index: 2;
}
.geolocation-map.with-role-icons .geolocation-subscriber-marker.with-role-icon .selector-flag {
    top: 47px;
    left: 66px;
}
.geolocation-subscriber-marker.selected .selector-flag {
    display: block;
}
.geolocation-subscriber-marker .high-speed-tracking.shadow {
    display: none;
    position: absolute;
    font-size: 24px;
    bottom: 18px;
    left: 30px;
    color: white;
}
.geolocation-subscriber-marker .high-speed-tracking .stw-lightning.content {
    top: 2px;
    left: 3px;
    font-size: 17px;
    position: absolute;
    color: #39B54A;
}
.geolocation-subscriber-marker.offline .stw-lightning.content {
    color: #888888;
}
.geolocation-subscriber-marker.high-speed-tracking-enabled .high-speed-tracking {
    display: block;
}
.geolocation-simple-marker {
    position: relative;
    width: 44px;
    height: 64px;
    overflow: hidden;
    z-index: 2;
}
.leaflet-marker-icon .geolocation-simple-marker {
    position: absolute;
    bottom: 6px;
    left: calc(-6px - 100%);
    cursor: default !important;
}
.geolocation-simple-marker .foreground-pin {
    position: absolute;
    top: 3px;
    left: -5px;
}
.geolocation-simple-marker .middle-background {
    position: absolute;
    width: 21px;
    height: 24px;
    top: 6px;
    left: 11px;
}
.geolocation-simple-marker .background-pin {
    font-size: 65px;
    position: absolute;
    top: 14px;
    left: 14px;
    width: 100%;
    height: 100%;
}
.geolocation-simple-marker .background-pin::before {
    position: absolute;
    top: -15px;
    left: -25px;
    width: 100%;
    height: 100%;
    text-align: center;
}
.geolocation-subscriber-marker .border-pin {
    font-size: 90px;
    position: absolute;
    top: -2px;
    left: -17px;
    width: 100%;
    height: 100%;
    text-align: center;
}
.geolocation-subscriber-marker .background-pin {
    font-size: 80px;
    position: absolute;
    top: 1px;
    left: -12px;
    width: 100%;
    height: 100%;
    text-align: center;
}
.geolocation-subscriber-marker .background-pin .hole-cover {
    font-size: 30px;
    position: absolute;
    top: 13px;
    left: 27px;
}
.geolocation-subscriber-marker .subscriber-picture {
    position: absolute;
    top: 7px;
    left: 8px;
    width: 40px;
    height: 40px;
}
.geolocation-subscriber-marker .subscriber-picture .no-image{
    width: 40px;
    height: 40px;
    line-height: 40px;
}

.geolocation-subscriber-marker .subscriber-picture img {
    width: 100%;
}
.geolocation-subscriber-marker .role-icon img {
    width: 44px;
    height: 44px;
    border-radius: 22px;
    cursor: pointer;
}
.geolocation-subscriber-marker .availability {
    position: absolute;
    top: 5px;
    right: 10px;
    width: 14px;
    height: 14px;
    z-index: 2;
}
.geolocation-map.with-role-icons .geolocation-subscriber-marker.with-role-icon .availability {
    right: -57px;
    top: 32px;
}
.geolocation-map .leaflet-map-pane .geolocation-subscriber-marker {
    top: -81px;
    left: -23px;
}
.geolocation-map .leaflet-map-pane .dispatcher-pin-marker {
    top: -57px;
    left: -25px;
}
.geolocation-map .leaflet-draw-tooltip {
    display: none;
}
.geolocation-map .gm-style .geolocation-subscriber-marker {
    top: -85px;
    left: -25px;
}
.geolocation-map .gm-style .geoloc-itinerary-marker {
    width: 40px;
    height: 40px;
    position: relative;
    font-size: 40px;
    top: 20px;
}
.geolocation-map .gm-style .geoloc-itinerary-marker.corner-anchor {
    left: 11px;
    top: 1px;
}
.geolocation-map .leaflet-map-pane .geoloc-itinerary-marker.corner-anchor {
    margin-left: -2px !important;
    margin-top: -40px !important;
}
.geolocation-map .leaflet-map-pane .geolocation-marker-cluster {
    position: relative;
    margin-left: -24px !important;
    margin-top: -24px !important;
}
.geolocation-map .leaflet-map-pane .geolocation-marker-cluster > div {
    position: absolute;
    left :0px;
    top: 0px;
    display: block;
    width: 100%;
    height: 100%;
}
.geolocation-search .search-field {
    position: relative;
    height: 30px;
    width: calc(100% - 175px) !important;
    float:left;
}
.geolocation-search #pac-input {
    z-index: 0;
    width: 100% !important;
    position: relative;
}
.geolocation-search .geolocation-controls {
    float: left;
    height: 30px;
}
.geolocation-contacts  {
    position: absolute;
    top: 0px;
    height: calc(100% - 136px);
    width: 100%;
}
.geolocation-contacts [data-sliding-layer-level="0"] {
    height: calc(100% - 64px);
}
.geolocation-contacts .section-title {
    position: relative;
    margin: 20px;
}

.menu-left.with-geolocation .header-utils {
    width: 33.3%;
}
.geolocation-contacts .top-buttons-container {
    width: 309px;
    height: 40px;
    margin-left: 20px;
    margin-bottom: 19px;
    display: flex;
    justify-content: space-evenly;
}
.geolocation-contacts .top-buttons-container button {
    max-width: 23%;
    height: 40px;
    border: none;
    flex: 1;
    margin-left: 10px;
}
.geolocation-contacts .top-buttons-container button:first-child {
    margin-left: 0;
}
.geolocation-tabs {
    position: relative;
    margin-top: 10px;
    height: calc(100% - 98px);
}
.geolocation-tabs .tab-content,
.geolocation-tabs .tab-pane {
    height: 100%;
}
.geolocation-tabs .nav-tabs li {
    width: 25%;
    line-height: 34px;
    display: block;
    height: 40px;
}
.geolocation-tabs.no-tracking-rules .nav-tabs li {
    width: 33%;
}
.geolocation-tabs.no-tracking-rules li[data-role=tab-tracking-rules] {
    display: none;
}
.geolocation-tabs .nav-tabs li a {
    padding: 0;
    vertical-align: middle;
    display: inline-block;
    line-height: normal;
    padding-bottom: 2px;
    font-size: 26px;
}
.geolocation-tabs .tab-dispatch-groups {
    font-size: 33px !important;
}
.geolocation-contacts-filters {
    position: relative;
    margin-top: 8px;
    margin-bottom: 8px;
    padding-left: 20px;
}
.geolocation-contacts-filters #subscriber.filter-type,
.geolocation-contacts-filters #group.filter-type,
.geolocation-contacts-filters #only_available.filter-type {
    margin-top: 0;
    margin-right: 5px;
    float: left;
}

.geolocation-contacts .contact-user.no-data .name,
.geolocation-contacts .contact-user.no-data .distance-location,
.geolocation-contacts .contact-user.streaming-on .name,
.geolocation-contacts .contact-user.streaming-on .distance-location {
    width: 164px;
}

.geolocation-contacts .contact-user .video-streaming {
    width: 30px;
    height: 32px;
    position: absolute;
    top: 19px;
    right: 62px;
    display: none;
}

.geolocation-contacts .contact-user .video-streaming.streaming-on {
    display: block;
}
.geolocation-contacts .contact-user .video-streaming.streaming-on .stw-icon:after {
    display: inline-block;
    content: " ";
    width: 12px;
    height: 12px;
    position: absolute;
    top: 2px;
    left: -6px;
}
.geolocation-contacts .contact-user .video-streaming.before-no-data {
    right: 81px;
}
.geolocation-contacts .contact-item [data-role=visibility-on],
.geolocation-contacts .contact-item [data-role=visibility-off] {
    width: auto;
    height: 40px;
}
.geolocation-contacts .contact-item [data-role=visibility-on] {
    display: none;
}
.geolocation-contacts .contact-item [data-role=visibility-off] {
    display: block;
}
.geolocation-contacts .contact-user.visibility-off [data-role=visibility-on] {
    display: block;
}
.geolocation-contacts .contact-user.visibility-off [data-role=visibility-off] {
    display: none;
}
.geolocation-contacts .contact-group.visibility-off .controls-block > .visibility-button [data-role=visibility-on] {
    display: block;
}
.geolocation-contacts .contact-group.visibility-off .controls-block > .visibility-button [data-role=visibility-off] {
    display: none;
}
.geolocation-contacts #tab-contacts .no-results{
    display: none;
}
.geolocation-contacts .contact-item .expand-controls {
    display: none;
    margin-left: 0 !important;
    height: 41px;
    width: 20px;
    line-height: 41px;
}
.geolocation-contacts .contact-item.slider-item .expand-controls {
    display: block;
}
.geolocation-contacts .contact-item .expand-controls span {
display: inline-block;
}
.geolocation-contacts .contact-item.expanded .expand-controls span {
    transform: rotate(90deg);
}
.geolocation-contacts .contact-item .group-image {
    flex-shrink: 0;
}
.geolocation-contacts .contact-item.sub-item {
    padding-left: 8px;
}
.marker-selection {
    height: 40px;
    width: 40px;
    float: left;
    margin-right: 5px;
}
.draw-rectangle {
    height: 40px;
    width: 40px;
    float: left;
    margin: 0 0 0 5px;
}
.toggle-traffic {
    height: 40px;
    width: 40px;
    float: left;
    margin-right: 5px;
}
.history-export,
.history-locations {
    height: 28px;
    width: 28px;
    float: left;
}
.refresh-container {
    float: left;
}
.refresh-locations {
    height: 28px;
    width: 28px;
    float: left;
}
.refresh-container .refresh-locations {
    margin: 0 auto;
    float: none;
    height: 30px;
    width: 30px;
} 
#refresh-locations-all {
    height: 40px;
    width: 40px;
}
#info-content {
    width: auto;
    /*margin-left: 25px;*/
}
#info-content table {
    margin-top: 10px;
    width: 100%;
}
.not-visible {
    display: none;
}
#info-content .option-button {
    display: block;
    margin: 0;
    width: 100%;
    max-width: 100%;
    z-index: 2;
}
#info-content .option-text {
    display: block;
    width: auto;
    height: auto;
}
.user-info-details > span {
    display: block;
    margin-top: 5px;
}
.user-info-details .text {
    margin-top: 0px;
}
.user-accuracy.user-info-details {
    float: left;
    margin-right: 5px;
    width:50%;
}
.battery-network-status .network-indication {
    line-height: 19px;
}
.battery-network-status .battery-indication {
    text-align: right;
}
.status-labels {
    font-size: 13px;
}
.battery-network-details {
   padding-top:5px;
}
.battery-network-details span {
    padding-right: 4px;
}
.battery-details,
.network-details {
    float: left;
    width: 50%;
}
.info-controls {
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 10px;
}
.info-controls > div {
    width: calc(100% / 3);
    margin-top: 10px;
}
.info-controls #set-visibility-on {
    display: none;
}
.info-controls #set-visibility-off {
    display: block;
}
.info-controls.visibility-off #set-visibility-on {
    display: block;
}
.info-controls.visibility-off #set-visibility-off {
    display: none;
}

@media (max-height: 600px) {
    .info-controls > div {
        width: calc(100% / 4);
        margin-top: 10px;
    }
    .info-controls .option-text {
        display: none !important;
    }
}
@media (max-height: 500px) {
    .info-controls > div {
        width: calc(100% / 5);
        margin-top: 10px;
    }
}
#info-content .info-controls span:not(.stw-icon) {
    padding-top: 30px;
    display: block;
}
#info-content .refresh-container span {
    padding-top: 5px;
    display: block;
}
#info-content .info-controls .option-row span {
    padding-top: 0;
    text-align: left;
}
#info-content #video-streaming span,
#info-content .option-button.refresh-container span {
    padding: 0;
    margin-top: 0px;
}
#info-content #video-streaming.streaming-on .stw-icon {
    position: relative;
}
#info-content #video-streaming.streaming-on .stw-icon:after {
    display: inline-block;
    content: " ";
    width: 14px;
    height: 14px;
    position: absolute;
    top: 0;
    left: -7px;
}
.overlay-marker {
    width: 56px;
    height: 80px;
    position: absolute;
    cursor: pointer;
}
.overlay-marker.available,
.overlay-marker.busy {
    height: 80px !important;
}
.overlay-marker img {
    width: 42px;
    height: 42px;
    margin-top: 7px;
    margin-left: 7px;
}
.overlay-marker > div {
    width: 14px;
    height: 14px;
    position: absolute;
    right: 2px;
    top: 5px;
}
.pac-container.search-location {
    padding-bottom: 10px;
    height: auto !important;
    opacity: 1 !important;
}
.pac-container.search-location .pac-item span {
    width: auto !important;
    overflow: visible !important;
}
#geolocation-info .modal-sm {
    width: 400px;
}
#geolocation-info ul {
    padding: 0;
    margin-top: 15px;
}
#geolocation-info ul li {
	list-style:none; /* if you’re not already using a reset */
}
#geolocation-info ul li:before {
    margin-right: 8px;
    position: relative;
    top: -1px;
    width: 8px;
    height: 8px;
    display: inline-block;
}
#geolocation-info .modal-footer {
    margin-top: 0;
    padding-top: 0;
}
#geolocation-info button {
    width: 100px;
    font-weight: bold;
}
#geolocation-info .modal-body {
    padding-bottom: 0;
}
.user-last-update {
    width: 60%;
    float: right;
    height: 20px;
    line-height: 20px;
    border-radius: 3px;
    text-align: center;
}
.geolocation-contacts-sliding-layer {
    width: 351px;
    height: 100%;
    position: absolute;
    top: 64px;
    left: -351px;
    z-index: 1000;
}
.geolocation-contacts-sliding-layer .audioclip-text {
    display: none !important;
}
.geolocation-contacts-sliding-layer.with-logo {
    top: 279px;
}
.geolocation-contacts-sliding-layer .top-bar {
    width:100%;
    position: relative;
}
.geolocation-contacts-sliding-layer .top-bar.subscriber-history,
.geolocation-contacts-sliding-layer .top-bar.cug-group {
    height: 80px;
}
.geolocation-contacts-sliding-layer .top-bar > div.arrow:first-child {
    width: 42px;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
}
.geolocation-contacts-sliding-layer .top-bar.display-group {
    height: 40px;
    line-height: 40px;
}
.geolocation-contacts-sliding-layer .search-box.display-group-edit {
    margin-bottom: 45px;
}
.geolocation-contacts-sliding-layer .top-bar .arrow span {
    width: 30px;
    height: 30px;
    display: block;
    left: calc(50% - 15px);
    top: calc(50% - 15px);
    position: absolute;
}
.geolocation-contacts-sliding-layer .top-bar .content {
    width: calc(100% - 42px);
    height: 100%;
    position: absolute;
    left: 42px;
    display: flex;
}
.geolocation-contacts-sliding-layer .top-bar .group-data {
    width: 185px;
    height: 100%;
    position: relative;
    flex-grow: 1;
    left: 0px;
}
.geolocation-contacts-sliding-layer .top-bar .group-image {
    position: absolute;
    left: 13px;
    top: calc(50% - 21px);
}
.geolocation-contacts-sliding-layer .top-bar .group-name,
.geolocation-contacts-sliding-layer .top-bar .subscribers-names {
    position: absolute;
    left: 63px;
    top: 14px;
    width: calc(100% - 63px);
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    white-space: nowrap;
}
.geolocation-contacts-sliding-layer.no-subscriber-names .top-bar .group-name,
.geolocation-contacts-sliding-layer.no-subscriber-names .top-bar .subscribers-names {
    top: 30px;
}
.geolocation-contacts-sliding-layer.no-subscriber-names .top-bar .edit-button {
    display: none !important;
}
.geolocation-contacts-sliding-layer .top-bar .group-data.multi-select-on .group-name {
    left: 10px;
    width: calc(100% - 10px);
}
.geolocation-contacts-sliding-layer .top-bar .group-data.multi-select-on .subscribers-names {
    left: 10px;
}
.geolocation-contacts-sliding-layer .top-bar .subscribers-names {
    top: 41px;
}
.geolocation-contacts-sliding-layer .top-bar .contact-features {
    height: 100%;
    position: relative;
    flex-shrink: 0;
    text-align: center;
    white-space: nowrap;
    margin-right: 5px;
}
.geolocation-contacts-sliding-layer .top-bar .contact-features .call-controls {
    display: flex;
}
.geolocation-contacts-sliding-layer .top-bar .call-controls .join-button-container {
    display: none;
    margin-top: 25px;
}
.geolocation-contacts-sliding-layer .top-bar .call-controls .voip-push-to-talk {
    margin-top: 17px;
}
.geolocation-contacts-sliding-layer .top-bar .call-controls.with-join-button .join-button-container {
    display: block;
}
.geolocation-contacts-sliding-layer .top-bar .call-controls.with-join-button.join-call .voip-push-to-talk {
    display: none;
}
.geolocation-contacts-sliding-layer .contact-features .details-options {
    width: 30px;
    height: 40px;
    position: relative;
    display: inline-block;
    vertical-align: top;
    margin-top: 25px;
    float: none;
    line-height: 40px;
    text-align: center;
    font-size: 23px;
}
.geolocation-contacts-sliding-layer .contact-features .popover {
    left: auto;
    right: -30px;
    top: 70px;
    z-index: 100;
    min-width: 140px;
}
.geolocation-contacts-sliding-layer .with-filters .search-box {
    width: calc(100% - 140px);
}
.geolocation-contacts-sliding-layer #renderer-container {
    position: relative;
}
.geolocation-contacts-sliding-layer #renderer-container .no-results {
    position: absolute;
    top: 40px;
    width: 100%;
    left: -21px;
}
.geolocation-contacts-sliding-layer .search-box {
    margin-top: 15px;
    margin-right: 20px;
    margin-bottom: 10px;
}
.geolocation-contacts-sliding-layer .top-bar .action-name {
    height: 40px;
    line-height: 40px;
    padding-left: 10px;
}
.geolocation-contacts-sliding-layer .no-records {
    width: 100%;
    text-align: center;
    position: absolute;
    top: 200px;
    display: none;
}
div.mark-selected {
    width: 42px;
    height: 42px;
    position: absolute;
    top: 6px;
    left: 6px;
}
.no-geolocation {
    width: 15px;
    height: 19px;
    position: absolute;
    top: 18px;
    right: 60px;
    display: block;
}
.no-geolocation.no-update {
    top: 21px;
}
.no-geolocation.no-app {
    width: 17px;
    height: 20px;
    float: right;
}
.distance-location span {
    display: block;
    height:13px;
}
.geolocation-bar {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 70px;
    display: none;
}
.geolocation-bar .buttons-container {
    float: right;
}
.geolocation-bar span {
    float: left;
    padding-left: 20px;
    line-height: 32px;
}
.geolocation-bar button {
    height: 32px !important;
    vertical-align: top !important;
    margin-right: 20px;
}
.geolocation-bar .bar {
    margin-top: 20px;
    width: 100%;
    height: 32px;
}
/* DISPLAY GROUPS */
.geolocation-display-group-step-title {
    width: 100%;
}
.geolocation-display-group-step-title .step,
.geolocation-display-group-step-title .title {
    position: relative;
    display: inline-block;
    height: 20px;
    line-height: 20px;
    padding: 0px;
}
.geolocation-display-group-step-title .step {
    width: 20px;
    height: 20px;
    text-align: center;
    margin-left: 20px;
    margin-top: 12px;
}
.geolocation-display-group-step-title .title {
    margin: 20px 0 0 20px;
}
.geolocation-display-group-form {
    width: 100%;
    height: 100%;
    position: relative;
}
.geolocation-display-group-form .name-field {
    position: relative;
    height: 30px;
    width: calc(100% - 194px) !important;
    float: left;
    margin-right: 20px;
}
.geolocation-display-group-form .display-group-members-area {
    margin-top: 22px;
    width: 100%;
    height: calc(100% - 168px);
    padding-left: 17px;
}
.geolocation-display-group-form .display-group-controls {
    position: absolute;
    bottom: 0px;
    width: 100%;
    height: 70px;
}
.geolocation-display-group-form .display-group-controls .bar {
    margin-top: 16px;
    height: 32px;
    width: 100%;
}
.geolocation-display-group-form .display-group-controls .bar button {
    margin-right: 10px;
}
.geolocation-display-group-form .display-group-controls .buttons-container {
    float: right;
    margin-right: 10px;
}
.geolocation-display-group-form .display-group-controls .bar span {
    float: left;
    margin-left: 20px;
}
.geolocation-display-group-form .conversation-contacts {
    position: relative;
}
.geolocation-display-group-form .conversation-contacts .name {
    position: absolute;
    top: 20px;
    left: 60px;
}
.geolocation-display-group-list .contact-item {
    width: 100%;
    height: 62px;
}
.geolocation-display-group-list .contact-item .name {
    top: 6px;
}
.geolocation-display-group-list .edit-button {
    position: absolute;
    left: 75px;
    top: 35px;
    height: 13px;
    width: auto;
    padding-left: 17px;
}
.geolocation-contacts-sliding-layer .details-button {
    width: auto;
    padding-left: 24px
}
.geolocation-display-group-list .multi-select-controls {
    display: none;
}
.geolocation-display-group-list.multi-select-on {
    padding-top: 40px;
}
.geolocation-display-group-list.multi-select-on .checkbox-container {
    display: block;
}
.geolocation-display-group-list.multi-select-on .edit-button,
.geolocation-display-group-list.multi-select-on .new-conversation,
.geolocation-display-group-list.multi-select-on .visibility-button,
.contact-user.multi-select-on .visibility-button {
    display: none;
}
.geolocation-display-group-list.multi-select-on .multi-select-controls {
    display: block;
    position: absolute;
    top: 0px;
    height: 40px;
    width: 100%;
}
.geolocation-display-group-list .multi-select-controls button {
    width:50%;
    height: 100%;
    border: none;
    display: inline-block;
    float: left;
}
.geolocation-contacts-sliding-layer .top-bar .edit-button {
    display: inline !important;
    position: relative !important;
    height: auto;
    width: auto;
    padding-left: 17px;
}
.geolocation-contacts-sliding-layer .top-bar .details-button {
    display: inline !important;
}
.display-group-members-area .no-records {
    width: 100%;
    text-align: center;
    margin-top: 100px;
}
.geolocation-tabs .tab-content {
    padding-top: 40px;
}
.geolocation-tabs .tab-content #preloader-loading-mask {
    top: 40px;
}
.geolocation-tabs .multi-select-controls {
    display: none;
    position: absolute;
    top: 40px;
    width: 100%;
    height: 40px;
    padding-left: 20px;
    padding-right: 20px;
    text-align: right;
}
.geolocation-tabs .multi-select-controls button {
    width: auto;
    height: 38px;
    line-height: 38px;
    display: inline-flex;
    float: right;
    text-align: left;
}
.geolocation-tabs .multi-select-controls button span {
    margin-right: 5px;
    display: inline-block;
    line-height: 38px;
}
.geolocation-tabs .multi-select-controls button#cancel {
    position: absolute;
    left: 20px;
}
.geolocation-tabs .multi-select-controls button:last-child {
    float: right;
}
.geolocation-tabs .multi-select-controls .popover {
    left: auto;
    right: 20px;
    top: 35px;
}
.geolocation-tabs.multi-select-on .tab-content {
    padding-top: 80px;
}
.geolocation-tabs.multi-select-on .checkbox-container {
    display: block;
}
.geolocation-tabs.multi-select-on .contact-options-button,
.geolocation-tabs.multi-select-on .contact-item .expand-controls,
.geolocation-tabs.multi-select-on .contact-item .sub-items,
.geolocation-tabs.multi-select-on .contact-item .visibility-button {
    display: none;
}
#geolocation-left-container .contact-item #loading {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
}
.multi-select-on .no-geolocation {
    right: 27px;
}
.geolocation-tabs.multi-select-on .edit-button,
.geolocation-tabs.multi-select-on .new-conversation,
.geolocation-tabs.multi-select-on .distance-location {
    display: none;
}
.geolocation-multi-select-item {
    width: 100%;
    height: 50px;
    padding-left: 20px;
    padding-top: 5px;
}
.geolocation-multi-select-item .name {
    height: 40px;
    width: 86%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.modal-dialog.geolocation-multi-select .modal-body {
    padding: 0px;
}
#geolocation-left-container {
    width: 351px;
    float: left;
    position: absolute;
    padding: 0px;
    display: none;
    z-index: 3;
}
#geolocation-left-container .checkbox-container {
    margin-top: 13px;
    margin-right: 8px;
}
#geolocation-left-container .chat-messages {
    width: 350px;
}
#geolocation-left-container .contact-item .controls-block {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
}
#geolocation-left-container .contact-item.expanded {
    display: flex;
    flex-direction: column;
    height: auto;
    padding-bottom: 0;
}
#geolocation-left-container .sub-items {
    display: none;
    padding-left: 30px;
    margin-top: 10px;
}
#geolocation-left-container .contact-item.expanded .sub-items {
    display: block;
}
#geolocation-left-container .contact-item.multi-select-on .expand-controls {
    display: none;
}
#geolocation-left-container .multi-select-on
#geolocation-left-container .contact-item .user-operational-status-container {
    position: relative;
    left: 5px;
    cursor: default;
    display: block;
}
#geolocation-left-container .contact-item[data-hidden-by-filter],
#geolocation-left-container .contact-item[data-hidden-by-search],
#geolocation-left-container .contact-item[data-hidden-by-favorite] {
    display: none !important;
}
.search-field.disabled-control {
    width: calc(100% - 170px) !important;
    position: absolute;
    display:  none;
}
.subscriber-data .name{
    line-height: 18px;
    font-weight: bold;
}
.subscriber-data .name span {
    display: block;
    line-height: 16px;
    font-weight: normal;
    width: 140px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.subscriber-data {
    background-color: transparent !important;
    margin-top: 9px;
}
.subscriber-data .contact-features {
    height: 40px;
}
.subscriber-data .contact-features .webchat-conversation {
    margin-top: 0;
    height: 40px;
    width: 30px;
    float: right;
}
.subscriber-data .contact-features .export-history-csv {
    margin-top: 0;
    height: 40px;
    width: 30px;
    float: right;
}
.subscriber-data .feature-free-call {
    margin-top: 0px !important;
    height: 38px !important;
    width: 20px;
}
.subscriber-data .name {
    width: 140px;
}
.subscriber-data .contact-features .voip-call {
    margin-top: 0;
    background-position: center center;
}
.contact-item.history {
    padding: 0 20px;
}

.user-last-update.user-info-details,
.user-location.user-info-details,
.user-status.user-info-details {
    max-width: 287px;
}
#info-content .user-name {
    flex-grow: 1;
    margin-left: 10px;
}

.info-controls {
    /* max-width: 240px;*/
}
.geolocation-chat-window {
    width: 100%;
    height: auto;
    position: relative;
}
.geolocation-chat-window .availability-info {
    height: 30px;
    padding-left: 5px !important;
    padding-right: 5px !important;
    z-index: 1000;
    cursor: pointer;
}
.geolocation-chat-window .availability-info .info-text {
    display: block;
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 40px;
    padding-left: 11px;
    line-height: 25px !important;
}
.geolocation-chat-window .availability-info .info-icon {
    display: block;
    top: 5px;
    right: 15px;
}
.geolocation-chat-window .availability-info:hover .info-icon {
    display: none;
}
.geolocation-chat-window .availability-info:hover .info-text {
    height: auto;
    white-space: normal;
}
.geolocation-chat-window .message-alert-mode-on,
.geolocation-chat-window .message-alert-mode-off {
    width: 350px !important;
}
.geolocation-chat-window .message-alert-mode-off .recipient-stopped-alert,
.geolocation-chat-window .message-alert-mode-off .recipient-alert {
    width:245px !important;
}
.geolocation-contacts-sliding-layer .recipient-details {
    position: relative;
    flex-grow: 1;
    height: 100%;
    top: 0px;
    left: 0px;
}
.geolocation-contacts-sliding-layer .recipient-details .entity-image {
    position: absolute !important;
    left: 7px;
    top: 20px;
}
.geolocation-contacts-sliding-layer .recipient-details .entity-detail-name,
.geolocation-contacts-sliding-layer .recipient-details .entity-detail-secondary {
    position: absolute;
    top: 23px;
    left: 56px;
    margin: 0px !important;
    width: calc(100% - 56px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.geolocation-contacts-sliding-layer .recipient-details .entity-detail-secondary {
    top: 41px;
}
.map-spinner-container {
    position: absolute;
    z-index: 1;
    top: 124px;
    right: 0;
    width: 100%;
}
.map-spinner {
    display: none;
    height: 60px;
    padding: 10px;
    width: 100%;
}
.map-spinner .spinner-loader {
    width: 30px;
    height: 30px;
    margin-top: 5px;
}
.map-spinner .spinner-text {
    margin-left: 10px;
    min-width: 105px;
    line-height: 15px;
    width: 94%;
    height: 40px;
    display: table;
}
.map-spinner .spinner-text div{
    display: table-cell;
    vertical-align: middle;
}

.updates-report-container {
    width: 100%;
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
}
.updates-report {
    display: none;
    padding: 5px 10px;
    width: 100%;
}
.update-report-close {
    width: 12px;
    height: 15px;
    cursor: pointer;
}
.update-report-text {
  padding-right: 18px;
  max-width: 97%;
}
.marker-info .address {
    width: 256px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.distance-location {
    display: block;
    top: 2px;
    position: relative;
    left: 5px;
}
.distance-location span {
    display: block;
    line-height: 11px;
}
.top-buttons-container .tooltip-inner {
    white-space: normal;
}
.entity-detail-name {
    margin-top: 25px;
    margin-left:50px;
}
.end-date {
    margin-top: 20px;
}
.start-date-input,
.end-date-input {
    position: relative;
    width: 170px;
    float: left;
}
.start-date-group,
.end-input-group {
    position: relative;
}
#date-time-interval-picker.modal {
    z-index: 1055;
}
.date-picker-popup input {
    width: 170px;
    min-width: 170px;
    cursor: pointer;
}
.calendar {
    display: block;
    width: 20px;
    height: 20px;
    position: absolute;
    right: 5px;
    top: 5px;
}
.to-select,
.from-select {
    width: 110px;
    float: right;
}
#date-time-interval-picker .modal-dialog {
    width: 370px;
}
#date-time-interval-picker select {
    width: 100% !important;
    height: 30px;
    padding-left: 5px;
    /*My custom style for fonts*/
}
select::-ms-expand { display: none; }
#date-time-interval-picker .sw-button {
    width: 100px;
}
#date-time-interval-picker .sw-button#close {
    float: left;
}
#date-time-interval-picker label {
    margin-left: 5px;
}
#location-history-tooltip {
    float: right;
}
.history-info {
    width: 300px;
    float:left;
    display: block;
}
.date-picker-popup {
    margin-top: 20px;
}

.datepicker-dropdown.datepicker-orient-left:before {
    left: 94px !important;
}
.datepicker-dropdown.datepicker-orient-left:after {
    left: 95px !important;
}
.start .marker {
    height: 42px;
    width: 42px;
    margin-top: 15px;
}
.end .marker {
    width: 42px;
    height: 42px;
    margin-bottom: 15px;
}

.drawing-marker {
    float: left;
    width: 42px;
}
.marker-info {
    float: left;
    height: 61px;
    margin-left: 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.start .marker-info,
.end .marker-info {
    height: 75px;
}
.intermediate .top,
.intermediate .end,
.start .end,
.end .top {
    height: 18px;
    width: 3px;
    margin: 0 auto;
}
.intermediate .marker {
    width: fit-content;
    min-width: 26px;
    height: 26px;
    padding: 2px 5px;
    margin: 0 auto;
    line-height: 16px;
}
.subscriber-data .contact-features .voip-call {
    margin-top: 0;
}
.geolocation-contacts .subscriber-details .info-row {
    padding:5px;
}
.geolocation-contacts .subscriber-details .image {
    float:none;
    margin:auto;
}
.geolocation-contacts .subscriber-details .info-title {
    margin-top:20px;
}
.geolocation-contacts .subscriber-details .info-subscriber {
    width:100%;
    margin-left:0px;
}
.geolocation-contacts .subscriber-details .info-subscriber .info-row .email {
    width:100%;
    padding-bottom: 10px;
}
.geolocation-contacts .subscriber-details .info-subscriber .info-row .position {
    padding-left:0px;
    width:100%;
}
.geolocation-contacts .subscriber-details .details {
    padding:30px 30px 0px 30px;
}
.in-small-container .location img {
    width: 100% !important;
}

.geolocation-contacts-sliding-layer .location .attachment-thumbnail,
.geolocation-contacts-sliding-layer .location .attachment-thumbnail img,
.geolocation-contacts-sliding-layer .location .waiting-attachment .attachment-thumbnail,
.geolocation-contacts-sliding-layer .location .waiting-attachment .attachment-thumbnail img {
    width : 296px !important;
    height: 93px !important;
}
.geolocation-contacts-sliding-layer .multiple.location .attachment-thumbnail,
.geolocation-contacts-sliding-layer .multiple.location .attachment-thumbnail img,
.geolocation-contacts-sliding-layer .multiple.location .waiting-attachment .attachment-thumbnail img {
    width : 248px !important;
}
.geolocation-contacts-sliding-layer .message-container.multiple.location .attachment {
    width: 300px;
}

.geolocation-contacts-sliding-layer .locations .attachment-thumbnail,
.geolocation-contacts-sliding-layer .locations .attachment-thumbnail img,
.geolocation-contacts-sliding-layer .locations .waiting-attachment .attachment-thumbnail,
.geolocation-contacts-sliding-layer .locations .waiting-attachment .attachment-thumbnail img {
    width : 296px !important;
    height: 93px !important;
}
.geolocation-contacts-sliding-layer .multiple.locations .attachment-thumbnail,
.geolocation-contacts-sliding-layer .multiple.locations .attachment-thumbnail img,
.geolocation-contacts-sliding-layer .multiple.locations .waiting-attachment .attachment-thumbnail img {
    width : 248px !important;
}
.geolocation-contacts-sliding-layer .message-container.multiple.locations .attachment {
    width: 300px;
}
.geolocation-contacts-sliding-layer .message-container.news,
.geolocation-contacts-sliding-layer .message-container.link,
.geolocation-contacts-sliding-layer .message-container.youtube {
    min-width: 295px !important;
}
.geolocation-contacts-sliding-layer .message-container.multiple.news,
.geolocation-contacts-sliding-layer .message-container.multiple.link,
.geolocation-contacts-sliding-layer .message-container.multiple.youtube {
    min-width: 246px !important;
    width: 246px !important;
}
.geolocation-contacts-sliding-layer .youtube .attachment-thumbnail a:after {
    width: 60px !important;
    height: 60px !important;
    background-size: 100% !important;
}
.geolocation-contacts-sliding-layer .attachment-title {
    max-width: 150px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.geolocation-contacts-sliding-layer .news .attachment-thumbnail,
.geolocation-contacts-sliding-layer .link .attachment-thumbnail,
.geolocation-contacts-sliding-layer .youtube .attachment-thumbnail {
    width: 60px !important;
    height: 60px !important;
    overflow: hidden;
}
.geolocation-contacts-sliding-layer .link-url,
.geolocation-contacts-sliding-layer .attachment-description .description {
    max-width: 194px !important;
    white-space: normal;
}
.geolocation-contacts-sliding-layer .multiple .link-url,
.geolocation-contacts-sliding-layer .multiple .attachment-description .description {
    max-width: 160px !important;
}
.geolocation-contacts-sliding-layer .quit-info {
    width: 70%;
}

.geolocation-contacts-sliding-layer .message-container.locations .attachment-thumbnail,
.geolocation-contacts-sliding-layer .message-container.location .attachment-thumbnail {
    height: 120px !important;
}
.geolocation-contacts-sliding-layer .location .waiting-attachment .attachment-thumbnail:after,
.geolocation-contacts-sliding-layer .with-attachment.message-container.location .attachment-thumbnail:after {
    width: 296px !important;
    height: 93px !important;
}

.process-conversation-layer .attachment-text,
.geolocation-contacts-sliding-layer .attachment-text {
    width: 55%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.geolocation-contacts-sliding-layer .address-search .group-name {
    left: 7px;
    top: 15px;
}
.geolocation-contacts-sliding-layer .message-container.with-attachment.locations .attachment,
.geolocation-contacts-sliding-layer .message-container.with-attachment.location .attachment {
    height: 120px !important;
}
.geolocation-contacts-sliding-layer .message-container.video-conference .attachment,
.geolocation-contacts-sliding-layer .message-container.video-conference .attachment-file-name {
    min-width: 0;
}
.geolocation-contacts-sliding-layer .message-container.video-conference .attachment-title,
.geolocation-contacts-sliding-layer .message-container.video-conference .attachment-message {
    line-height: 12px !important;
    white-space: normal;
    word-break: break-word;
}
.info-controls .conversation-options-button {
    margin-top: 0px !important;
}
#subscriber-details-slider .conversation-options-button,
#subscriber-details-slider .conversation-options-button.feature-walkie-talkie,
#subscriber-details-slider .conversation-options-button.feature-free-call {
    float: none;
}
#info-content .conversation-options-button.feature-free-call.disabled-control span {
    cursor: pointer !important;
}
.history-index {
    width: fit-content;
    min-width: 30px;
    height: 30px;
    float: left;
    padding: 2px 5px;
    margin: 0 auto;
    text-align: center;
    line-height: 22px;
}
.history-content {
    text-overflow: ellipsis;
    overflow: hidden;
    padding: 0 20px 20px;
}

.history-info-window {
   /* width: 245px; */
}
.history-info-content {
   /* margin-left:10px */
}
.mouseover .history-info-content {
    margin: 0;
}
.left-arrow {
    width: 20px;
    height: 24px;
    cursor: pointer;
    float: left;
}
.right-arrow {
    width: 20px;
    height: 24px;
    cursor: pointer;
    float: right;
}

.close-info {
    right: 7px !important;
}
.name-field {
    margin: 0 0 15px 15px;
}
.geolocation-display-group-step-title {
    margin-bottom: 15px;
}
#save-button .button_ok {
    width: 35px;
    height: 30px;
    display: block;
    position: absolute;
    right: 0;
    top: 0;
}
.geolocation-display-group-form #save-button {
    min-width: 146px;
    position: relative;
    height: 30px;
    padding-right: 47px;
}
.name-reset {
    display: none;
}
#contacts-selected {
    margin: 10px 0;
    display: none;
}
/* required to show the popup menu under the google dialogs */
.gm-style-iw {
    overflow: visible !important;
}
.refresh-locations.spinner {
    cursor: default;
}
.info-content-visible {
    padding: 15px 15px 0px 15px;
}
.info-content-toggle {
    margin: 0 15px;
    padding-bottom: 15px;
}
.info-content-toggle.no-border, .info-device.no-border {
    border-bottom: none;
}
.info-content-visible .user-availability {
    width: 37%;
    float: left;
    height: 20px;
    line-height: 20px;
    text-align: center;
}
.info-device{
    margin: 0 15px;
    overflow: hidden;
    padding-top: 10px;
}
.battery-network-status {
    padding: 8px 0;
    line-height: 24px;
    display: flex;
    width: 100%;
}
.battery-network-status > div {
    display: flex;
    width: 33.33%;
}
.battery-network-status span {
    margin-right: 7px;
}
.battery-network-status span:last-child {
    margin-right: 0;
    line-height: 19px;
}
.battery-network-status .stw-signal-strength-wifi-0,
.battery-network-status .stw-battery-level-0 {
    text-align: left;
    display: block;
}
.toggle-content {
    position: absolute;
    width: 15px;
    height: 15px;
    right: 10px;
    top: 10px;
    cursor: pointer;
}
.info-content-title {
    position: relative;
    display: flex;
}
.info-content-title .toggle-content {
    position: relative;
    top: 5px;
    margin-left: 10px;
    left: 0;
    flex-shrink: 0;
}
.info-content-title [data-role="close"] {
    margin: 2px;
}
.history-content .location,
.history-content .speed,
.history-content .accuracy,
#info-content .location {
    margin-top: 0px !important;
}
#info-content .user-location .old-location,
#info-content .user-geolocation .old-location {
    height: 17px;
    line-height: 28px;
    display: inline-block;
    padding-right: 26px;
    margin-top: 0px;
    width: 21px;
}
.user-accuracy .status-labels {
    position: relative;
    bottom: 6px;
}
.geolocation-contacts .subscriber-details .wt-supervisor .info-title {
    margin-top: 0;
}
.location-share-dialog .modal-dialog {
    width: 600px !important;
}
.location-share-dialog .modal-footer {
    display: flex;
    justify-content: space-between;
    margin-top: 0px;
    padding-top: 0px;
}
.location-share-dialog .modal-footer > * {
    flex-grow: 1;
    padding: 10px 0;
}
.location-share-dialog textarea {
    margin: 15px 0;
}
.location-share-dialog #open-url,
.location-share-dialog #copy-url,
.location-share-dialog #share-email {
    width: 30%;
}
.location-share-dialog #open-url {
    margin-left: 0;
}
.location-share-dialog .modal-footer {
    text-align: left;
}
.no-visible {
    padding: 0;
    height: 1px;
    overflow: hidden;
    margin:0 !important;
}
.can-copy-message {
    height: 30px;
}
.geolocation-contacts-sliding-layer .contact-title.filters {
    float: left;
    margin-left: 20px;
    margin-bottom: 10px;
}
#old-alert-location-bar {
    display: none;
}
#old-alert-location-bar .close {
    display: inline-block;
    width: 16px;
    height: 16px;
}
#old-alert-location-bar .refresh-location {
    display: none;
}
#itinerary-exporting-container * {
    margin-top: 0px !important;
}
.geolocation-exporting-options.for-itinerary {
    width: auto;
}
.geolocation-chat-window .chat-messages .ps-scrollbar-y-rail {
    right: 0px !important;
}

.geolocation-notification-toaster {
    width: auto !important;
    max-width: 700px;
}
.geolocation-notification-toaster .toaster-message {
    width: auto !important;
}
.geolocation-notification-toaster .toaster-message i.notification-date {
    display: block;
}

#geolocation-left-container .section-title.with-geolocation-status-filter .call-out-button[data-page="geolocation"] {
    right: 10px;
}
#geolocation-left-container .geolocation-status-filter-button {
    position: absolute;
    top: 5px;
    right: 25px;
    width: 25px;
    height: 25px;
    line-height: 25px;
}
.geolocation-status-filter-menu {
    position: relative;
    width: auto;
    min-width: 280px;
    height: auto;
}
.geolocation-status-filter-menu .status-title {
    width: 100%;
    height: 30px;
    line-height: 30px;
}
.geolocation-status-filter-menu .statuses-list {
    width: 100%;
    height: auto;
    max-height: calc(100% - 600px);
    overflow: auto;
}
.geolocation-status-filter-menu .statuses-list .option {
    width: 100%;
    height: 25px;
    line-height: 25px;
    display: block;
}
.geolocation-status-filter-menu .statuses-list .option .customized-checkbox {
    margin-right: 5px;
}
.geolocation-status-filter-menu .buttons-container {
    width: 100%;
    height: 30px;
    line-height: 30px;
    margin-top: 5px;
    margin-bottom: 5px;
    display: flex;
    justify-content: space-between;
}
.geolocation-status-filter-menu .buttons-container button {
    width: auto;
    min-width: 100px;
}
.geolocation-notification-toaster .toaster-message {
    line-height: 1.8;
}
.notifications-panel.geolocation-notifications-disabled [data-tab="geolocation"] {
    display: none !important;
}
.geolocation-contacts .favorites-container:has(.contact-item) {
    margin-bottom: 10px;
}
.subscriber-detail.no-contacts:after {
    content: "" !important;
}

/* --- /styles/geolocation-info-window.css--- */ 

.geolocation-info-window-container {
    display: none;
    position: absolute;
    top: 80px;
    right: 10px;
    z-index: 999;
    padding: 10px;
}
.geolocation-info-window {
    position: relative;
    width: auto;
    height: auto;
}
.geolocation-info-window .info-container,
.geolocation-info-window .controls-container {
    position: relative;
    width: auto;
    height: auto;
    display: block;
}
.geolocation-info-window .controls-container {
    display: flex;
    padding: 0 5px;
}
.geolocation-info-window .control {
    position: relative;
    width: auto;
    min-width: 60px;
    height: auto;
    min-height: 60px;
    display: inline-block;
}
.geolocation-info-window .info-container .content-block, .geolocation-info-window .color-picker-container .color-picker-header {
    position: relative;
    width: 100%;
    height: auto;
    display: block;
}
.geolocation-info-window.dispatcher-pin {
    width: 250px;
}
.geolocation-info-window.dispatcher-pin .close-button {
    position: absolute;
    top: -5px;
    right: 0px;
    z-index: 1;
}
.geolocation-info-window.dispatcher-pin .info-container {
    margin: 0 10px 10px 10px;
}
.geolocation-info-window .info-container .content-block.name {
    margin-top: 5px;
    width: calc(100% - 16px);
}
.geolocation-info-window .poi-name {
    margin-bottom: 5px;
}
.geolocation-info-window .info-container .content-block .name-edit {
    display: none;
}
.geolocation-info-window .info-container .content-block .edit-control {
    line-height: 20px;
}
.geolocation-info-window .info-container .content-block.name.edit-mode .name-edit {
    display: flex;
}
.geolocation-info-window .info-container .content-block .name-display {
    display: flex;
    width: calc(100% - 20px);
}
.geolocation-info-window .info-container .content-block.name.edit-mode .name-display {
    display: none;
}
.geolocation-info-window .info-container .content-block .name-display .name {
    height: 30px;
    margin-right: 15px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.geolocation-info-window .info-container .content-block .name-edit input {
    width: 100%;
    min-width: 0px;
}
.geolocation-info-window .info-container .content-block .name-edit button {
    height: 29px;
    line-height: 17px;
}
.geolocation-info-window .controls-container .control[data-role='set-visibility-on'] {
    display: none;
}
.geolocation-info-window .controls-container .control[data-role='set-visibility-on'] .text {
    margin-top: 1px;
}
/* INPUT WITH COUNTER */
.geolocation-info-window .container-for-input-with-counter {
    position: relative;
    margin-right: 5px;
}
.geolocation-info-window .container-for-input-with-counter input {
    padding-right: 50px;
    padding-left: 10px;
}
.geolocation-info-window .container-for-input-with-counter span {
    display: none;
    position: absolute;
    right: 15px;
}
.geolocation-info-window .container-for-input-with-counter input + span {
    bottom: 6px;
}
.geolocation-info-window .container-for-input-with-counter input:focus + span {
    display: inline;
}
.color-picker-background {
    margin: 0;
    padding: 0;
}

.color-picker-button-area {
    text-align: center;
    margin-top: 0px;
    margin-bottom: 5px;
}

/* --- /styles/geolocation-reporting.css--- */ 

.geolocation-reporting-options {
    width: auto;
    min-height: 30px;
}
.info-content.tracking .geolocation-reporting-options {
    margin-top: 10px !important;
}
.popup-geolocation-reporting .geolocation-reporting-options {
    top: 25px;
    right: -44px;
    left: auto;
}
.geolocation-reporting-options .option-row {
    display: block !important;
    height: 30px;
    line-height: 30px;
}
.geolocation-reporting-options .option-row .stw-icon {
    display: inline-block;
    margin-right: 5px;
    width: 20px;
}
.geolocation-reporting-options .arrow {
    position: absolute;
    width: 20px;
    height: 8px;
    left: auto !important;
    right: 44px;
    top: -11px !important;
}
.info-controls .geolocation-reporting-options .arrow {
    right: 80px;
}
.geolocation-reporting-map-trigger .geolocation-reporting-options {
    left: calc(50% - 8px);
    top: auto;
}
.geolocation-reporting-daily-dialog,
.geolocation-reporting-weekly-dialog,
.geolocation-reporting-itinerary-dialog,
.geolocation-settings-reporting-dialog{
    width: 340px;
}

.geolocation-reporting-weekly-dialog .modal-body > table {
    border-collapse: separate;
    border-spacing: 0px 8px;    
}
.geolocation-reporting-daily-dialog .modal-footer,
.geolocation-reporting-weekly-dialog .modal-footer,
.geolocation-reporting-itinerary-dialog .modal-footer,
.geolocation-settings-reporting-dialog .modal-footer {
    padding: 0px 20px 15px;
    margin: 0px;
}
.geolocation-reporting-daily-dialog .modal-footer button,
.geolocation-reporting-weekly-dialog .modal-footer button,
.geolocation-reporting-itinerary-dialog .modal-footer button,
.geolocation-settings-reporting-dialog .modal-footer button{
    width: 100px;
}
.geolocation-reporting-itinerary-dialog .action-text,
.geolocation-settings-reporting-dialog .action-text{
    display: inline;
}
.geolocation-reporting-daily-dialog .date-input,
.geolocation-reporting-weekly-dialog .date-input {
    width: 150px !important;
    float: right;
}
.geolocation-reporting-itinerary-dialog .date-input,
.geolocation-settings-reporting-dialog .date-input{
    width: 150px !important;
}
.geolocation-reporting-itinerary-dialog td.time,
.geolocation-settings-reporting-dialog .td.time{
    width: 100px;
}
.geolocation-reporting-itinerary-dialog .time-input,
.geolocation-settings-reporting-dialog .time-input{
    width: 100% !important;
    min-width: 140px;
    padding-left: 5px;
    height: 30px;
}
.geolocation-reporting-weekly-dialog #end-date {
    opacity: 0.5;
}
.geolocation-reporting-daily-dialog label,
.geolocation-reporting-weekly-dialog label,
.geolocation-reporting-itinerary-dialog label,
.geolocation-settings-reporting-dialog label{
    margin-top: 5px;
}
.geolocation-reporting-daily-dialog table,
.geolocation-reporting-weekly-dialog table,
.geolocation-reporting-itinerary-dialog table,
.geolocation-settings-reporting-dialog table{
    width: 100%;
}
.geolocation-reporting-daily-dialog .info,
.geolocation-reporting-weekly-dialog .info,
.geolocation-reporting-itinerary-dialog .info,
.geolocation-settings-reporting-dialog .info{
    float: right;
}
.geolocation-reporting-daily-dialog .message-area-wrapper,
.geolocation-reporting-weekly-dialog .message-area-wrapper,
.geolocation-reporting-itinerary-dialog .message-area-wrapper,
.geolocation-settings-reporting-dialog .message-area-wrapper{
    min-height: 34px;
    margin-top: 10px;
}
.geolocation-reporting-itinerary-dialog table {
    border-spacing: 5px;
    border-collapse: separate;
}
.geolocation-reporting-daily-dialog .label-container {
    top: 60%;
}
.geolocation-reporting-weekly-dialog .label-container {
    top: 65%;
}
.geolocation-reporting-slider .contact-features {
    width: auto !important;
    left: auto !important;
    top: 0px;
}
.geolocation-reporting-slider .contact-features table {
    width: 100%;
    position: absolute;
    bottom: 0px;
}
.geolocation-reporting-slider .contact-features td {
    width: 30%;
}
.geolocation-reporting-slider .contact-features .details-options {
    width: 30px;
    float: right;
    margin-top: 20px !important;
}
.geolocation-exporting-options.itinerary-export {
    width: 170px;
}
.geolocation-exporting-options .option-row {
    height: 30px; 
}
.geolocation-exporting-options .option-row span {
    white-space: nowrap;
    display: inline-block;
    top: 5px;
    line-height: 22px;
    padding-left: 23px;
}
.geolocation-exporting-options .option-row span:last-child {
    left: 24px;
}
.geolocation-exporting-options .download-as-csv,
.geolocation-exporting-options .download-as-pdf {
    width: auto;
}
.geolocation-reporting-summary-group {
    margin: 20px 0;
    padding: 5px;
    padding-top: 15px;
    position: relative;
}
.geolocation-reporting-summary-group .summary-group-label {
    position: absolute;
    width: auto;
    height: 20px;
    top: -10px;
    left: -5px;
    padding-left: 5px;
    padding-right: 10px;
    z-index: 2;
    line-height: 20px;
}
.geolocation-reporting-summary-group table {
    width: 100%;
}
.geolocation-reporting-summary-group th,
.geolocation-reporting-summary-group td {
    vertical-align: top;
    width: 30%;
}
.geolocation-reporting-summary-group .two-columns th,
.geolocation-reporting-summary-group .two-columns td {
    width: 50%;
}
.geolocation-reporting-summary-group .separator {
    width: 100%;
    height: 1px;
    margin-top: 10px;
    margin-bottom: 10px;
}
.geolocation-reporting-no-data {
    width: 100%;
    margin-top: 50px;
    padding-top: 50px;
    padding-bottom: 50px;
}
.summary-details .geolocation-reporting-no-data,
.geolocation-reporting-trips-list .geolocation-reporting-no-data {
    margin-top: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 5px;
}
.geolocation-reporting-date-block,
.geolocation-reporting-date-range-block {
    margin: 5px 0px 10px;
    text-align: center;
    height: 25px;
    position: relative;
}
.geolocation-reporting-date-block {
    height: 29px;
}
.geolocation-reporting-date-block .date,
.geolocation-reporting-date-range-block .date-range {
    display: inline-block;
    width: auto;
}
.geolocation-reporting-date-range-block .date-range {
    margin-top: 3px;
}
.geolocation-reporting-slider #renderer-container-reporting {
    padding: 10px;
    padding-right: 25px;
    height: 100%;
}
.geolocation-reporting-slider #renderer-container-reporting.history-data {
    padding: 0;
}

.geolocation-reporting-weekday-buttons {
    height: 50px;
    width: 100%;
    white-space: nowrap;
}
.geolocation-reporting-weekday-buttons .weekday-button {
    width: 13%;
    margin-left: 0.3%;
    margin-right: 0.2%;
    display: inline-block;
    height: 100%;
    position: relative;
}
.geolocation-reporting-weekday-buttons .weekday-letter {
    text-align: center;
    font-size: 16px;
}
.geolocation-reporting-weekday-buttons .weekday-short-date {
    position: absolute;
    bottom: 0px;
    width: 100%;
}
.geolocation-reporting-trips-list {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}
.geolocation-reporting-trips-list .trips-list-table {
    min-width: 100%;
    max-width: none;
    width: auto !important;
}
.geolocation-reporting-trips-list th,
.geolocation-reporting-trips-list td {
    padding: 10px;
    text-align: center;
}
html, body {
    height: 100%;
}
.geolocation-reporting-trips-list .trips-list-table {
    width: 100% !important;
}
.geolocation-reporting-trips-list .dataTables_scrollHead,
.geolocation-reporting-trips-list-multiple .dataTables_scrollHead {
    min-height: 56px;
}
.geolocation-reporting-trips-list .dataTables_wrapper {
    height: 100%;
}
.geolocation-reporting-trips-list .dataTables_scroll {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.geolocation-reporting-trips-list .dataTables_scrollBody {
    padding-bottom: 12px;
}
.geolocation-reporting-trips-list .ps-scrollbar-x-rail {
    bottom: 0;
}
.geolocation-reporting-week-blank-state {
    width: 360px;
    height: 330px;
    position: absolute;
    left: calc(50% - 180px);
    padding: 20px;
    top: 200px;
}
.geolocation-reporting-week-blank-state .help-message {
    width: 100%;
    margin-top: 25px;
}
.geolocation-reporting-week-blank-state .bar-container {
    width: 100%;
    height: 130px;
    position: absolute;
    left: 0px;
    bottom: 0px;
}
.geolocation-reporting-slider table {
    width: 100%;
    border-collapse: collapse;
}
.geolocation-reporting-slider td {
    width: auto;
    vertical-align: middle;
}
.geolocation-reporting-slider .contact-features {
    position: relative !important;
}
.geolocation-reporting-slider .icon-container {
    width: 60px;
    height: 100%;
    min-width: 60px;
}
.geolocation-reporting-slider .icon-container .entity-image {
    position: absolute !important;
    top: 20px;
    left: 10px;
}
.geolocation-reporting-slider .details-container {
    width: 148px;
    min-height: 20px;
}
.geolocation-reporting-slider .details-container .title {
    position: relative !important;
    left: 0px;
    margin: 0px !important;
    width: 100%;
    top: 6px !important;
}
.geolocation-reporting-slider .action-type {
    margin-top: 4px;
    white-space: nowrap;
    width: 150px;
    text-overflow: ellipsis;
    overflow: hidden;
}
.geolocation-reporting-slider .progress-indicator,
.geolocation-reporting-slider .progress-indicator-bg {
    position: absolute;
    left: 0px;
    top: -5px;
    width: 0%;
    height: 2px;
}
.geolocation-reporting-slider .progress-indicator-bg {
    width: 100%;
}
.geolocation-reporting-slider #loading {
    position: absolute;
    top: 51px;
}
.geolocation-contacts-sliding-layer .details-button {
    margin-left: -5px;
}
.geolocation-reporting-collapsible .title-bar {
    position: relative;
    height: 20px;
    padding-left: 5px;
    padding-right: 20px;
    margin-left: 10px;
}
.geolocation-contacts-sliding-layer .title-bar label {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.geolocation-reporting-collapsible .title-bar .arrow {
    position: absolute;
    width: 12px;
    height: 20px;
    left: -10px;
    top: 0px;
}
.geolocation-reporting-collapsible .content {
    display: block;
}
.geolocation-reporting-collapsible.collapsed .content {
    display: none !important;
}
.geolocation-reporting-collapsible .trips-status {
    display: inline-block;
    white-space: nowrap;
}
.geolocation-reporting-collapsible .trips-count-label,
.geolocation-reporting-collapsible .trips-count {
    display: inline-block;
}
.geolocation-reporting-collapsible .title-bar {
    width: calc(100% - 20px);
}
.geolocation-reporting-collapsible .title-bar .data-status {
    width: 20px;
    height: 20px;
    display: none;
    position: absolute;
    right: 0px;
    top: 0px;
}
#right-container-geoloc-reporting {
    z-index: 4 !important;
}
#right-container-geoloc-reporting .geolocation-reporting-collapsible .title-bar {
    padding-left: 15px;
    margin-bottom: 10px;
}
#right-container-geoloc-reporting .geolocation-reporting-collapsible .arrow {
    left: 0px;
}
.geolocation-reporting-trips-list-multiple {
    padding-top: 15px;
    height: 100%;
}
.geolocation-reporting-trips-list-multiple .multiple-selection-entry,
.team-report-container .multiple-selection-entry,
.team-summary.collapsed {
    margin-bottom: 10px;
}
.geolocation-reporting-team-report-header {
    padding: 10px;
}
#geolocation-reporting-slider-multiple #renderer-container {
    padding: 0;
}
#geolocation-reporting-slider-multiple .itinerary-subscriber {
    padding: 5px 20px;
}
#geolocation-reporting-slider-multiple .itinerary-subscriber:last-of-type {
    margin-bottom: 20px;
}
#geolocation-reporting-slider-multiple .itinerary-subscriber-name {
    display: inline-block;
    padding: 2px 5px;
    max-width: 230px;
}
#geolocation-reporting-slider-multiple .itinerary-subscriber .visibility,
#geolocation-reporting-slider-multiple .itinerary-subscriber .arrow {
    width: 20px;
    height: 20px;
    float: right;
    display: none;
}
#geolocation-reporting-slider-multiple .itinerary-subscriber.has-data .visibility,
#geolocation-reporting-slider-multiple .itinerary-subscriber.has-data .arrow {
    display: inline;
}
#geolocation-reporting-slider-multiple .itinerary-subscriber .visibility .glyphicon {
    top: 3px;
}
#geolocation-reporting-slider-multiple .itinerary-subscriber .no-data-label,
#geolocation-reporting-slider-multiple .itinerary-subscriber .not-trackable-label,
#geolocation-reporting-slider-multiple .itinerary-subscriber .not-installed-label,
#geolocation-reporting-slider-multiple .itinerary-subscriber .error-label {
    display: none;
    float: right;
    width: 20px;
    height: 20px;
}
#geolocation-reporting-slider-multiple .itinerary-subscriber.no-data .no-data-label {
    display: inline;
}
#geolocation-reporting-slider-multiple .itinerary-subscriber.not-trackable .not-trackable-label {
    display: inline;
}
#geolocation-reporting-slider-multiple .itinerary-subscriber.not-installed .not-installed-label {
    display: inline;
}
#geolocation-reporting-slider-multiple .itinerary-subscriber.error .error-label {
    display: inline;
}
#geolocation-reporting-slider-multiple,
#geolocation-reporting-slider {
    z-index: 100;
}
.multiple-selection-entry.not-trackable .not-trackable-label,
.multiple-selection-entry.not-installed .not-installed-label,
.multiple-selection-entry.no-data .no-data-label {
    display: block;
}
.history-info-title {
    padding: 5px 15px;
}
.history-arrows {
    float: right;
    margin-top: 3px;
    width: 40px;
}
.geolocation-reporting-slider .tracking-rule-container {
    width: 100%;
    height: auto;
}
.geolocation-reporting-slider .tracking-rule-container.subscriber {
    margin-top: 10px;
    margin-bottom: 10px;
}
.geolocation-reporting-slider .tracking-rule-container > div {
    width: 100%;
    height: auto;
    display: block;
}
.geolocation-reporting-slider .tracking-rule-container .rule-name [data-role=info] {
    position: absolute;
    margin-left: 10px;
}
.geolocation-reporting-slider .tracking-rule-container.name-only {
    margin-top: 10px;
    margin-bottom: 0px !important;
    padding-left: 5px;
}
.geolocation-reporting-slider .load-more-button {
    display: block;
    position: relative;
    margin: auto;
    width: auto;
    height: 30px;
    line-height: 30px;
    padding: 0 15px 0 15px;
}


/* --- /styles/geolocation-reports.css--- */ 

.geolocation-reports-left-area {
    position: absolute;
    top: 117px;
    height: calc(100% - 117px);
    width: 351px;
    left: calc((100% - 1260px) / 2);
    z-index: 100;
    display: none;
}
body.with-logo .geolocation-reports-left-area {
    top: 260px;
    height: calc(100% - 260px);
}
.layout-util-full-screen .geolocation-reports-left-area {
    left: 0;
}
.geolocation-reports-right-area {
    display: none;
    position: absolute;
    top: 54px;
    left: calc((100% - 1260px) / 2 + 351px);
    width: 909px;
    height: calc(100% - 54px);
    z-index: 4;
}
.layout-util-full-screen .geolocation-reports-right-area {
    left: 350px;
    width: calc(100vw - 350px);
}
.geolocation-reports-slide .sliding-layer-content {
    display: flex;
    flex-direction: column;
}
.geolocation-reports-slide .overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 2;
    text-align: center;
    padding-top: 100px;
    display: none;
}
.geolocation-reports-slide .preloader {
    position: sticky;
    top: 0;
    width: 100%;
    height: 30px;
    line-height: 30px;
    flex-shrink: 0;
    display: none;
}
.geolocation-reports-slide .preloader.visible {
    display: flex;
}
.geolocation-reports-slide .scroll-container {
    position: relative;
    width: 100%;
    overflow: hidden;
    overflow-y: auto;
    flex-grow: 1;
}
.geolocation-reports-slide .reports-container {
    width: 100%;
    position: relative;
    height: auto;
}
.geolocation-reports-slide .spinning-wheel {
    width: 29px;
    height: 28px;
    margin-left: 10px;
    margin-right: 10px;
}
.geolocation-reports-slide .report-item {
    display: flex;
    flex-direction: column;
    width: 350px;
    padding-right: 15px;
    height: auto;
    min-height: 60px;
}
.geolocation-reports-slide .report-item .body-row {
    display: flex;
}
.geolocation-reports-slide .report-item #loading {
    position: absolute;
}
.geolocation-reports-slide .report-item .details-row {
    height: 0;
    transition: max-height .2s;
    overflow: hidden;
    width: 350px;
    padding-right: 10px;
}
.geolocation-reports-slide .report-item.expanded .details-row {
    height: auto;
}
.geolocation-reports-slide .report-item .control span {
    display: inline-block;
}
.geolocation-reports-slide .report-item.expanded .control[data-role=details] span {
    transform: rotate(90deg);
}
.geolocation-reports-slide .report-item .icon-block {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    padding-top: 10px;
    padding-left: 10px;
}
.geolocation-reports-slide .report-item .info-block {
    flex-grow: 1;
    width: calc(100% - 60px - 60px);
}
.geolocation-reports-slide .report-item .report-title {
    width: 100%;
    height: 20px;
    line-height: 20px;
    margin-top: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.geolocation-reports-slide .report-item .controls-block {
    display: flex;
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    opacity: 1;
    cursor: default;
    justify-content: flex-end;
}
.geolocation-reports-slide .controls-block > div {
    width: 20px;
    height: 100%;
    line-height: 60px;
    text-align: center;
}
.geolocation-reports-slide .geolocation-contacts {
    position: relative;
    height: auto;
    width: 325px;
    margin-left: 5px;
}
.geolocation-reports-slide .geolocation-reporting-summary-group td,
.geolocation-reports-slide .geolocation-reporting-summary-group th {
    white-space: normal;
}
.geolocation-reports-right-area .geolocation-reporting-trips-list,
#right-container-geoloc-reporting .geolocation-reporting-trips-list {
    overflow: auto;
}
.geolocation-reports-right-area .geolocation-reporting-trips-list thead {
    position: sticky;
    top: -1px;
}
.geolocation-reports-right-area .cta-message {
    position: absolute;
    text-align: center;
    font-size: 16px;
    display: block;
    width: 50%;
    left: 25%;
    top: 300px;
}

/* --- /styles/geolocation-toolbar.css--- */ 

.geolocation-toolbar {
    display: flex;
    position: absolute;
    top: 0px;
    width: 100%;
    height: 60px;
}
.geolocation-toolbar .geolocation-search-input-container {
    flex-grow: 1;
}
.geolocation-toolbar .geolocation-toolbar-buttons {
    display: flex;
    padding: 10px 8px;
}
.geolocation-toolbar .geolocation-toolbar-buttons > * {
    margin: 0 2px;
}
.geolocation-toolbar .geolocation-toolbar-buttons .stw-icon {
    display: inline-block;
    width: 40px;
    height: 40px;
}
.geolocation-toolbar .geolocation-toolbar-buttons .role-icon-button .stw-icon {
    width: 54px;
}
.geolocation-toolbar .disablement-mask {
    display: none;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 2;
}
.geolocation-toolbar .refresh-locations-button .stw-icon {
    height: 30px !important;
    width: 30px !important;
}
.geolocation-toolbar .refresh-locations-button {
    height: 30px;
    width: 30px;
    margin: 5px 7px;
}
.geolocation-toolbar .dispatcher-pins-button {
    display: none;
}
.geolocation-toolbar .role-icon-button {
    display: none;
}

/* --- /styles/geolocation-actions-bar.css--- */ 

.geolocation-actions-bar {
    display: flex;
    position: relative;
    top: 0px;
    left: 0px;
    width: 100%;
    min-height: 60px;
    height: auto;
    padding-right: 45px;
}
.geolocation-actions-bar .title-container {
    position: relative;
    display: inline-block;
    flex-grow: 1;
    width: auto;
    height: 100%;
}
.geolocation-actions-bar .title-container .title {
    position: relative;
    display: inline-block;
    width: 100%;
    height: 30px;
    margin-top: 15px;
    margin-left: 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.geolocation-actions-bar .actions-container {
    position: relative;
    display: inline-block;
    width: auto;
    height: 100%;
}
.geolocation-actions-bar .sw-button.feature-disabled {
    cursor: default;
    opacity: 0.7;
    display: inline-block;
}
.geolocation-actions-bar .not-available-for-selection.feature-disabled,
.geolocation-actions-bar .not-available-for-selection {
    display: none;
}
.geolocation-actions-bar .sw-button {
    height: 30px;
    margin-top: 15px;
    margin-right: 10px;
}


/* --- /styles/geolocation-address-picker.css--- */ 

.geolocation-address-picker .modal-dialog {
    width: 900px;
    max-width: 900px;
    height: 600px;
}
.geolocation-address-picker .modal-content {
    height: 600px;
}
.geolocation-address-picker .modal-body {
    width: 100%;
    height: calc(100% - 45px);
    padding: 0px;
}
.geolocation-address-picker #select-location-button {
    position: absolute;
    bottom: 20px;
    right: 20px;
    z-index: 400;
}
.geolocation-address-picker .search-input-container {
    position: absolute;
    top: 10px;
    right: 20px;
    width: 300px;
    height: 30px;
    overflow: visible;
    z-index: 400;
}
.geolocation-address-picker .map-container {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
}
.geolocation-address-picker .leaflet-icon {
    margin-top: -53px;
    margin-left: -22px;
}
.geolocation-address-picker .modal-title {
    width: calc(100% - 25px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.geolocation-address-picker .message-bar {
    display: none;
    position: absolute;
    top: calc(50% - 20px);
    left: 0px;
    width: 100%;
    height: auto;
    padding-top: 15px;
    padding-bottom: 15px;
    z-index: 1000;
}
.geolocation-address-picker .message-bar .text {
    position: relative;
    width: 100%;
    height: auto;
    line-height: 20px;
    text-align: center;
    z-index: 2;
    text-transform: none !important;
}
.geolocation-address-picker .message-bar .background {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    opacity: 0.8;
}

/* --- /styles/geolocation-page.css--- */ 

.geolocation-page {
    display: none;
    position: absolute;
    top: 54px;
    left: calc((100% - 910px + 352px) / 2);
    width: 909px;
    height: calc(100% - 54px);
    z-index: 3;
}
.geolocation-page .geolocation-toolbar .geolocation-search-input-container {
    padding-top: 16px;
    padding-left: 16px;
}
.geolocation-page .map-container,
.geolocation-page .itinerary-map-container,
.geolocation-page .map-preloader,
.geolocation-page .progress-bar-container {
    position: absolute;
    top: 60px;
    left: 0px;
    width: 100%;
    height: calc(100% - 60px);
    z-index: 1;
}
.geolocation-page .map-container {
    display: none;
}
body[data-selected-menu-item="menu-item-geolocation"] .geolocation-page .map-container {
    display: block;
}
.geolocation-page .itinerary-map-container {
    display: none;
    z-index: 2;
}
.geolocation-page .map-preloader {
    z-index: 2;
    display: block;
}
.geolocation-page .map-preloader .message {
    position: absolute;
    top: 50%;
    width: 100%;
    height: 40px;
    text-align: center;
}
.geolocation-page .progress-bar-container {
    z-index: 2;
    display: none;
}
.geolocation-page .progress-bar {
    position: absolute;
    top: 50%;
    width: calc(100% - 200px);
    margin-left: 100px;
    height: 20px;
}
.geolocation-page .ui-progressbar-value {
    margin: 0;
}
.geolocation-page .toolbar-container {
    position: absolute;
    top: 0px;
    width: 100%;
    height: auto;
    overflow: visible;
    z-index: 2;
}
.geolocation-page .actions-bar-container {
    position: absolute;
    bottom: 0px;
    width: 100%;
    height: auto;
    overflow: visible;
    z-index: 2;
}
.geolocation-page .info-window-container {
    display: none;
    position: absolute;
    top: 80px;
    right: 10px;
    width: 290px;
    z-index: 4;
}
.geolocation-page .info-window-container .info-content {
    display: flex;
    flex-direction: column;
}
.geolocation-page .info-window-container .info-content-toggle {
    flex-grow: 1;
    max-height: calc(100vh - 480px);
    min-height: 60px;
    overflow-x: hidden;
    overflow-y: auto;
}
.geolocation-page .data-refresh-container {
    position: absolute;
    top: 60px;
    width: 100%;
    height: auto;
    z-index: 5;
}
.geolocation-page .data-refresh-container .spinning-wheel {
    width: 29px;
    height: 28px;
    display: none;
}
.geolocation-page .data-refresh-container .background {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 1;
}
.geolocation-page .refresh-status-bar,
.geolocation-page .outdated-location-bar {
    display: none;
}
.geolocation-page .outdated-location-bar,
.geolocation-page .refresh-status-bar,
.geolocation-page .refresh- {
    position: relative;
    z-index: 2;
}
.geolocation-page .refresh-status-bar .flex-content,
.geolocation-page .outdated-location-bar .flex-content {
    display: flex;
    align-items: center;
}
.geolocation-page .outdated-location-bar .flex-content {
    padding-right: 36px;
}
.geolocation-page .refresh-status-bar .flex-content .spinner-container,
.geolocation-page .outdated-location-bar .flex-content .spinner-container {
    padding: 10px;
}
.geolocation-page .refresh-status-bar .message,
.geolocation-page .outdated-location-bar .message {
    padding: 10px;
    flex-grow: 1;
}
.geolocation-page .refresh-status-bar .spinning-wheel {
    display: block;
}
.geolocation-page .refresh-status-bar .close,
.geolocation-page .outdated-location-bar .close,
.geolocation-page .refresh-summary-entry .close {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 36px;
    height: 36px;
}
.geolocation-page .outdated-location-bar .refresh-button {
    width: 36px;
}
.geolocation-page .outdated-location-bar.refresh-in-progress {
    min-height: 50px;
}
.geolocation-page .outdated-location-bar.refresh-in-progress .spinning-wheel {
    display: block 
}
.geolocation-page .outdated-location-bar.refresh-in-progress .message {
    position: relative;
}
.geolocation-page .outdated-location-bar.refresh-in-progress .refresh-button {
    display: none;
}
.geolocation-page .refresh-summary-entry {
    position: relative;
    width: 100%;
    min-height: 30px;
}
.geolocation-page .refresh-summary-entry .message {
    padding: 10px;
    padding-right: 36px;
}
.geolocation-page .display-group-form-container {
    display: none;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 2;
}
.geolocation-map .geolocation-subscriber-marker .role-icon-marker {
    display: none;
}
.geolocation-map.with-role-icons .geolocation-subscriber-marker.with-role-icon .standard-marker {
    display: none;
}
.geolocation-map:not(.with-role-icons) .geolocation-subscriber-marker .role-icon-marker {
    display: none;
}
.geolocation-map.with-role-icons .geolocation-subscriber-marker.with-role-icon .role-icon-marker {
    display: block;
}
.geolocation-map .geolocation-subscriber-marker .role-icon-marker .starting-dot {
    position: absolute;
    bottom: 0px;
    left: calc(50% - 5px);
    width: 10px;
    height: 10px;
    border-radius: 5px;
}
.geolocation-map .geolocation-subscriber-marker .role-icon-marker .diagonal-line {
    position: absolute;
    bottom: 17px;
    left: calc(50% - 5px);
    width: 37px;
    height: 2px;
    transform: rotate(-45deg);
}
.geolocation-map .geolocation-subscriber-marker .role-icon-marker .horisontal-line {
    position: absolute;
    bottom: 30px;
    left: 56px;
    width: 14px;
    height: 2px;
}
.geolocation-map .geolocation-subscriber-marker .role-icon-marker .icon-border,
.geolocation-map .geolocation-subscriber-marker .role-icon-marker .icon-container {
    position: absolute;
    width: 50px;
    height: 50px;
    border-radius: 25px;
    top: 34px;
    left: 70px;
}
.geolocation-map .geolocation-subscriber-marker .role-icon-marker .role-icon {
    position: relative;
    width: calc(100% - 6px);
    height: calc(100% - 6px);
    left: 3px;
    top: 3px;
    border-radius: 50%;
}
.geolocation-map .geolocation-subscriber-marker .role-icon-marker .details-container,
.geolocation-map .geolocation-subscriber-marker .role-icon-marker .details-border {
    width: 140px;
    height: 40px;
    position: absolute;
    left: 108px;
    top: 39px;
    z-index: -1;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}
.geolocation-map .geolocation-subscriber-marker .role-icon-marker .details-border {
    position: absolute;
    width: calc(100% + 6px);
    height: 44px;
    top: -2px;
    left: -3px;
    left: -5px;
}
.geolocation-map .geolocation-subscriber-marker:hover .details-container {
    width: 140px;
}
.geolocation-map .geolocation-subscriber-marker .role-icon-marker .details-row {
    position: relative;
    width: calc(100%  - 18px);
    height: 15px;
    top: 5px;
    left: 14px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.geolocation-map .geolocation-subscriber-marker .role-icon-marker .details-row.role {
    top: 5px;
}
@media (max-width: 1260px) {
    .geolocation-page {
        left: 351px;
    }
}

/* --- /styles/channels.css--- */ 

.channels-tabs {
    position: relative;
    margin-top: 10px;
}
.channels-tabs ul {
    display: flex;
}
.channels-tabs .tab-content {
    padding-top: 1px;
    height: 100%;
}
.channels-tabs .nav-tabs li {
    width: 50%;
    display: block;
    flex: 1;
    float: none;
}
.channels-tabs .nav-tabs li a {
    padding: 0;
    vertical-align: middle;
    display: inline-block;
    line-height: normal;
    padding-bottom: 2px;
}
.channels-tabs .channels-container {
    min-height: 100px;
}
.channels-contacts .section-title {
  padding: 20px;
}
.channels-info {
    display: block;
    width: 60%;
    height: 15%;
    padding-top: 80px;
    margin: 50px auto 0;
    text-align: center;
    position: relative;
}
.channel-item {
    display: flex;
    align-items: center;
    padding: 0 20px;
}
.channel-item > * {
    flex-shrink: 0;
}
.channel-item > .info-block {
    flex-grow: 1;
    flex-shrink: 1;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-right: 5px;
    height: 100%;
}
.channel-item .name {
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    position: static;
    float: none;
}

.channel-item .title-icon{
    padding-top: 2px;
    padding-right: 0px;
}

.channel-item.selected .title-icon{
    padding-top: 4px;
    padding-right: 0px;
    font-weight: bold;
}



.join-channel {
  width: 61px;
  height: 22px;
  float: right;
  margin-top: 9px;
  cursor: pointer;
}
.channel-details-participants {
    position: relative;
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
}
.channel-details-participants .details-group-name {
    float: none;
    height: auto;
}
.participants-status {
    height: 30px;
    line-height: 16px;
    white-space: normal;
    word-break: normal;
}
.channel-details {
    float: left;
    margin-top: 10px;
    width: 720px;
}
.channel-details-modal .channel-details-participants .details-group-name {
    width: auto
}


.channel-item .title-row,
.details-group-name .title-row,
.call-banner-container .title-row{
    display: flex;
    width: 100%;
    white-space: nowrap;
}

.channel-details-participants .details-group-name .title-icon{
    padding-top: 0px;
    padding-right: 2px;
}
.call-banner-container .name .title-row .title-icon{
    float: left !important;
    padding-top: 2px;
}

.channel-details-modal .modal-dialog {
    width: auto;
    max-width: calc(100% - 50px);
    height: auto;
}
.modal-dialog .channel-details {
    width: 600px;
}
.channel-details-modal .not-attending {
    display: none;
}
.channel-details-container {
    width: 100%;
    height: calc(100% - 52px);
    overflow: hidden;
}
.channel-details-content {
    margin-left: 15px;
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    padding-top: 10px;
    height: auto;
    width: 100%;
}
.channel-details-content .conversation-contacts {
    display: flex;
}
.channel-details-content .conversation-contacts.on-hold,
.channel-details-content .conversation-contacts.no-sound {
    position: relative;
}
.channel-details-content .conversation-contacts .user-image,
.channel-details-content .conversation-contacts .user-info {
    float: none;
}
.channel-details-content .conversation-contacts .user-info {
    margin: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 200px;
}
.channel-details-content .conversation-contacts .name {
    height: 18px;
}
.channel-details-modal .channel-details-content {
    min-height: 200px;
    max-height: 500px;
    margin-left: 36px;
}
.channel-details-modal .checkbox-switcher {
    display: none;
}
.channel-details-participants .title {
    min-height: 70px;
    height: auto;
}
.modal-dialog .channel-details-participants .title {
    display: flex;
}
.group-details .group-image {
    flex-shrink: 0;
}
.channel-details-participants .checkbox-switcher {
    position: absolute;
    right: 20px;
    top: 25px;
}
.not-available {
    position: absolute;
    bottom: 6px;
    left: 4px;
    min-width: 55px;
    height: 16px;
    line-height: 16px;
    display: none;
    padding-left: 10px;
    padding-right: 10px;
}
.channel-details-content .conversation-contacts.no-sound .no-sound-label,
.channel-details-content .conversation-contacts.on-hold .on-hold-label {
    display: block;
}
.channel-details-participants .participants-status .refresh-participants {
    display: none;
    width: 20px;
    height: 20px;
    margin-left: 10px;
    margin-top: -3px;
}
.channel-details-participants .participants-status.with-refresh-button {
    display: flex;
}
.channel-details-participants .participants-status.with-refresh-button .refresh-participants {
    display: inline-block;
}

/* --- /styles/static-content.css--- */ 

/* Global CMS parameters; This is used for static content generated with WYSIWYG editor*/
.static-content {
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0px;
    z-index: 999;
}

/* TOS / PRIVACY */
.tos-privacy-container {
    height: calc(100% - 85px);
    overflow-y: scroll;
    padding-left: 30px;
    padding-right: 30px;
    margin-top: 85px;
    position: relative;
}
.tos-privacy-controls {
    position: absolute;
    z-index: 2001;
    white-space: nowrap;
    right: 10px;
    top: 18px;
}
.tos-privacy-controls * {
    display: inline-block;
    margin-left: 15px;
    height: 22px;
    line-height: 22px;
    padding: 0px 20px 0px 20px;
    min-width: 150px;
    text-align: center;
}

/* --- /styles/emergency-alert.css--- */ 

.emergency-alert-button,
.emergency-call-button {
    display: none;
    width: 40%;
    max-width: 160px;
    height: 54px;
}
.de_DE .emergency-alert-button,
.de_DE .emergency-call-button {
    min-width: 160px;
    width: auto !important;
    max-width: 300px !important;
}

.emergency-alert-button .content,
.emergency-call-button .content {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 10px;
    height: 100%;
}
.emergency-alert-button.disabled-control {
    pointer-events: auto;
}
.emergency-alert-button .stw-icon,
.emergency-call-button .stw-icon {
    flex-shrink: 0;
}
.emergency-alert-button .text,
.emergency-call-button .text {
    margin-left: 2px;
}
.emergency-alert-severity-selector {
    width: 362px;
    height: auto;
}
.emergency-alert-severity-selector .severity {
    width: 100%;
    height: 128px;
    display: block;
}
.emergency-alert-severity-selector .severity-title,
.emergency-alert-severity-selector .severity-description {
    width: 100%;
    display: block;
}

.emergency-alert-popup {
    width: 350px;
    margin: 0 !important;
}
.modal-dialog.emergency-alert-popup {
    pointer-events: auto;
}
.emergency-alert-popup .modal-content {
    padding: 10px;
}
.emergency-alert-popup .picture {
    width: 150px;
    height: 150px;
    margin: 0 auto;
}
.emergency-alert-popup .picture img {
    width: 150px;
    height: 150px;
}
.emergency-alert-popup .name {
    margin: 10px 0;
}
.emergency-alert-popup .modal-footer {
    display: flex;
    justify-content: center;
}
.emergency-alert-popup .modal-footer button {
    width: 90px;
    height: 40px;
    margin: 0 5px;
}
.message-container.with-attachment.emergencyalert,
.message-container.with-attachment.loneworker {
    display: none;
}

/* --- /styles/main-menu.css--- */ 

#main-menu-bar {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 54px;
    z-index: 1055;
}
#main-menu-bar.layout-scripts-not-loaded {
    opacity: 0;
}
#main-menu-bar .main-menu-bar-spacer {
    width: calc(50% - 630px);
    height: 54px;
    position: absolute;
    top: 0;
}
#main-menu-bar .main-menu-bar-spacer.left {
    left: 0;
}
#main-menu-bar .main-menu-bar-spacer.right {
    right: 0;
}
#main-menu-bar .main-menu-bar-content {
    display: flex;
    width: 1260px;
    height: 54px;
    margin: 0 auto;
}
#main-menu-bar .main-menu-bar-content > * {
    flex-shrink: 0;
}
#main-menu-bar .brand-logo {
    width: 138px;
    height: 66px;
}
#main-menu-bar .main-menu {
    display: flex;
}
#main-menu-bar .main-menu .menu-item {
    width: 68px;
    height: 54px;
    position: relative;
}
#main-menu-bar .main-menu .menu-item.hidden {
    display: none;
}
#main-menu-bar .main-menu .icon {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
#main-menu-bar .circle {
    display: none;
    width: auto;
    height: 24px;
    position: absolute;
    top: 5px;
    left: 40px;
    padding: 0 5px;
}
#main-menu-bar .extra-items {
    flex-grow: 1;
    flex-shrink: 1;
    display: flex;
    justify-content: center;
}
#main-menu-bar .extra-items > :not(:last-child) {
    margin-right: 1px;
}
#main-menu-bar .notifications {
    position: relative;
    display: flex;
}
#main-menu-bar .menu-item-notification {
    width: 54px;
    height: 54px;
    position: relative;
}
#main-menu-bar .menu-item-notification .arrow,
#main-menu-bar .user-info .arrow {
    position: absolute;
    width: 10px;
    height: 10px;
    top: 20px;
}
#main-menu-bar .menu-item-notification .arrow {
    right: 7px;
}
#main-menu-bar .menu-item-reach-back {
    display: none;
}
#main-menu-bar .menu-item-reach-back .arrow {
    right: 0px;
}
#main-menu-bar .menu-item-notification .circle {
    display:none;
    left: auto;
    right: 30px;
    top: 16px;
}
#main-menu-bar .menu-item-notification .icon {
    position: absolute;
    top: 7px;
    left: 16px;
}
#main-menu-bar .user-info {
    float: none;
    margin: 0;
    padding: 7px 20px 7px 10px;
    position: relative;
    width: 250px;
}
#main-menu-bar .user-info .welcome-user {
    min-width: 190px;
}
#main-menu-bar .user-info .arrow {
    right: 10px;
}
#main-menu-bar .user-menu {
    padding: 7px;
    position: absolute;
    right: 0;
    top: 59px;
    width: fit-content;
    display: none;
}
#main-menu-bar .user-menu .user-menu-left {
    padding: 6px 0 0 15px;
    width: fit-content;
    min-width: 220px;
}
#main-menu-bar .user-menu .user-menu-right {
    width: fit-content;
    min-width: 220px;
}
#main-menu-bar .selected .user-menu {
    display: flex;
}
#main-menu-bar .user-menu .top-arrow {
    display: block;
    width: 15px;
    height: 10px;
    position: absolute;
    top: -9px;
    right: 8px;
}
#main-menu-bar .user-menu .menu-item {
    display: block;
    padding: 7px 0 7px 30px;
    margin: 0 10px;
}
/* NOTIFICATION LIST */
#notification-list {
    top: 45px;
    right: -7px;
    z-index: 2000;
    position: absolute;
    width: 500px !important;
    height: auto;
    cursor: default;
}
#notification-list a {
    cursor: pointer;
}
#notification-list .header-table {
    width: 480px;
    height: auto;
    margin: 10px
}
#notification-list .top-arrow {
    display: block;
    width: 15px;
    height: 10px;
    position: absolute;
    top: -9px;
    right: 25px;
}
#notification-list .notification-row {
    display: inline-block;
    width: 480px;
    height: auto;
}
#notification-list .cell {
    height: auto;
    text-align: justify;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    width: 470px;
    padding: 5px 5px 5px 35px;
    display:table-cell;
}
#notification-list .cell p {
    margin: 0;
}
#notification-list #attachmentQuota a {
    display: inline;
}

#main-menu-bar .user-info .user-availability-flag {
    display: none;
    top: 7px;
    left: 37px;
}
#main-menu-bar .menu-item-audio-config .arrow {
    right: 0px;
}


/* --- /styles/attachments.css--- */ 

.attachment-area {
    width:100%;
    height: 46px;
    display: none;
    position: relative;
}
.attachment-icon {
    width: auto;
    height: 36px;
    margin: 4px;
    float: left;
}
.attachment-text {
    width: auto;
    max-width: calc(100% - 100px);
    height: 36px;
    line-height: 36px;
    margin: 4px;
    float: left;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.attachment-cancel {
    width: 36px;
    height: 36px;
    margin: 4px;
    float: right;
}
.attachment-disable {
    position: absolute;
    width: 100%;
    height: 300px;
    top: 0px;
    z-index: 2;
    cursor: default;
    display: none;
}
.attachment-progress {
    height: 2px;
    width: 100%;
    position: absolute;
    top: -3px;
    left: 0px;
}
.attachment-hint{
    font-weight: bold;
    margin-left: 10px;
}
.attachment {
    width: 100%;
    height: 36px;
    position: relative;

}
.message-received .attachment table {
    left: 0px;
}
.message-sent .attachment table {
    /*float: right*/
}
.attachment {
    min-height: 55px;
    width: 270px;
    height: auto;
    word-break: break-all;
    min-width: 200px;
}
.attachment-thumbnail,
.attachment-thumbnail img
{
    width: 64px;
    height: 64px;
    overflow: hidden;
    min-height: 0 !important;
}
.attachment-title {
    white-space: nowrap; 
    width: 160px; 
    overflow: hidden;
    text-overflow: ellipsis; 
}
/* audio clip related */
#progress-bar-audio {
    -webkit-appearance: none;
    display: inline-block;
    width: 90%;
    height: 2px;
    margin-top: 12px;
    border-radius: 5px;
    outline: none;
    opacity: 1;
    -webkit-transition: .2s;
    transition: opacity .2s;
    border-width: 0px;
}

#progress-bar-audio:hover {
    opacity: 1;
}
.message-container.with-attachment.clipaudio,
.message-container.with-attachment.voicemail {
    height: 45px;
    min-height: 45px;
    margin-top: 30px;
    padding-right: 40px;
}
.message-container.with-attachment.clipaudio .show-message-options,
.message-container.with-attachment.voicemail .show-message-options {
    top:8px;
}
#progress-bar-audio::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    cursor: pointer;
}
.progress-bar-audio::-moz-range-thumb {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    cursor: pointer;
}
.attachment.audio-playable {
    min-height: auto;
    height: 23px;
    width: 290px;
}
.attachment.audio-playable [data-role=play-button] {
    position: relative;
    top: 1px;
    left: 7px;
}
.attachment.audio-playable .player-controls {
    width: auto;
    display: flex;
    margin-left: 19px;
    margin-right: 3px;
}
#play-btn {
    display:inline-block;
}
.attachment .attachment-type {
    position: absolute;
    top: -32px;
    font-style: italic;
}
#end-time {
    position: relative;
    white-space: nowrap;
    margin-top: 3px;
    margin-left: 10px;
}

.message-container.locations .attachment-thumbnail img,
.message-container.location .attachment-thumbnail img {
    width: 350px;
    height: 110px;
}
.message-container.locations .attachment-thumbnail,
.message-container.location .attachment-thumbnail {
    width: 350px;
    height: 137px;
}
.message-container.with-attachment.locations .attachment,
.message-container.with-attachment.location .attachment {
    width: auto;
    height: 137px;
}
.message-received .location, 
.message-received .video,
.message-received .file,
.message-received .image {
    width: auto !important;
}
.message-container.video .attachment-thumbnail,
.message-container.image .attachment-thumbnail {
    width: auto;
    max-width: 100%;
    height: auto;
}
.message-container.video .attachment-thumbnail img,
.message-container.image .attachment-thumbnail img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
}
.message-container.link .attachment-data-sent {
    float: left;
}
.message-container.link .attachment-data-sent,
.message-container.link .attachment-data-received {
    display: flex;
}
.message-container.link .attachment-thumbnail {
    flex-grow: 0;
    flex-shrink: 0;
}
.message-container.link .attachment-description {
    flex-grow: 1;
    flex-shrink: 1;
}
.message-container .attachment-data-sent .run-diagnostic{
    margin-top: 10px;
}
.message-container.link .room-title {
    font-weight: bold;
}
.message-container.link  .attachment-title a {
    color: var(--COLOR_LEGACY_04);
}
.attachment-file-name {
    height: auto;
    line-height: 18px;
    margin-left: 10px;
    min-width: 150px;
}
.attachment-streaming-container {
    position: absolute;
    top: 80px;
    left: -10000px;
    width: auto;
    height: auto;
    z-index: 1050;
}
.attachment-streaming-container .loading-img {
    display: none;
}
.attachment-streaming-container.loading {
    width: 200px;
    height: 100px;
    overflow: hidden;
    left: calc(50% - 100px);
}
.attachment-streaming-container.loading .loading-img {
    width: 100%;
    height: 100%;
    display: block;
}
.attachment-streaming-container .controls {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 64px;
    height: 32px;
    white-space: nowrap;
    z-index: 2;
}
.attachment-streaming-container .controls .download,
.attachment-streaming-container .controls .close-popup {
    width: 32px;
    height: 32px;
    position: absolute;
}
.attachment-streaming-container .controls .close-popup {
    right: 0px;
}
.attachment-streaming-container .controls .download {
    left: -1px;
}
.attachment-streaming-container .attachment-caption {
    max-height: 100px;
    position: relative;
    overflow: hidden;
    padding: 10px 20px 10px 10px;
    word-wrap: break-word;
    display: none;
}
.attachment-streaming-container .ps-container.ps-active-y>.ps-scrollbar-y-rail {
    right: 0 !important;
}
.cp-container {
    width: 200px !important;
    height: 200px !important;
    margin-left: 90px;
}
.audio-duration {
    position: absolute !important;
    bottom: -40px !important;
    left: 0px;
    width: 100%;
    text-align: center;
}
.cp-play,
.cp-pause {
    width: 44px !important;
    height: 44px !important;
}
.cp-controls {
    padding: 30px !important;
}
.audio-container {
    width: 380px;
    height: 250px;
    position: relative;
}
.audio-container .attachmentTitle {
    width: 98%;
    margin-left: 1%;
    height: 15px;
    line-height: 15px;
    text-align: center;
    position: absolute;
    bottom: 30px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.video-container {
    width: 640px;
    height: 370px;
}
.jp-controls-holder {
    top: 0px !important;
}
.with-attachment.message-container.image:after,
.with-attachment.message-container.video:after {
    display: none;
} 

.with-attachment.with-caption:after {
    display: block !important;
}
.with-caption span.message-body {
    margin-top: 10px;
    word-wrap: break-word;
    margin-bottom: 10px;
}
.add-margin-top-geoloc-messages {
    margin-top: 64px !important;
}
.add-margin-top-geoloc-messages-conversation-list{
    margin-top: 30px !important;
}
.message-received .attachment-file-name,
.message-received .attachment-thumbnail,
.message-sent .attachment-file-name,
.message-sent .attachment-thumbnail {
    cursor: pointer;
}
.waiting-attachment .attachment-file-name,
.waiting-attachment .attachment-thumbnail {
    cursor: default !important;
}
.with-attachment.message-container.locations .attachment-thumbnail,
.with-attachment.message-container.news .attachment-thumbnail,
.with-attachment.message-container.location .attachment-thumbnail,
.with-attachment.message-container.video .attachment-thumbnail {
    position: relative;
}
.with-attachment.message-container.location .attachment-thumbnail:after{
    position: absolute;
    content: "";
    top: 0;
    width: 350px;
    height: 110px;
    display: block;
}
.with-attachment.message-container.video .attachment-thumbnail:after{
    position: absolute;
    content: "";
    top: 0;
    width: 100%;
    height: 100%;
    display: block;
}
.with-attachment.message-container.youtube .attachment-thumbnail a:after{
    position: absolute;
    content: "";
    top: 0;
    width: 150px;
    height: 150px;
    display: block;
}
.waiting-attachment .attachment-thumbnail img, 
.waiting-attachment .attachment-thumbnail {
    width: 64px !important;
    height: 64px !important;
    float: right;
}
.location .waiting-attachment.attachment,
.location .waiting-attachment .attachment-thumbnail {
    width: 350px !important;
    height: 137px !important;
}
.location .waiting-attachment .attachment-thumbnail img {
    width: 350px !important;
    height: 110px !important;
}
.waiting-attachment .address {
    position: absolute;
    bottom: 0px;
}
/* video popup */
div.jp-video ul.jp-controls, div.jp-interface ul.jp-controls li {
    display: block;
    float: left;
}
div.jp-video div.jp-progress {
    top: 0px;
    left: 0px;
    width: 490px !important;
    height: 6px !important;
    margin: 15px 10px !important;
    float: left !important;
}
div.jp-video div.play-pause ul.jp-controls {
    width: 40px !important;
    margin-left: 0 !important;
}
.jp-controls-holder.play-pause {
    width: 40px !important;
    float: left !important;
    margin: 0 !important;
}
.div.jp-video div.jp-type-single ul.jp-controls {
    margin: 0 !important;

}
.jp-controls-holder.volume-control {
    width: 90px;
    clear: none;
    margin: 0;
    float: right;
    height: 40px;
}
.volume-control ul.jp-controls {
    margin-left: 3px !important;
    width: 20px !important;
}
div.jp-video a.jp-mute, div.jp-video a.jp-unmute{
    position: initial !important;
    margin-top: 12px !important;
}
div.jp-video div.jp-volume-bar {
    left: 30px !important;
}
.jp-type-single {
    position: relative;
}
.jp-gui {
    position: absolute;
    bottom: 0;
    width: 100%;
}
.attachment-thumbnail .address {
    width: 100%;
    height: 27px;
    padding-left: 15px;
    line-height: 27px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.message-container.with-attachment.news,
.message-container.with-attachment.youtube,
.message-container.with-attachment.link {
    max-width: 55% !important;
}
.youtube .attachment,
.news .attachment,
.link .attachment {
    height: auto;
} 
.attachment-description.with-preview {
    min-height: 150px;
    margin-left: 10px;
}
.link .attachment-description .attachment-title,
.youtube .attachment-description .publishing-date,
.news .attachment-description .publishing-date {
    margin-bottom: 5px;
    line-height: 30px;
}
.attachment-description .description {
    min-height: 98px;
    word-break: break-word;
}
.link .attachment-description .description,
.youtube .attachment-description .description,
.news .attachment-description .description {
    min-height: 0;
}

.link .attachment-description.with-preview .description,
.youtube .attachment-description.with-preview .description,
.news .attachment-description.with-preview .description {
    min-height: 81px;
}
.link-url {
    margin-top: 5px;
}
.link tr,
.youtube tr,
.news tr {
    vertical-align: top;
}
.message-container.news .attachment-thumbnail,
.message-container.youtube .attachment-thumbnail,
.message-container.link .attachment-thumbnail {
    width: 150px;
    height: 150px;
    position: relative;
}
.message-container.news .attachment-thumbnail img,
.message-container.youtube .attachment-thumbnail img,
.message-container.link .attachment-thumbnail img {
    width: auto;
    height: auto;
    position:absolute;

}
.message-container.news .attachment-thumbnail a,
.message-container.youtube .attachment-thumbnail a,
.message-container.link .attachment-thumbnail a {
    display: block;
    position: relative;
    width: 150px;
    height: 150px;
}
.message-container.news .attachment-thumbnail .preloader-loading-mask,
.message-container.youtube .attachment-thumbnail .preloader-loading-mask,
.message-container.link .attachment-thumbnail .preloader-loading-mask {
    top: 25px;
}
.message-container.image .attachment-file-name,
.message-container.video .attachment-file-name {
    display: none;
}
.call-message {
    max-width: 450px !important;
    min-width: 315px !important;
    margin: 10px auto !important;
}
.sliding-layer-container .call-message,
.sliding-layer-container .message-aggregate,
.geolocation-chat-window .call-message,
.geolocation-chat-window .message-aggregate {
    max-width: 320px !important;
}
.call-message-body {
    height: 35px;
    padding: 0 10px;    
    display: flex;
}
.call-message-details-body {
    display: flex;
    padding: 5px 0;
}
.call-message-body.outgoing,
.aggregated .call-message-body {
    height: 35px
}
.call-message-icon {
    width: 34px;
    height: 34px;
    flex-shrink: 0;
}
.last-message .stw-icon {
    margin-right: 5px;
}
.call-message-details {
    flex-grow: 1;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    margin-right: 30px;
}
.call-message-details > * {
    width: 100%;
}
.with-from-details .call-message-body {
    height: 48px; 
}
.with-from-details .call-message-icon {
    margin-top: 5px;
}
.call-message-top-row {
    display: flex;
}
.call-message-text {
    flex-grow: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.call-message-text,
.call-message-duration {
    line-height: 26px;
}
.call-message-from,
.call-message-from-detail {
    max-width: 250px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.call-message-from-detail {
    max-width: 270px;
}

.call-message-footer {
    display: flex;
}

.call-message-transferor {
    margin-left: auto;
    padding-right: 7px;
}
    
.call-multiple-number {
    min-width: 27px;
    height: 26px;
    line-height: 26px;
    padding: 0 10px;
}
.call-details .modal-body {
    padding: 0px !important;
}
.call-details .modal-dialog {
    width: 330px;
}
.call-message-duration {
    padding-right: 5px;
}
.call-message-details-body .call-message-duration {
    margin-right: 10px;
}
.call-message.aggregated {
    cursor: pointer;
}
.attachment-removed-container {
    max-width: 80%;
    display: inline-table;
}
.attachment-removed a {
    cursor: pointer;
}
.attachment-caption-layer {
    display: none;
    z-index: 1000;
    width: 100%;
    height: calc(100% - 137px);
    position: absolute;
    top: 78px;
}
.geolocation-chat-window .attachment-caption-layer,
.mybusiness .attachment-caption-layer {
    top:0;
    height: calc(100% - 135px);
}
.attachment-caption-layer #video-player-container {
    width: 100%;
    height: calc(100% - 45px) !important;
}
.attachment-caption-layer .attachment-preview-video,
.attachment-caption-layer .attachment-preview-image {
    text-align: center;
    height: calc(100% - 50px);
    margin-top: 20px;
    display: none;
}
.attachment-caption-layer .attachment-preview-video {
    height: calc(100% - 30px);
    margin-top: 0;
}
.attachment-caption-layer.video-preview .attachment-preview-video,
.attachment-caption-layer.image-preview .attachment-preview-image {
    display: block;
}
.attachment-caption-layer img {
    max-width: 80%;
    max-height: 100%;
}
.attachment-caption-layer .attachment-caption-title {
    width: 100%;
    height: 30px;
    line-height: 30px;
    padding-left: 20px;
    display: flex;
}
.attachment-caption-layer .attachment-caption-title .text {
    flex-grow: 1;
}
.attachment-caption-layer .attachment-caption-title .remove-attachment {
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    cursor: pointer;
}
.attachment-caption .message-utilities {
    display: none;
}

.attachment-caption-layer .jp-video,
.attachment-caption-layer .jp-type-single,
.attachment-caption-layer .video-container {
    width: 100%;
    height:calc(100% - 5px);
}
.attachment-caption-layer div.jp-video div.jp-progress {
    width: calc(100% - 150px) !important;
}
.attachment-caption-layer div.jp-video video {
    max-height: 100%;
    max-width: 100%;
}

.message-container.video-conference .attachment {
    width: 400px;
}
.message-container.video-conference .attachment table {
    width: 100%;
}
.message-container.video-conference .attachment .attachment-title {
    white-space: normal;
    width: 100%;
    margin-bottom: 10px;
}
.message-container.video-conference .attachment-file-name {
    margin-bottom: 10px;
    font-weight: bold;
}
.attachment-info {
    margin-left: 10px;
}
.message-container.video-conference .attachment-hint {
    font-weight: bold;
    cursor: pointer;
}
.message-container.video-conference.event .restricted-room-link,
.message-container.video-conference.link .restricted-room-link {
    margin: 20px 0 0 105px;
    text-align: left; 
    color: #000000;
}
.message-container.video-conference.event table.attachment-data-sent .restricted-room-link {
    margin: 30px 10px;
}
.message-container.video-conference.link .restricted-room-link {
    margin: 20px 0 0 0;
}
@media (max-height:800px) {

    .attachment-caption-layer .attachment-preview-video {
        height: 100%;
    }

    .attachment-caption-layer #video-player-container {
        width: 100%;
        height: 100% !important;
    }

    .attachment-caption-layer .jp-interface {
        height: 40px;
        position: absolute;
        bottom: 0px;
    }

    .geolocation-chat-window .attachment-caption-layer .jp-interface,
    .mybusiness .attachment-caption-layer .jp-interface{
        bottom: -40px;
    }

    .attachment-caption-layer div.jp-video div.jp-progress {
        position: absolute;
        left: 40px;
        width: calc(100% - 145px) !important;
    }
} 

/* --- /styles/attachments-manager.css--- */ 

/** LEFT CONTAINER **/
#attachments-manager-left-container {
    display: flex;
    flex-direction: column;
    position: absolute;
    height: 100%;
    width: 350px;
    left: -350px;
    z-index: 3;
    padding-top: 66px;
}
#attachments-manager-left-container.open {
    left: 0;
}
#attachments-manager-left-container .organization-logo {
    display: none;
    margin: 0 20px;
    width: auto;
    flex-shrink: 0;
}
#attachments-manager-left-container .conversations-title {
    margin: 20px;
}
#attachments-manager-left-container .conversation-message {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#attachments-manager-left-container .conversations-title h1 {
    display: inline-block;
}
#attachments-manager-left-container .top-bar {
    display: flex;
    height: 42px;
    width: 100%;
    flex-shrink: 0;
}
#attachments-manager-left-container .top-bar .arrow {
    flex-shrink: 0;
    width: 42px;
}
#attachments-manager-left-container .top-bar .content {
    flex-grow: 1;
    padding: 0 10px;
}
#attachments-manager-left-container .select-all {
    margin: 20px;
    padding-left: 25px;
}
#attachments-manager-left-container .scroll-container {
    position: relative;
    overflow: auto;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}
#attachments-manager-left-container .list-container {
    flex-grow: 1;
}
#attachments-manager-left-container .load-more-container {
    flex-shrink: 0;
    height: 40px;
    position: relative;
    display: none;
}
#attachments-manager-left-container .load-more-container .load-more-button{
    display: block;
}
#attachments-manager-left-container.with-load-more-button .load-more-container {
    display: block;
}
#attachments-manager-left-container .no-conversations {
    display: none;
    padding: 20px;
}
#attachments-manager-left-container.with-no-records .no-conversations {
    display: block;
}
#attachments-manager-left-container .conversation-block {
    display: flex;
    width: 100%;
}
#attachments-manager-left-container .conversation-checkbox {
    padding-top: 11px;
    flex-shrink: 0;
}
#attachments-manager-left-container input[type="checkbox"] + label span {
    margin: 0;
}
#attachments-manager-left-container .conversation-picture {
    width: 64px;
    height: 42px;
    padding: 0 11px;
    flex-shrink: 0;
}
#attachments-manager-left-container .conversation-picture img {
    width: 100%;
}
#attachments-manager-left-container .conversation-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
}
#attachments-manager-left-container .conversation-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/** RIGHT CONTAINER **/

#attachments-manager-right-container {
    z-index: 100; /* scrollbar on other containers is 99 */
}
#attachments-manager-right-container.open {
    display: block;
}
#attachments-manager-right-container .header {
    position: relative;
    top: 0px;
    height: auto;
    width: 100%;
    padding: 5px 20px 20px 20px;
    padding-bottom: 5px;
}
#attachments-manager-right-container .header h3 {
    margin-top: 10px;
}
#attachments-manager-right-container #attachment-manager-tooltip {
    display: inline-block;
    vertical-align: bottom;
}
#attachments-manager-right-container .no-conversations {
    display: none;
    padding-top: 50px;
}
#attachments-manager-right-container .blank-state .no-conversations {
    display: block;
}
#attachments-manager-right-container .blank-state .controls-container, 
#attachments-manager-right-container .blank-state .scroll-container,
#attachments-manager-right-container .blank-state .action-bar {
    display: none !important;
}
#attachments-manager-right-container .controls-container {
    padding: 20px;
    flex-shrink: 0;
}
#attachments-manager-right-container .controls-top-container {
    display: flex;
}
#attachments-manager-right-container .controls-top-container .search-box {
    margin: 0;
    width: 300px;
    margin-right: 20px;
    /* requested by marketing to hide https://jira.streamwide.com/browse/SMARTMS-34130 */
    display: none;
}
#attachments-manager-right-container .controls-top-container .search-input {
    height: 34px;
}
#attachments-manager-right-container .controls-top-container .search-box .icon {
    width: 34px;
    height: 34px;
    position: absolute;
    top: 0;
    right: 0;
    cursor: default;
}
#attachments-manager-right-container .controls-top-container .search-reset-button span {
    line-height: 34px !important;
    width: 34px;
}
#attachments-manager-right-container .controls-top-container .search-reset-button span.stw-search-general {
    display: block;
}
#attachments-manager-right-container .controls-top-container .search-reset-button span.stw-search-clear {
    cursor: pointer;
    display: none;
}

#attachments-manager-right-container .controls-top-container .search-reset-button.reset span.stw-search-clear {
    display: block !important;
}
#attachments-manager-right-container .controls-top-container .search-reset-button.reset span.stw-search-general {
    display: none !important;
}

#attachments-manager-right-container .controls-top-container .sort-label {
    padding-right: 10px;
}
#attachments-manager-right-container .controls-top-container .sort-box {
    width: 300px;
}
#attachments-manager-right-container .controls-bottom-container {
    margin-top: 20px;
}
#attachments-manager-right-container .scroll-container {
    height: calc(100% - 114px);
    overflow: auto;
}
#attachments-manager-right-container.with-action-bar .scroll-container {
    height: calc(100% - 186px);
}
#attachments-manager-right-container .listing-container {
    display: flex;
    flex-wrap: wrap;
    padding: 2px 20px 20px;
}
#attachments-manager-right-container .attachment-item {
    width: 134px;
    height: 147px;
    margin: 0 10px 10px 0;
    position: relative;
}
#attachments-manager-right-container .attachment-item-actions {
    display: none;
    position: absolute;
    height: 31px;
    width: 100%;
    z-index: 1;
}
#attachments-manager-right-container .attachment-item:hover:not(.selected) .attachment-item-actions {
    display: flex;
    justify-content: space-around;
}
#attachments-manager-right-container .attachment-item-actions .delete,
#attachments-manager-right-container .attachment-item-actions .download {
    width: 31px;
    height: 31px;
}
#attachments-manager-right-container .attachment-item-top {
    display: flex;
    height: 80px;
    padding: 10px;
}
#attachments-manager-right-container .checkbox-container {
    float: none;
    margin: 20px 10px 0 0;
}
#attachments-manager-right-container .attachment-item-thumbnail {
    width: 80px;
    height: 60px;
}
#attachments-manager-right-container .attachment-item-thumbnail img {
    max-width: 100%;
    max-height: 100%;
}
#attachments-manager-right-container .attachment-data {
    padding: 10px;
}
#attachments-manager-right-container .attachment-name {
    min-height: 17px;
}
#attachments-manager-right-container .attachment-data-bottom {
    display: flex;
    justify-content: space-between;
    margin-top: 16px;
}
#attachments-manager-right-container .attachment-data-bottom > div {
    padding: 3px 5px 2px;
}
#attachments-manager-right-container .select-all {
    padding-left: 25px;    
    display: inline;
}
#attachments-manager-right-container .action-bar {
    display: none;
    padding: 20px;
}
#attachments-manager-right-container.with-action-bar .action-bar {
    display: flex;
}
#attachments-manager-right-container .action-bar .action-summary {
    flex-grow: 1;
}
#attachments-manager-right-container .action-bar button {
    height: 32px;
    margin-left: 20px;
    padding: 6px 12px;
}
#attachments-manager-right-container .load-more {
    display: none;
}
#attachments-manager-right-container .no-results {
    display: none;
}
#attachments-manager-right-container .attachment-manager-content {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    top: 0px;
}
#attachments-manager-right-container .preloader-loading-mask .label-container {
    top: 200px;
}

/* --- /styles/google-location.css--- */ 

#map-canvas {
    height: 550px;
    margin: 0px;
    padding: 0px;
    width: 898px;
  }
.google-map .modal-dialog {
    width: 900px;
    height: 550px;
}
.google-map .modal-body {
    padding:0;
}
.google-map .search-field {
    position: absolute;
    top: 10px;
    right: 20px;
    width: 300px;
}
#pac-input {
    z-index: 0;
    position: absolute;
    top: 0;
    width: 300px !important;
}
#share-location {
    width: 300px;
    height: 30px;
    padding: 3px 0 2px;
}
.send-location-button {
    position: absolute;
    bottom: 0;
    padding: 20px;
    right: 0;
}
.results-container.search-completed {
    height: 550px;
    position: absolute;
    top: 0;
    right: 0;
    width: 340px;
}
.pac-container:after {
    position: absolute;
    width: 100%;
    bottom: 0
}
.searched-message-location.pac-container {
    z-index: 9000 !important;
    height: 470px !important;
    width: 340px !important;
    left: 0 !important;
    top: 0 !important;
    border-top: none !important;
    box-shadow: none !important;
    border-radius: 0px !important;
}
.search-completed .searched-message-location.pac-container {
    display: block !important;
}
.results-container .results {
    height: 470px;
    overflow: hidden;
    top: 60px;
    position: absolute;
    width: 100%;
    display: none;
}

.only-view .send-location-button,
.only-view .search-field {
    display: none;
}
/* prevents overlapping of secondary buttons (labels and terrain) with primary buttons (map and satelite) */
.gm-style-mtc > div {
    top: auto !important;
}


/* --- /styles/call-popup.css--- */ 

.call-popup {
    width: 350px;
    margin: 0 auto;
    padding: 10px;
}

.call-popup .picture-container {
    width: 100%;
    height: 160px;
    text-align: center;
    position: relative;
    margin-top: 20px;
}
.call-popup .name-bar {
    width: 100%;
    height: auto;
    min-height: 30px;
    text-align: center;
    position: relative;
}
.call-popup .user-picture {
    width: 130px;
    height: 130px;
    position: absolute;
    left: calc(50% - 65px);
    top: 15px;
}
.call-popup .user-picture img {
    width: 130px;
    height: auto;
    -webkit-border-radius: 65px;
    -moz-border-radius: 65px;
    border-radius: 65px;
}
.call-popup .call-type {
    width: 30px;
    height: 30px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    position: absolute;
    top: 16px;
    right: calc(50% - 57px);
    z-index: 2;
    text-align: center;
    line-height: 33px;
    display: none;
}
.call-popup.video-stream-share .call-type.video-streaming {
    display: block;
}
.call-popup .animation {
    height: 160px;
    width: 160px;
    margin: 0 auto;
}
.call-popup .details-container {
    text-align: center;
    min-height: 30px;
    margin-top: 10px;
}
.call-popup .buttons-container {
    text-align: center;
    margin: 10px 0 20px 0;
    width: 100%;
}
.call-popup .buttons-container button {
    min-width: 100px;
    margin: 0 15px;
    display: none;
}
.call-popup.incoming .buttons-container .answer,
.call-popup.incoming .buttons-container .hang-up {
    display: inline-block;
}

.js-information-dialog {
    z-index: 3050;
}
.call-on-hold-dialog {
    width: 350px;
}
.call-on-hold-dialog .text-message {
    display: flex;
}
.call-on-hold-dialog .customized-radio {
    display: flex;
    margin-bottom: 10px;
}
.call-on-hold-dialog .customized-radio-label {
    margin-left: 10px;
}
.call-merge-dialog .text-message{
    flex-direction: column;
}

/* --- /styles/call-notifications.css--- */ 

.js-call-notification-dialog .modal-content {
    width: 350px;
    margin: 0 auto;
}
.js-call-notification-dialog #acknowledge {
    width: 130px;
    height: 30px;
    line-height: 11px;
}
.js-call-notification-dialog .modal-sm {
    max-width: 710px !important;
    width: auto !important;
}
.js-call-notification-dialog .modal-body {
    padding: 10px;
    padding-bottom: 0px;
}
.js-call-notification-dialog .modal-footer {
    text-align: center !important;
    padding-top: 0px;
    margin-bottom: 20px;
    display: block;
}
.js-call-notification-dialog .picture-container {
    width: 100%;
    height: 196px;
    text-align: center;
    position: relative;
    margin-top: 20px;
}
.js-call-notification-dialog .text-container {
    width: 100%;
    height: auto;
    min-height: 30px;
    text-align: center;
    position: relative;
}
.js-call-notification-dialog .subscriber-picture {
    width: 130px;
    height: 130px;
    position: absolute;
    left: calc(50% - 65px);
    top: 15px;
}
.js-call-notification-dialog .subscriber-picture img {
    width: 130px;
    height: auto;
    -webkit-border-radius: 65px;
    -moz-border-radius: 65px;
    border-radius: 65px;
}
.js-call-notification-dialog .call-type {
    width: 30px;
    height: 30px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    position: absolute;
    top: 3px;
    right: calc(50% - 57px);
    z-index: 2;
}
.js-call-notification-dialog .incoming-calling {
    width: 127px;
    height: 45px;
    padding: 7px;
}
.js-call-notification-dialog .outgoing-calling {
    width: 227px;
    height: 45px;
    padding: 7px;
}
.js-call-notification-dialog .incoming-calling .icon,
.js-call-notification-dialog .outgoing-calling .icon {
    display: inline-block;
    width: 34px;
    height: 30px;
}
.js-call-notification-dialog .notification-title {
    width: 100%;
    height: 42px;
    text-align: center;
    margin-top: 10px;
    white-space: nowrap;
}

.js-call-notification-dialog .call-forwarded {
    width: 100%;
    height: 12px;
    text-align: center;
    margin-top: 10px;
    white-space: nowrap;
    font-size: 16px;
    display: none;
}

.js-call-notification-dialog .notification-title.calling {
    width: calc(100% - 22px);
    margin-left: 12px;
}
.js-call-notification-dialog .notification-title .dots-container {
    width: 12px;
    display: none;
    vertical-align: top;
}
.js-call-notification-dialog .notification-title.calling .dots-container {
    display: inline-block;
    overflow: hidden;
    vertical-align: top;
    text-align: right;
}
.js-call-notification-dialog .notification-title.calling .dots-container span {
    display: inline-block;
    overflow: hidden;
    line-height: 12px;
    animation: call-popup-dots 1.5s infinite;
    -webkit-animation: call-popup-dots 1.5s infinite;
    -moz-animation: call-popup-dots 1.5s infinite;
}
.js-call-notification-dialog .notification-title .notification-message {
    display: inline-block;
    vertical-align: bottom;
    white-space: normal;
    max-width: 100%;
    width: auto;
}  
.js-call-notification-dialog .call-animation {
    height: 160px;
    width: 160px;
    margin: 0 auto;
}
.js-call-notification-dialog .incoming-call-buttons,
.js-call-notification-dialog .outgoing-call-buttons,
.js-call-notification-dialog .call-animation {
    display: none;
}
.js-call-notification-dialog .call-icon {
    position: absolute;
    right: 6px;
    top: 6px;
    width: 31px;
    height: 31px;
}
.js-call-notification-dialog.ambient-listening .call-icon {
    display: none;
}
.js-call-notification-dialog.emergency-call .subscriber-picture.group-image.big .call-icon {
    top: 0;
    right: 0;
}
.js-call-notification-dialog .popup-user-image {
    display: none;
}
.js-call-notification-dialog .contacts-count {
    position: absolute;
    bottom: 6px;
    text-align: center;
    width: 130px;
}
.js-call-notification-dialog .notification-body {
    padding: 15px 0;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.js-call-notification-dialog.calls-not-supported .notification-body {
    white-space: normal;
    margin-bottom: 10px;
}
.js-call-notification-dialog #acknowledge-not-supported {
    display: none;
    width: 140px;
    height: 30px;
    line-height: 11px;
}
.js-call-notification-dialog.calls-not-supported .text-container {
    margin-top: 20px;
}
.js-call-notification-dialog.calls-not-supported ul {
    text-align: justify;
}
.js-call-notification-dialog .call-type-label {
    display: none;
}
.js-call-notification-dialog.with-call-type-label .call-type-label {
    display: block;
    margin: 10px 0 20px 0;
}
.js-call-notification-dialog .call-participants {
    display: flex;
    align-items: center;
    width: 86%;
    margin: 0 auto;
}
.js-call-notification-dialog .call-participants .floating-mask {
    width: 100%;
    height: 42px;
    overflow: hidden;
    position: relative;
}
.js-call-notification-dialog .call-participants .floating-container {
    display: flex;
    justify-content: center;
    height: 42px;
}    
.js-call-notification-dialog .call-participants .sections-arrow {
    height: 42px;
    line-height: 42px;
    position: relative;
    cursor: pointer;
    display: none;
    z-index: 3;
}
.js-call-notification-dialog .call-participants .sections-arrow .left-blur,
.js-call-notification-dialog .call-participants .sections-arrow .right-blur {
    height: 200%;
    position: absolute;
    top: -50%;
    width: 10px;
}
.js-call-notification-dialog .call-participants .sections-arrow .left-blur {
    right: 6px;
}
.js-call-notification-dialog .call-participants .sections-arrow .right-blur {
    left: 6px;
}
.js-call-notification-dialog.emergency-call .call-participants .sections-arrow .left-blur,
.js-call-notification-dialog.emergency-call .call-participants .sections-arrow .right-blur {
    height: 150%;
    top: -25%;
}
.js-call-notification-dialog .call-participants .sections-arrow.disabled {
    visibility: hidden;
    cursor: default;
}
.js-call-notification-dialog .call-participants .user-image {
    margin: 0 10px;
}
.js-call-notification-dialog .call-participants .user-image img {
    width: 42px;
}
.js-call-notification-dialog .call-participants.more-recipients .floating-container {
    position: absolute;
}
.js-call-notification-dialog .call-participants.more-recipients .sections-arrow {
    display: block;
}
.js-call-notification-dialog .call-participants.more-recipients .floating-mask {
    width: calc(100% - 40px);
}
.js-call-notification-dialog .notification-text {
    display: none;
}
.js-call-notification-dialog #answer-ambient-listening-call {
    display: none;
}
.js-call-notification-dialog.ambient-listening #answer-ambient-listening-call {
    display: inline-block;
}
.js-call-notification-dialog.ambient-listening #answer-call {
    display: none;
}

/* --- /styles/password-security-options.css--- */ 

.js-password-security-options__container { 
    cursor: default !important;
}
.js-password-security-options__container * {
    cursor: default !important;
}
.js-password-security-options__container.position-right .js-password-security-options__arrow {
    top: 50%;
    left: -6px;
    transform: rotate(-90deg);
}
.js-password-security-options__container.position-bottom .js-password-security-options__arrow {
    top: -11px;
    left: 50%;
}
.js-password-security-options__arrow:after {
    top: 1px;
    margin-left: -10px;
}

.js-password-security-options__header {
    margin-bottom: 10px;
}


/* --- /styles/messages-search-jump-bar.css--- */ 

.messages-search-jump-bar {
    position: absolute;
    width: 5px;
    height: 100%;
    z-index: 1000;
    opacity: 0.6;
    display: none;
}
.messages-search-jump-bar:hover {
    width: 10px;
    opacity: 1;
}
.messages-search-jump-bar .empty-marker,
.messages-search-jump-bar .filled-marker {
    display: block;
    width: 100%;
}
.messages-search-jump-bar .empty-marker {
    opacity: 0;
}
.messages-search-jump-bar .popover {
    width: auto !important;
    min-width: 800px !important;
}

/* --- /styles/message-options.css--- */ 

.message-container .show-message-options {
    width: 28px;
    height: 28px;
    position: absolute;
    right: 5px;
    top: 5px;
    display: none;
    z-index:2;
    cursor: pointer;   
}
.message-options .popover-content {
    padding: 5px 8px !important;
}
.message-received .message-container.video .show-message-options,
.message-received .message-container.image .show-message-options {
    right: 5px;
}
.message-options-container .option-row {
    height: 30px;
    line-height: 30px;
    white-space: nowrap;
    cursor: pointer;
}
.message-options-container .option-row span {
    margin-left: 25px;
}
.popover.message-options {
    margin-left: -66px
}

.popover.message-options .arrow {
    left: auto !important;
    right: 23px;
}

.popover.message-options.only-attachment {
    margin-left: -32px
}

.popover.message-options.only-attachment .arrow {
    left: auto !important;
    right: 58px;
}
.chat-window-send-messages {
    width: 100%;
    position: absolute;
    bottom: 0px;
}
.chat-window-send-messages.attachment-caption {
    padding-top: 100px;
}
.chat-window-forward-messages {
    display: none;
    width: 100%;
    height: 70px;
    position: absolute;
    bottom: 0;
}
.chat-window-forward-messages.blank-state {
    bottom: 0;
    position: absolute;
}
.chat-window-forward-messages button {
    width: 120px !important;
    height: 32px !important;
    vertical-align: top !important;
    margin-right: 20px;
}
.chat-window-forward-messages .buttons-container {
    float: right;
}
.chat-window-forward-messages .buttons-container a {
    margin-left: 10px;
}
.chat-window-forward-messages .buttons-container a:last-child {
    margin-right: 15px;
}
.chat-window-forward-messages span {
    float: left;
    padding-left: 20px;
    line-height: 32px;
}
.chat-window-forward-messages .bar {
    position: absolute;
    top: 20px;
    width: 100%;
    height: 32px;
}
#date-time-interval-picker #back {
    margin-right: 10px;
}
#process-input .modal-dialog {
    width: 370px;
}
#process-input .sw-button {
    width: 100px;
}
#process-input .sw-button#close {
    float: left;
}
#process-input .message-area {
    margin-top: 20px;
}
#process-input .modal-body {
    height: 230px;
}

/* --- /styles/export-messages.css--- */ 

.export-messages-container .option-row {
    height: 30px;
    line-height: 30px;
    white-space: nowrap;
    cursor: pointer;
}
.export-messages-container .option-row span {
    margin-left: 25px;
}
.export-messages.popover {
    max-width: 247px;
    right: 21px;
    left: auto !important;
}
.export-messages.popover .arrow {
    right: 48px;
    left: auto !important;
}
.download-all-nfc {
    padding-left: 20px;
    text-transform: uppercase;
    cursor: pointer;
}
.download-all-nfc.with-popover {
    text-indent: -99999px;
    width: 23px;
    padding-left: 0px;
}
.download-nfc-container{
    float: right;
    line-height: 30px;
}
.download-nfc-container .tooltip-inner {
    width: 160px;
}
#process-name {
    width: 100%;
    cursor: text;
    margin-top: 20px;
}

/* --- /styles/contact-options.css--- */ 

.contact-user .show-contact-options {
    width: 28px;
    height: 28px;
    position: absolute;
    right: 5px;
    top: 5px;
    display: none;
    z-index:2;
    cursor: pointer;   
}
.contact-options .option-row {
    position: relative;
}
.contact-options .option-arrow {
    position: absolute;
    right: 0;
    top: 9px;
}
.contact-options-container {
    position: relative;
}
.contact-options-container .option-row {
    height: 30px;
    line-height: 30px;
    white-space: nowrap;
    cursor: pointer;
    min-width: 140px;
}

.contact-options-container .option-row .default-label {
    display: inline;
}

.contact-options-container .option-row.ptt-short-label .default-label,
.contact-options-container .option-row.ptt-long-label .default-label,
.contact-options-container .option-row .short-label,
.contact-options-container .option-row .long-label {
    display: none;
}

.contact-options-container .option-row.ptt-long-label .long-label,
.contact-options-container .option-row.ptt-short-label .short-label {
    display: inline;
}

.contact-options-container .option-row span.stw-icon {
    display: inline-block;
    width: 20px;
    margin-right: 5px;
}
.contact-item:first-child .more-than .popover {
    margin-top: 46px;
}
.contact-item:first-child .less-than .popover {
    margin-top: 12px;
}
.contact-item:first-child .popover {
    margin-top: 32px;
}
.subscriber-history .contact-item .popover {
    margin-top: 15px;
}
.contact-item:first-child .popover.left .arrow {
    top: calc(50% - 32px);
}

.contact-item:first-child .more-than .popover .arrow {
    top: calc(50% - 46px);
}
.contact-item:first-child .less-than .popover .arrow {
    top: calc(50% - 12px);
}
.subscriber-history .contact-item:first-child .less-than .popover .arrow {
    top: -11px;
}

.contacts-selectable-only .new-conversation, 
.contacts-selectable-only .wait {
    display: none !important;
}
.contact-options-container.with-meeting-rooms {
    width: 250px;
}
.contact-options-container .popup-call.disabled-control span {
    cursor: pointer !important
}
.contact-options-container .popup-video-streaming.streaming-on .stw-icon {
    position: relative;
}
.contact-options-container .popup-video-streaming.streaming-on .stw-icon:after {
    display: inline-block;
    content: " ";
    width: 10px;
    height: 10px;
    position: absolute;
    top: -2px;
    left: -3px;
}
.contact-options-container .css-sh22l5-MuiButtonBase-root-MuiAccordionSummary-root,
.contact-options-container .css-sh22l5-MuiButtonBase-root-MuiAccordionSummary-root.Mui-expanded {
    margin: 0!important;
    min-height: 30px !important;
    height: 30px;
}
.contact-options-container .meeting-rooms-shortcuts-container {
    position: relative;
    width: 200px;
    height: 0;
    overflow: hidden;
}
.contact-options-container .meeting-rooms-shortcuts-container.visible {
    height: auto;
    margin-top: 10px;
    padding-top: 10px;
}
.contact-options-container .meeting-rooms-shortcuts-container label {
    font-weight: normal;
}
.meeting-rooms-shortcuts-container .MuiAccordionSummary-root {
    padding: 0 !important;
}

/* --- /styles/web-rtc.css--- */ 

.contact-item:first-child .contacts.popover {
  margin-top: 27px;
}
.contact-item:first-child .contacts.popover .arrow {
  top: calc(50% - 27px);
}
#call-banner-manager {
    right: 0;
    position: absolute;
    width: 909px;
    left: calc((100% - 1260px) / 2 + 351px);
    top: 54px;
    z-index: 1001;
}
.call-banner-container {
    position: relative;
    height: 75px;
    margin-bottom: 3px;
}
.call-banner-container.one2one .group-image{
    display: none;
}
.call-banner-container:not(.one2one) .subscriber-image {
    display: none !important;
}

.call-banner-container .expand-button {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 100%;
    float: left;
}
.banner-list:not(.multiple-banners) .call-banner-container .expand-button {
    display: none;
}
#call-banner-manager .banners-container {
    max-height: 310px;
    position: relative;
    overflow: hidden;
}
#call-banner-manager .collapse-banners {
    position: absolute;
    display: none;
    align-items: flex-end;
    justify-content: center;
    width: 33px;
    padding-bottom: 3px;
    height: 20px;
    font-size: 16px;
    border-bottom-left-radius: 50%;
    border-bottom-right-radius: 50%;
    left: 68%;
    visibility:hidden;
    opacity: 0;
    top: -3px;
    cursor: pointer;
}

.timestamp-who-took-the-floor{
    width: 76px;
    font-size: 10px;
    text-align: center;
    position: absolute;
    left: 0px;
    top: 58px
}

.multiple-banners .timestamp-who-took-the-floor{
    left: 49px;
}

.call-banner-container.expand-all .expand-button .sw-collapse,
.call-banner-container:not(.expand-all) .expand-button .sw-expand,
.call-banner-container:not(.expand-all) .expand-button .banner-count {
    display: none;
}
.call-banner-container .expand-button .sw-expand,
.call-banner-container .expand-button .sw-collapse {
    display: inline-block;
    width: 20px;
    height: 20px;
}
.call-banner-container .user-image,
.call-banner-container .notification-image {
    margin: 17px;
    width: 42px;
    height: 42px;
    position: relative;
    float: left;
}
.call-banner-container .user-image .wt-supervisor-level-icon,
.call-banner-container .notification-image .wt-supervisor-level-icon {
    position: absolute;
    top: -5px;
    right: -5px;
}
.call-banner-container.hidden-supervisor-level .user-image .wt-supervisor-level-icon,
.call-banner-container.hidden-supervisor-level .notification-image .wt-supervisor-level-icon {
    display: none;
}
.call-banner-container .notification-image {
    display: none;
}
.call-banner-container .customized-checkbox {
    display: none !important;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    left: 40px;
}
.call-banner-container .call-banner-notification {
    margin-left: 0;
}
.multiple-banners .call-banner-container .call-banner-notification {
    margin-left: 35px;
}
.multiple-banners .call-banner-container .customized-checkbox {
    display: block !important;
}
.multiple-banners .call-banner-container .user-image,
.multiple-banners .call-banner-container .notification-image {
    margin-left: 30px;
}
.multiple-banners .call-banner-container .name {
    margin-left: -10px;
}
.call-banner-container .connection-controls {
    position: absolute;
    width: 100%;
    z-index: 2;
    display: none;
}
.call-banner-container .disconnect-wheel {
    float: left;
    width: 42px;
    height: 42px;
    margin: 17px;
    display: none;
}
.call-banner-container .disconnect-message {
    width: 400px;
    display: none;
}
.call-banner-container .name {
    width: 340px;
    height: calc(100% - 4px);
    float: left;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.call-banner-container .name > * {
    flex-shrink: 0;
    flex-grow: 0;
}
.banner-list:not(.multiple-banners) .call-banner-container .name .priority {
    display: none;
}
.banner-controls {
    float: right;
    width: 450px;
    height: 60px;
    margin-top: 8px;
}
.call-banner-container .call-status-bar {
    width: 440px;
    height: 22px;
}
.call-banner-container .call-status-bar .speaker-icon {
    margin-left: 5px;
}
.call-banner-container .notificaton-text {
    display: none;
    height: 22px;
}
.call-banner-container .call-status-bar.with-temporary-message [data-role=status-text]:not(:last-child),
.call-banner-container .call-status-bar.with-temporary-message .speaker-icon {
    display: none !important;
}
.call-banner-container.disconnected .disconnect-wheel,
.call-banner-container.disconnected .disconnect-message {
    display: block !important;
}
.call-banner-container.disconnected .user-image,
.call-banner-container.disconnected .notification-image,
.call-banner-container.disconnected .call-status-bar,
.call-banner-container.disconnected .notification-text,
.call-banner-container.disconnected .customized-checkbox {
    display: none !important;
}
.singnal-bars {
    width: 14px;
    height: 10px;
    margin-top: 5px;
    opacity: 0;
}
.signal-status .bar1,
.signal-status .bar2,
.signal-status .bar3,
.signal-status .bar4,
.signal-status .bar5 {
    width: 2px;
    float: left;
    opacity: 0.5;
}
.signal-status .bar1 {
    height:  2px;
    margin-top: 8px;
}
.signal-status .bar2 {
    height:  4px;
    margin-top: 6px;
    margin-left: 1px;
}
.signal-status .bar3 {
    height:  6px;
    margin-top: 4px;
    margin-left: 1px;
}
.signal-status .bar4 {
    height:  8px;
    margin-top: 2px;
    margin-left: 1px;
}
.signal-status .bar5 {
    height:  10px;
    margin-left: 1px;
}
.signal-status.level5 .bar1,
.signal-status.level5 .bar2,
.signal-status.level5 .bar3,
.signal-status.level5 .bar4,
.signal-status.level5 .bar5 {
    opacity: 1;
}
.signal-status.level4 .bar1,
.signal-status.level4 .bar2,
.signal-status.level4 .bar3,
.signal-status.level4 .bar4 {
    opacity: 1;
}
.signal-status.level3 .bar1,
.signal-status.level3 .bar2,
.signal-status.level3 .bar3 {
    opacity: 1;
}
.signal-status.level2 .bar1,
.signal-status.level2 .bar2 {
    opacity: 1;
}
.signal-status.level1 .bar1 {
    opacity: 1;
}
.banner-controls .walkie-talkie-menu,
.banner-controls .terminate-ptt-call,
.banner-controls .instant-replay,
.banner-controls .conversation-menu,
.banner-controls .mute-controls,
.banner-controls .transfer-call,
.banner-controls .merge-calls,
.banner-controls .call-banner-channel-details,
.banner-controls .video-button {
    width: 51px;
    height: 28px;
    float: left;
    margin-left: 10px;
    cursor: pointer;
}
#instantReplayContainer .sw-PartialAppContainer .sw-ChannelsInstantReplayListContainer{
    width: 350px;
}
.banner-controls .video-button {
    display: none;
}
.banner-controls .transfer-call,
.banner-controls .merge-calls {
    display: none;
}
.banner-controls .hang-up {
    width: 113px;
    height: 28px;
    margin: 0 10px;
    cursor: pointer;

    /*Styles for terminate call overlapping btn*/
    display: flex;
    justify-content: flex-end;
    align-items: center;
    position: relative;
    z-index: 1;
}
.banner-controls .hang-up .terminate-ptt-call {
    position: relative;
    height: 36px;
    width: 36px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--COLOR_LEGACY_03);;
    background: var(--COLOR_LEGACY_09);
    border: 1.5px solid var(--COLOR_LEGACY_03);;
    margin-right: -10px;
}
.banner-controls .hang-up .terminate-ptt-call:before {
    position: absolute;
    height: 42px;
    width: 42px;
    background: var(--asset-calling-background_png) no-repeat;;
    content: '';
    z-index: -1;
    border-radius: 50%;
}
.emergency-call .banner-controls .hang-up .terminate-ptt-call:before {
    background: var(--COLOR_LEGACY_29);
}
.banner-controls .checkbox-switcher {
    margin-left: 10px;
}
.banner-controls .hang-up.channel {
    width: 63px;
    margin-left: 0;
}
.banner-controls .geolocation-button {
    display: none;
    float: left;
    margin-left: 10px;
    border-radius: 20px;
    background-color: var(--COLOR_LEGACY_01);
    width: 51px;
    height: 28px;
    align-items: center;
    justify-content: center;
}
.talk {
    position: relative;
    width: 130px;
    height: 28px;
    float: left;
    cursor: pointer;
    margin-left: 10px;
    display: none;
}
.broadcast-call .talk {
    min-width: 175px;
    width: auto;
    padding-left: 10px;
    padding-right: 10px;
}
.talk.visible {
    display: flex;
}
.talk span.text {
    flex-grow: 1;
    line-height: 27px;
    padding-left: 10px;
    white-space: nowrap;
}
.talk span.icon {
    flex-grow: 1;
    text-align: right;
    font-size: 20px;
    line-height: 27px;

}
.talk.other-talking span {
    display: none;
}
.wt-speaking-duration-counter {
    width: 51px;
    height: 28px;
    float: left;
    margin-right: 11px;
    text-align: center;
    display: none;
}
.call-banner-container.with-duration-counter .wt-speaking-duration-counter {
    display: block;
}
.signal-status {
    height: 21px;
    float: right;
    margin-right: 20px;
    display: flex;
    padding-left: 5px;
    padding-right: 5px;
}
.banner-buttons {
    float: right;
    margin-right: 20px;
    margin-top: 6px;
    display: flex;
}
.banner-call-type {
    line-height: 21px;
    text-align: center;
    white-space: nowrap;
    width: auto;
    position: relative;
    margin-left: 5px;
    flex-grow: 1;
}
.banner-more-options .popover-content {
    padding: 5px 8px !important;
}
.banner-more-options-container .option-row {
    height: 30px;
    line-height: 30px;
    white-space: nowrap;
    cursor: pointer;
}
.banner-more-options-container .option-row span {
    margin-left: 30px;
}
.banner-more-options-container .option-row span.option-icon {
    margin: 0;
    position: absolute;
    line-height: 30px;
}
.banner-buttons .disabled {
    opacity: 0.4;
    cursor: default;
}
.banner-list .call-on-hold-controls,
.banner-list .call-on-hold-flag {
    display: none;
}
.WALKIETALKIE_CHANNEL .call-on-hold-controls {
    display: none !important;
}
.call-banner-container.speaking .call-on-hold-controls {
    display: none !important;
}
.call-banner-container .swap-on-hold span {
    display: none;
}
.call-banner-container.on-hold .swap-on-hold {
    display: inline-block;
}
.call-banner-container:not(.on-hold) .put-on-hold {
    display: inline-block;
}
.call-banners.multiple-banners .call-banner-container.on-hold .swap-on-hold span.multiple-call {
    display: inline-block;
}
.call-banners:not(.multiple-banners) .call-banner-container.on-hold .swap-on-hold span.single-call {
    display: inline-block;
}
.banner-buttons .call-on-hold-controls,
.banner-buttons .screenshare-button {
    display: flex;
    float: left;
    width: auto;
}
.banner-buttons .call-on-hold-controls > div,
.banner-buttons .screenshare-button {
    width: 51px;
    height: 28px;
    line-height: 28px;
    text-align: center;
    border-radius: 20px;
    display: none;
    margin-left: 10px;
    font-size: 16px;
}
.call-banner-container.on-hold .call-on-hold-flag {
    display: block;
}

.call-banner-container .call-on-hold-flag  .flag-container.transfer-call {
    display: none;
}

.call-banner-container.on-hold.in-transfer .call-on-hold-flag .flag-container.transfer-call {
    display: block;
}

.call-banner-container.on-hold.in-transfer .call-on-hold-flag .flag-container {
    display: none;
}
.call-banner-container.on-hold.in-transfer:not(.on-hold-initiator) .call-on-hold-controls {
    display: none !important;
}

.call-banner-container.on-hold.on-hold-received .call-on-hold-controls {
    display: none !important;
}
.call-banner-container .call-on-hold-flag {
position: absolute;
    width: 77px;
    bottom: 6px;
    left: -18px;
    height: 14px;
    line-height: 14px;
    z-index: 2;
    opacity: 0.9;
}
.call-banner-container .call-on-hold-flag .flag-container {
    position: absolute;
    width: 77px;
    display: flex;
}
.call-banner-container .call-on-hold-flag .flag {
    position: relative;
    width: auto;
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding: 2px 5px 2px 5px;
    text-align: center;
    text-transform: uppercase;
    border-radius: 10px;
    font-size: 11px;
}
.option-row.disabled-control {
    opacity: 0.4;
}
#unavailable-info .modal-dialog {
    width: 410px !important;
}
#unavailable-info .modal-footer {
    display: none;
}
.webrtc-media {
    position: absolute;
    top: 0px;
    height: 0px;
    overflow: hidden;
}
.js-call-notification-dialog {
    display: none;
    width: 346px;
    margin-left: 2px;
    margin-right: 2px;
}
#call-banner-manager .small-call-banner-container {
    position: absolute;
    display: none;
    width: 350px;
    height: 50px;
    top: -50px;
    left: 250px;
    z-index: 3;
}
#call-banner-manager .small-call-banner-container.active {
    display: block;
    top: 0;
}
#call-banner-manager .small-call-banner-container .user-image {
    margin: 5px 0 5px 5px;
    position: relative;
}
#call-banner-manager .small-call-banner-container .user-image .wt-supervisor-level-icon {
    position: absolute;
    top: -5px;
    right: -5px;
}
#call-banner-manager .small-call-banner-container.multiple .user-image {
    display: none;
}
#call-banner-manager .small-call-banner-container .big-speaker-icon {
    display: none;
    float: left;
    width: 40px;
    height: 40px;
    margin: 5px 0 5px 5px;
}
#call-banner-manager .small-call-banner-container.multiple .big-speaker-icon {
    display: inline-block;
}
#call-banner-manager .small-call-banner-container .details {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    padding: 0 10px;
}
#call-banner-manager .small-call-banner-container .details .top-line {
    display: flex;
}
#call-banner-manager .small-call-banner-container .details .top-line .name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#call-banner-manager .small-call-banner-container.multiple .details .top-line .user-image,
#call-banner-manager .small-call-banner-container.multiple .details .top-line .priority {
    display: none;
}
#call-banner-manager .small-call-banner-container .details .top-line .priority {
    flex-grow: 1;
    flex-shrink: 0;
    margin-left: 5px;
}
#call-banner-manager .small-call-banner-container .details .bottom-line {
    padding-right: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#call-banner-manager .small-call-banner-container.multiple .details .bottom-line .priority {
    display: none;
}
#call-banner-manager .speaker-icon {
    display: inline-block;
    width: auto;
    min-width: 18px;
    height: 18px;
    margin-right: 5px;
}
#call-banner-manager .small-call-banner-container.multiple .details .bottom-line .speaker-icon {
    display: none;
}
#call-banner-manager .banners-menu-container {
    position: absolute;
    bottom: 0;
    z-index: 1;
    width: 200px;
}
#call-banner-manager .banners-menu {
    position: absolute;
    top: -1px;
    z-index: 1;
    width: 100%;
    display: none;
    overflow: hidden;
    max-height: 127px;
}
#call-banner-manager .banners-menu > .channel-item {
    height: 25px;
    width: 100%;
}
#call-banner-manager .banners-menu > .channel-item > .channel-info {
    display: flex;
    align-items: center;
    width: 100%;
}
#call-banner-manager .banners-menu > .channel-item > .channel-info > .speaker-icon {
    display: none;
}
#call-banner-manager .banners-menu > .channel-item.playing > .channel-info > .speaker-icon {
    display: block;
}

#call-banner-manager > .collapse-controls {
    display: block;
    position: absolute;
    bottom: -23px;
    right: calc(50% - 20px);
    width: 40px;
    height: 23px;
}
#call-banner-manager.empty > .collapse-controls {
    display: none;
}
#call-banner-manager.collapsed > .collapse-controls {
    position: fixed;
    top: 54px;
    left: calc((175px + 50vw) - 20px);
}
#call-banner-manager.collapsed {
    height: 0px;
    overflow: hidden;
}
#call-banner-manager > .collapse-controls span {
    display: none;
    opacity: 1 !important;
    width: 100%;
    height: 100%;
    line-height: 18px;
}
#call-banner-manager:not(.collapsed) > .collapse-controls span[data-role=collapse] {
    display: inline-block;
}
#call-banner-manager.collapsed > .collapse-controls span[data-role=expand] {
    display: inline-block;
}
.modal-dialog.modal-nowtsub button.close {
    display:none !important;
}

.modal-nowtsub {
    width: 660px;
}

.modal-nowtsub .conversation-contacts .name {
    float: left;
}

.modal-nowtsub .modal-title{
    margin-left: 2px;
    font-weight: bold;
}

.modal-nowtsub .modal-body p {
    text-align: left!important;
    font-size: 14px;
}

.modal-nowtsub .text-message {
    text-align: left!important;
}

.modal-nowtsub .conversation-contacts {
    width: 299px!important;
    margin-left: 0px!important;
    margin-right: 16px;
}

.modal-nowtsub .conversation-contacts:nth-child(odd) {
    margin-right: 0px;
}

.modal-nowtsub .modal-footer {
    padding: 0px 20px 20px;
    margin-top: -10px;
    position: relative;
}

.modal-nowtsub .modal-footer .sw-button {
    width: 86px;
    margin-top: -10px;
}

.call-details-participants .participant {
    margin: 0px;
}
.call-details-participants .subscriber {
    width: 270px;
    position: relative;
}
.call-details-participants .user-info {
    margin: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 200px;
    height: 62px;
}
.call-details-modal {
    width: 595px !important;
}
.call-details .modal-content .call-message-body {
    height: auto;
    min-height: 35px;
    padding: 0;
}
.call-details .modal-content .message {
    margin: 0 !important;
}
.call-details-participants {
    max-height: 500px;
    width: 100%;
}
.call-banner-container .names {
    width: 400px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.modal-dialog.enable-audio,
.modal-dialog.no-device-audio,
.modal-dialog.browser-support {
    width: 400px;
}
.modal-dialog.browser-support .text-message {
    text-align: justify;
}
.modal-dialog.enable-audio .text-message {
    text-align: justify;
}
.modal-dialog.enable-audio #acknowledge,
.modal-dialog.browser-support #acknowledge {
    width: 140px;
}
.modal-dialog.enable-audio .modal-footer,
.modal-dialog.browser-support .modal-footer {
    text-align: center;
    padding: 0 20px 20px;
    margin-top: 0;
}
.browser-support .info-checkbox-container {
    margin-top:30px;
}
.browser-support br {
    margin-top: 8px;
    display: block;
    content: "";
}
.browser-support ul {
    padding-left: 30px
}
.webrtc-participants-editor {
    position: absolute;
    top:0px;
    width: 100%;
    height: 100%;
}
.webrtc-participants-editor .header-bar {
    position: absolute;
    top:0px;
    width: 100%;
    height: 118px;
    padding-top: 30px;
    padding-left: 35px;
}
.webrtc-participants-editor .selected-recipients {
    position: absolute;
    top: 119px;
    width: 100%;
    height: calc(100% - 119px - 72px);
}
.webrtc-participants-editor .selected-recipients .scrolled-container {
    position: absolute;
    width: 100%;
    height: auto;
    min-height: 100%;
    padding-top: 10px;
    padding-bottom: 30px;
}
.webrtc-participants-editor .controls-bar {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    height: 72px;
    padding-left: 20px;
    padding-right: 20px;
}
.webrtc-participants-editor .controls-bar .sw-button {
    width: auto;
    min-width: 100px;
    margin-left: 10px;
}
.webrtc-participants-editor .controls-bar td {
    vertical-align: top;
}
.webrtc-participants-editor .selection-status-container {
    width: 100%;
}
.webrtc-participants-editor .selection-status {
    width: 100%;
}
.webrtc-participants-editor .controls-bar .buttons {
    white-space: nowrap;
    display: flex;
}
.wt-supervisor-info {
    display: flex;
    width:200px;
}
.hidden-supervisor-level .wt-supervisor-info {
    display: none;
}
.wt-supervisor-level-icon {
    display: inline-block;
    width: 19px;
    height: 19px;
    vertical-align: middle;
}
.wt-supervisor-text {
    margin-left: 5px;
    width: 175px;
}
/* CHANNEL VOLUME CONTROL */
.banner-volume-control{
    position: absolute;
    top: 38px;
    left: 380px;
    width: 250px;
    display: none;
}
.WALKIETALKIE_CHANNEL.with-duration-counter .banner-volume-control {
    display: none;
}
.WALKIETALKIE_CHANNEL:not(.talk-button-down) .call-status-bar {
    width: 290px;
}
.WALKIETALKIE_CHANNEL .banner-volume-control {
    display: block;
}
.banner-volume-control .volume-label{
    position: relative;
    display: table-cell;
}
.banner-volume-control .volume-button{
    position: relative;
    display: table-cell;
    font-size: 18px;
    vertical-align: middle;
    padding-left: 5px;
    cursor: pointer;
}
.banner-volume-control .volume-button .volume-mute{
    position: absolute;
    top: 8px;
    left: 0;
    width: 28px;
    height: 2px;
    transition: transfom;
    transform: rotate(45deg);
    display: none;
}
.banner-volume-control .volume-button .volume-mute.show{
    display: block;
}
.banner-volume-control .slider-bar {
    position: relative;
    width: 210px;
    height: 10px;
    top: 4px;
    left: 10px;
    display: table-cell;
}
.banner-volume-control .slider-bar.with-stops-bar {
    height: 48px;
}
.banner-volume-control .slider-bar .bar {
    position: absolute;
    display: block;
    width: calc(100% - 2px);
    height: 0px;
    top: 5px;
    border-radius: 6px;
    cursor: pointer;
}
.banner-volume-control .slider-bar .bar .bg,
.banner-volume-control .slider-bar .bar .range {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: -1px;
    left: -1px;
    border-radius: 6px;
}
.banner-volume-control .slider-bar .slider {
    position: absolute;
    width: 10px;
    height: 10px;
    top: 1px;
    cursor: pointer;
    z-index: 2;
    border-radius: 50%;
    margin-left: -1px;
}
.banner-volume-control .slider-bar .slider:after {
    position: absolute;
    top: -7px;
    width: 0;
    height: 0;
}
.banner-volume-control .slider-bar.with-stops-bar .stops-bar {
    display: flex;
}
.banner-volume-control .slider-bar .stops-bar {
    position: absolute;
    display: none;
    width: calc(100% - 2px);
    height: 22px;
    top: 24px;
}
.banner-volume-control .slider-bar .stops-bar .stop {
    cursor: pointer;
    position: absolute;
}

.banner-volume-control .slider-bar .bar .bg{
    position: absolute;
    display: block;
    width: 100%;
    height: 2px;
    top: -1px;
    left: -1px;
    border-radius: 6px;
    border: none;
}
.banner-volume-control .slider-bar .bar .range{
    visibility: hidden;
    display: none;
}
.video-stream-banners {
    display: none;
    position: relative;
    width: 100%;
    height: auto;
    overflow: hidden;
}
.video-stream-banners .active-banner-container {
    width: 100%;
    height: 35px;
    display: flex;
}
.video-stream-banners .selector-counter {
    width: 35px;
    height: 35px;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
}
.video-stream-banners .selector-counter {
    display: none;
    width: 35px;
    height: 35px;
    flex-direction: column;
    flex-shrink: 0;
}
.video-stream-banners.with-multiple-banners .selector-counter {
    display: inline-block;
}
.video-stream-banners .active-banner {
    display: inline-block;
    height: 35px;
    flex-grow: 1;
}
.video-stream-banners .video-stream-banners-selector {
    display: none;
    position: fixed;
    z-index: 2;
}
.video-stream-banners .selector-counter .collapse-controls span {
    display: none;
}
.video-stream-banners:not(.selector-expanded) .selector-counter .collapse-controls span[data-role=expand] {
    display: block;
}
.video-stream-banners.with-multiple-banners.selector-expanded .video-stream-banners-selector {
    display: block;
}
.video-stream-banners.selector-expanded .selector-counter .collapse-controls span[data-role=collapse] {
    display: block;
}
.video-stream-banner {
    display: none;
    width: 100%;
    height: 35px;
    line-height: 35px;
    padding-right: 10px;
}
.video-stream-banner.active {
    display: flex;
}
.video-stream-banner > div,
.video-stream-banner .control {
    margin-left: 10px;
}
.video-stream-banner .streamer-data {
    flex-grow: 1;
    display: flex;
}
.video-stream-banner .streamer-data .streamer-name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: calc(100% - 100px);
}
.video-stream-banner .controls,
.video-stream-banner .share-controls {
    display: flex;
    flex-shrink: 0;
}
.video-stream-banner .control.share-button,
.video-stream-banner .control.stop-share-button,
.video-stream-banner .control.stop-button {
    height: 25px;
    line-height: 25px;
    margin-top: 5px;
    padding: 0 10px;
}
.video-stream-banner .control.stop-share-button {
    display: none;
}
.video-stream-banner .control.viewers {
    display: none;
}
.video-stream-banner.live .control.viewers {
    display: flex;
}
.video-stream-banner .control.viewers .viewers-count {
    margin-left: 5px;
}
.video-stream-banner-short {
    position: relative;
    width: 400px;
    height: 35px;
    line-height: 35px;
    padding-right: 10px;
}
.video-stream-banner-short .streamer-name {
    white-space: nowrap;
    width: auto;
    max-width: 280px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.video-stream-banner-short .streamer-data {
    flex-grow: 1;
}
.video-stream-banner-short,
.video-stream-banner-short .controls {
    display: flex;
}
.video-stream-banner-short .controls {
    font-size: 17px;
}
.video-stream-banner-short .controls .separator {
    width: 1px;
    height: calc(100% - 10px);
    margin-top: 5px;
    margin-left: 10px;
}

.video-stream-banner-short > div,
.video-stream-banner-short .control {
    margin-left: 10px;
}

.screen-share-banner {
    width: 100%;
    height: 50px;
    line-height: 50px;
    display: flex;
}
.screen-share-banner.hidden {
    display: none;
}
.screen-share-banner .live-marker {
    margin-left: 10px;
    margin-right: 10px;
}
.screen-share-banner .streamer-data {
    display: flex;
    flex-grow: 1;
}
.screen-share-banner .streamer-data .streaming-status {
    margin-right: 10px;
}
.screen-share-banner .controls,
.screen-share-banner .playing-controls {
    position: relative;
    right: 10px;
    display: flex;
}
.screen-share-banner .playing-controls .control {
    min-width: 60px;
}
.screen-share-banner .control {
    display: inline-block;
    margin-right: 10px;
    text-align: center;
}
.screen-share-banner .control.two-lines {
    line-height: 20px;
    margin-top: 5px;
}
.screen-share-banner.inactive .viewers,
.screen-share-banner.inactive .playing-controls {
    display: none;
}
.screen-share-banner .control.resume {
    display: none;
}
.screen-share-banner.paused .control.resume {
    display: inline-block;
}
.screen-share-banner.paused .control.pause {
    display: none;
}
.screen-share-banner .control.stop-button {
    height: 25px;
    line-height: 25px;
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 11px;
}
/* Disable all screen/camera share buttons */
body.screen-share-active [data-role=screen-share-trigger],
body.screen-share-active [data-role=screen-share-trigger] *,
body.camera-share-active [data-role=camera-share-trigger],
body.camera-share-active [data-role=camera-share-trigger] * {
    opacity: 0.6;
    cursor: default !important;
}
body.screen-share-feature-disabled [data-role=screen-share-trigger],
body.screen-share-feature-disabled [data-role=screen-share-trigger] *,
body.camera-share-feature-disabled [data-role=camera-share-trigger],
body.camera-share-feature-disabled [data-role=camera-share-trigger] * {
    display: none !important;
}
@media (max-width: 1260px) {

    #call-banner-manager {
        left: 351px;
    }

}
.call-banners .banner-buttons .transfer-call.disabled-control {
    filter: none !important;
    opacity: 0.4 !important;
}
.call-transfer-contacts-selector .search-block {
    margin: 0 !important;
}
.call-transfer-contacts-selector .button-container {
    text-align: right;
    width: 310px;
    left: 20px;
    position: relative;
    margin-bottom: 5px;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
}
.call-transfer-contacts-selector .transfer-button {
    position: relative;
    width: auto;
}
.call-transfer-contacts-selector .transfer-button .icon {
    position: absolute;
    left: 7px;
}
.call-transfer-contacts-selector .button-container .call-out-button {
    position: relative;
}
.call-banner-container .name .last-floor-owner {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


/* --- /styles/bootstrap-datetimepicker.css--- */ 

.bootstrap-datetimepicker-widget.dropdown-menu {
    /*min-width: 212px;*/
}
.bootstrap-datetimepicker-widget.dropdown-menu.usetwentyfour .timepicker {
    width: 170px;
}
.bootstrap-datetimepicker-widget .col-md-6 {
    width: 30%;
}
.bootstrap-datetimepicker-widget.dropdown-menu {
    width: auto;
    white-space: nowrap;
}
.bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs {
    min-width: 364px;
    width: auto;
}
.bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs .timepicker,
.bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs .datepicker {
    width: auto;
    max-width: none;
    flex-grow: 1;
}

.bootstrap-datetimepicker-widget>.row>.timepicker{
    max-width:min-content;
    flex: auto;
}

.bootstrap-datetimepicker-widget>.row{
    justify-content: space-between;
    flex-wrap: nowrap;
}

.bootstrap-datetimepicker-widget .timepicker {
     width: 239px;
}
.bootstrap-datetimepicker-widget .datepicker,
.bootstrap-datetimepicker-widget .timepicker {
    padding: 0;
    float: none;
}
.bootstrap-datetimepicker-widget table th {
    min-width: 34px;
}
.bootstrap-datetimepicker-widget.dropdown-menu .timepicker {
    width: 175px;
}
.bootstrap-datetimepicker-widget.timepicker-sbs .row{
    display: flex;
}
.bootstrap-datetimepicker-widget .datepicker thead tr:first-child {
    height: 45px;
}
.bootstrap-datetimepicker-widget table td.today::before {
    display: none !important;
}
.bootstrap-datetimepicker-widget .timepicker {
    position: relative;
}
.bootstrap-datetimepicker-widget .timepicker button[data-action="togglePeriod"],
.bootstrap-datetimepicker-widget .timepicker-hour, 
.bootstrap-datetimepicker-widget .timepicker-minute, 
.bootstrap-datetimepicker-widget .timepicker-second {
    width: 36px;
    height: 30px;
    line-height: 30px;
}
.bootstrap-datetimepicker-widget .timepicker-picker a {
    line-height: 40px;
}
.bootstrap-datetimepicker-widget .timepicker button[data-action="togglePeriod"] {
    line-height: 15px;
    display: block;
    margin-right: 10px;
}
.bootstrap-datetimepicker-widget .timepicker-label {
    height: 45px;
    line-height: 45px;
    display: block;
}
.bootstrap-datetimepicker-widget.usetwentyfour .timepicker-label {
    padding: 0;
}
.bootstrap-datetimepicker-widget .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.bootstrap-datetimepicker-widget table td.day {
    height: 20px;
    line-height: 20px;
    width: 30px;
}
.bootstrap-datetimepicker-widget table td span {
    width: 40px;
    height: 40px;
    line-height: 40px;
}
.bootstrap-datetimepicker-widget.timepicker-sbs:not(.usetwentyfour) .timepicker-picker table tr td:last-child {
    width: 0;
    padding: 0;
}

.bootstrap-datetimepicker-widget.dropdown-menu.bottom:before {
    top: -11px;
    left: 7px;
}
.bootstrap-datetimepicker-widget.dropdown-menu.bottom:after {
    top: -10px;
    left: 8px;
}
.bootstrap-datetimepicker-widget.dropdown-menu.bottom:before {
    top: -11px;
    left: 7px;
}
.bootstrap-datetimepicker-widget.dropdown-menu.bottom:after {
    top: -10px;
    left: 8px;
}
.bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs.bottom:before {
    top: -7px;
    left: 7px;
}
.bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs.bottom:after {
    top: -6px;
    left: 8px;
}
.bootstrap-datetimepicker-widget .table-condensed > thead > tr > th, 
.bootstrap-datetimepicker-widget .table-condensed > tbody > tr > th, 
.bootstrap-datetimepicker-widget .table-condensed > tfoot > tr > th, 
.bootstrap-datetimepicker-widget .table-condensed > thead > tr > td, 
.bootstrap-datetimepicker-widget .table-condensed > tbody > tr > td, 
.bootstrap-datetimepicker-widget .table-condensed > tfoot > tr > td {
    padding: 4px;
}
.bootstrap-datetimepicker-widget .table-condensed > tbody > tr > td {
     padding: 4px 0;
}
.bootstrap-datetimepicker-widget .timepicker .table-condensed > tbody > tr > td {
    padding: 5px;
}
.bootstrap-datetimepicker-widget.force-right {
    right: 0 !important;
    left: auto !important;
}
.bootstrap-datetimepicker-widget table td {
    white-space: normal;
}

/* --- /styles/video-call-popup.css--- */ 

.video-call-body video::-webkit-media-controls {
  display: none;
}
body.video-call-body {
    width: 100vw;
    height: 100vh;
    margin: 0px;
    padding: 0px;
    overflow: hidden;
}
.video-call-popup,
.video-call-popup .call-container {
    position: absolute;
    width: 100%;
    height: 100%;
}
.video-call-popup .call-container {
    /*display: none;*/
}
.video-call-popup video {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0px;
    top: 0px;
}
.video-call-popup .notification-bar {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 30px;
}
.video-call-popup .notification-bar .bg {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1;
}
.video-call-popup .notification-bar .message {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 2;
}
.video-call-popup .remote-video-container {
    position: absolute;
    width: 100%;
    height: 100%;
    text-align: center;
}
.video-call-popup .local-video-container {
    position: absolute;
    top: 7px;
    right: 7px;
    width: 162px;
    height: 107px;
}
.video-call-popup .controls-bar {
    position: absolute;
    left: 0px;
    bottom: 7px;
    width: 100%;
    height: 30px;
    text-align: center;
    z-index: 2;
}
.video-call-popup .controls-bar .control {
    position: relative;
    width: 120px;
    height: 30px;
    text-align: center;
    display: inline-block;
    margin-left: 5px;
    margin-right: 5px;
}
.video-call-popup .full-screen-button {
    position: absolute;
    bottom: 5px;
    right: 5px;
    width: 52px;
    height: 28px;
    z-index: 2;
}


/* --- /styles/contacts-selector-layer.css--- */ 

.contacts-selector-layer {
    display: flex;
    flex-direction: column;
    padding-top: 15px;
    height: 100%;
}
.contacts-selector-layer .no-records{
    position: absolute;
    top: 110px;
    left: 0px;
    width: 100%;
    height: calc(100% - 110px);
    z-index: 2;
    margin: 0px !important;
    padding-top: 50px;
    display: none;
    text-align: center;
}
.contacts-selector-layer .load-more-button {
    position: relative;
    display: block;
}
.contacts-selector-layer.with-previous-recipients .no-records{
    top: 185px;
    height: calc(100% - 185px);
}
.contacts-selector-layer > * {
    flex-shrink: 0;
}
.contacts-selector-layer .previous-recipients {
    padding: 15px 0 10px 20px;
    margin: 10px 0;
}
.contacts-selector-layer .previous-recipients .recipients-icon {
    position: absolute;
    margin-left: 5px;
}
.contacts-selector-layer .title-and-filter {
    display: flex;
}
.contacts-selector-layer .title-and-filter > .subtitle-block {
    padding: 5px 20px;
    flex: 1;
    line-height: 40px;
}
.contacts-selector-layer > .search-block {
    position: relative;
    padding: 5px 20px;
    margin-bottom: 10px;
}
.contacts-selector-layer > .search-block .search-reset-button {
    right: 20px;
    top: 5px;
}
.contacts-selector-layer .title-and-filter > .filter-block {
    padding: 5px 10px 5px 5px;
}
.contacts-selector-layer .filter-block .filter-active {
    display: none;
}
.contacts-selector-layer .filter-block .active .filter-active {
    display: inline-block;
}
.contacts-selector-layer .filter-block .active .filter-inactive {
    display: none;
}
.contacts-selector-layer > .list-block {
    flex-grow: 1;
    flex-shrink: 1;
    z-index: 1;
    overflow-x: hidden;
    overflow-y: auto;
    /* 'scroll' is not supported by all browsers */
    overflow-y: scroll;
}
.contacts-selector-layer .list-block-search {
    overflow-x: hidden;
    overflow-y: auto;
    height: calc(100% - 110px);
}
.contacts-selector-layer .contacts-selector-item {
    position: relative;
}
.contacts-selector-layer .contacts-selector-item:after {
    content: "";
    position: absolute;
    bottom: -1px;
    left:0;
    width: 100%;
    height: 1px;
}
.contact-selector-list-container {
    position: relative;
    width: calc(100% - 20px);
}
.contacts-selector-item {
    display: flex;
    width: 100%;
    height: 60px;
    box-sizing: border-box;
    flex-wrap: wrap;
}
.contacts-selector-item > * {
    height: 100%;
    flex-shrink: 0;
    display: inline-block;
}
.contacts-selector-item .checkbox-block {
    padding: 20px 5px 0;
}
.contacts-selector-item .checkbox-block label {
    margin: 0;
}
.contacts-selector-item .avatar-block {
    padding: 9px 5px 0;
    position: relative;
}
.contacts-selector-item .avatar-block .user-availability-flag {
    top: 7px;
    right: 3px;
}
.contacts-selector-item .avatar-block .subscriber-avatar {
    width: 42px;
    height: 42px;
}
.contacts-selector-item.group .avatar-block .subscriber-avatar {
    display: none;
}
.contacts-selector-item .avatar-block .group-avatar {
    display: none;
}
.contacts-selector-item.group .avatar-block .group-avatar {
    display: block;
    width: 42px;
    height: 42px;
    padding-top: 21px;
}
.contacts-selector-item .name-block {
    flex-grow: 1;
    flex-shrink: 0;
    max-width: calc(90% - 60px);
}
.contacts-selector-previous-recipients .modal-dialog {
    width: 600px;
}
.contacts-selector-previous-recipients .contacts-selector-item {
    display: inline-flex;
    width: calc(50% - 5px);
    margin-bottom: 10px;
}
.contacts-selector-previous-recipients .contacts-selector-item:nth-child(even) {
    margin-left: 10px;
}
.contacts-selector-item .expand-controls {
    display: none;
    width: 30px;
    text-align: center;
    line-height: 60px;
    font-size: 15px;
}
.contacts-selector-item .children-container {
    display: none;
    flex-direction: column;
    position: relative;
    height: auto;
    width: 100%;
}
.contacts-selector-item .children-container .children-list {
    flex-grow: 1;
}
.contacts-selector-item .load-more {
    display: none;
    position: relative;
    height: auto;
    width: 100%;
}
.contacts-selector-item.expanded > .children-container {
    display: flex;
}
.contacts-selector-item .expand-controls span {
    display: none;
}
.contacts-selector-item:not(.expanded) .expand-controls span[data-role=expand] {
    display: block;
}
.contacts-selector-item.expanded .expand-controls span[data-role=colapse] {
    display: block;
}
.contacts-selector-item.with-expand-controls > .expand-controls {
    display: inline-block;
}
.contacts-selector-item.hidden-by-filter,
.contacts-selector-item.hidden-by-search {
    display: none;
}
.contacts-selector-item.child-item {
    margin-left: 20px;
}
.contacts-selector-slider-container {
    position: absolute;
    left: calc((100% - 1260px) / 2);
    width: 350px;
    height: calc(100vh - 56px);
    top: 56px;
    z-index: 1000;
}
.contacts-selector-slider-container.with-logo {
    top: 210px;
    height: calc(100vh - 210px);
}

/* --- /styles/mybusiness-global.css--- */ 

.mybusiness .right-area {
    display: none;
}
.mybusiness .processes-reporting-renderer .ps-scrollbar-y-rail,
.mybusiness .right-area.process-history-renderer .ps-scrollbar-y-rail, 
.mybusiness .process-editor .pages div:not(.scrollable-container) > .ps-scrollbar-y-rail {
    right: 0px !important;
}
.mybusiness .processes-reporting-renderer .ps-scrollbar-x-rail,
.mybusiness .right-area.process-history-renderer .ps-scrollbar-x-rail, 
.mybusiness .process-editor .pages div:not(.scrollable-container) > .ps-scrollbar-x-rail {
    bottom: 0px !important;
}
.myb-select-contact-dropdown {
    display: block;
    width: 250px;
    height: 300px;
    position: relative;
}
.myb-select-contact-dropdown > .search-block {
    position: absolute;
    top: 10px;
    width: 100%;
    left: 0px;
}
.myb-select-contact-dropdown > .search-block input {
    min-width: 0;
}
.myb-select-contact-dropdown > .scroll-block {
    overflow: hidden;
    position: absolute;
    height: calc(100% - 58px);
    top: 50px;
    width: 100%;
}
.myb-select-contact-dropdown > .list-block {
    position: relative;
    min-height: 100%;
    height: auto;
    width: 100%;
}
.myb-select-contact-dropdown > .no-results {
    position: absolute;
    top: 60px;
    width: 100%;
    margin: 0px;
    display: none;
}
/* "Grid" data */
.mybusiness .columns-1 {
    width: calc(16.66% - 2px);
}
.mybusiness .columns-2 {
    width:  calc(33.32% - 2px);
} 
.mybusiness .columns-3 {
    width:  calc(50% - 2px);
} 
.mybusiness .columns-4 {
    width:  calc(66.64% - 2px);
} 
.mybusiness .columns-5 {
    width:  calc(83.3% - 2px);
} 
.mybusiness .columns-6 {
    width:  calc(100% - 2px);
}  
.mybusiness .with-clear-button {
    padding-right: 25px !important;
}
.mybusiness .widget-content.textarea .with-clear-button {
    padding-right: 20px !important;
}
.mybusiness .widget-content.textarea {
    z-index: 3;
}
.mybusiness .widget-content.info .info-content {
    word-break: break-all;
}
.mybusiness .input-clear-button {
    width: 20px;
    height: 30px;
    position: absolute;
    right: 0px;
    z-index: 2;
    display: none;
}
.mybusiness .widget-content.location .input-clear-button,
.mybusiness .widget-content.currency .input-clear-button {
    right: 32px;
}
.mybusiness .widget-content.currency.with-dropdown .input-clear-button {
    right: 65px;
}
.mybusiness .widget-content.textarea .input-clear-button {
    right: 6px;
}
.mybusiness .widget-content.location input.with-clear-button,
.mybusiness .widget-content.currency input.with-clear-button {
    padding-right: 50px !important;
}
.mybusiness .widget-content.currency.with-dropdown input.with-clear-button {
    padding-right: 80px !important;
}
.mybusiness .widget-content .forced-padding {
    padding-bottom: 200px;
}
.mybusiness .global-options {
    position: absolute;
    right: 20px;
    top: 33px;
}
*[dir='rtl'] {
    .mybusiness .global-options {
        left: 20px;
    }
}
.mybusiness .global-options .trigger-button {
    width: 23px;
    height: 23px;
    text-align: center;
}
.mybusiness .global-options .menu {
    position: absolute;
    right: -65px;
    top: 35px;
    min-width: 150px;
    display: none;
    z-index: 3;
}
.mybusiness .global-options .menu .top-arrow {
    display: block;
    width: 15px;
    height: 10px;
    position: absolute;
    top: -10px;
    right: calc(50% - 7px);
}
.mybusiness .global-options .menu .option-row {
    display: block;
    padding: 7px 0;
    margin: 0 10px;
    height: 38px;
    white-space: nowrap;
}
.mybusiness .global-options .menu .option-row span {
    vertical-align: middle;
    margin-right: 5px;
    display: inline-block;
    width: 18px;
    height: 22px;
}
.mybusiness .global-options .menu .option-row.process-reports span {
    line-height: 25px !important;
    height: 28px;
}
.my-business-not-activated-dialog {
    width: 600px;
}
.my-business-not-activated-dialog .my-business-not-activated .title {
    padding-bottom: 15px;
}
.my-business-not-activated-dialog .my-business-not-activated .users-list {
    height: auto;
    max-height: calc(100vh - 200px);
    overflow-y: auto;
    display: flex;
}
.my-business-not-activated-dialog .contacts-selector-item {
    width: calc(50% - 20px);
    margin: 10px;
    display: inline-flex;
    position: relative;
}
.my-business-not-activated-dialog .group-warning {
    display: block;
    margin: 0;
    line-height: 9px;
    position: absolute;
    width: calc(100% - 51px);
    height: auto;
    top: 38px;
    left: 51px;
    font-size: 11px;
}

/* --- /styles/mybusiness-processes-tabs.css--- */ 

.mybusiness .tabs-container {
    display: flex;
    justify-content: space-around;
    margin-top: 10px;
}
.mybusiness .tabs-container .tab {
    position: relative;
    display: flex;
    width: 50%;
    justify-content: center;
    padding-bottom: 7px;
}
.mybusiness .tabs-container .tab .text {
    display: inline-block;
    position: relative;
    line-height: 20px;
    text-transform: uppercase;
}
.mybusiness .tabs-container .tab .unread-circle {
    margin-left: 10px;
    display: none;
}
.mybusiness .left-area .unread-circle {
    display: inline-block;
    position: relative;
    line-height: 16px;
    width: auto;
    min-width: 16px;
    height: 16px;
    border-radius: 9px;
    padding: 0 4px;
}
.mybusiness .tabs-controls-bar {
    position: absolute;
    top: 0;
    left: 0;
    height: 42px;
    line-height: 42px;
    display: flex;
    width: 100%;
}
.mybusiness .tabs-controls-bar .checkbox-block {
    margin-left: 15px;
    flex-grow: 1;
}
.mybusiness .tabs-controls-bar .checkbox-block [data-role=check-icon] {
    margin-right: 3px;
}
.mybusiness .tabs-controls-bar .checkbox-block [data-role=check-icon],
.mybusiness .processes-group .header-bar [data-role=check-icon] {
    font-size: 16px !important;
}
.mybusiness .tabs-controls-bar .multiselection-controls {
    flex-grow: 1;
}
.mybusiness .resources-controls .control-icon { 
    width: auto;
    margin-left: 17px;
}
.mybusiness .tabs-scrollable-list:not(.multi-select-on) .checkbox-block {
    display: none;
}
.mybusiness .tabs-scrollable-list:not(.multi-select-on) .processes-group .header-bar > .title {
    left: 19px;
    max-width: calc( 100% - 20px);
}
.mybusiness .tabs-no-records,
.mybusiness .tabs-scrollable-list,
.mybusiness .tabs-search-results,
.mybusiness .tabs-no-search-results {
    position: absolute;
    top: 42px;
    height: calc(100% - 42px);
    width: 100%;
    z-index: 1;
}
.mybusiness .tabs-scrollable-list {
    overflow-y: auto;
    overflow-y: scroll;
}
.mybusiness .tabs-no-records {
    z-index: 2;
    display: none;
}
.mybusiness .tabs-no-records .message,
.mybusiness .tabs-no-search-results .message {
    position: absolute;
    top: calc(50% - 20px);
    text-align: center;
    width: 60%;
    min-height: 20px;
    height: auto;
    margin:0 20%;
}
.mybusiness .tabs-search-results {
    z-index: 3;
    display: none;
}
.mybusiness .tabs-no-search-results {
    z-index: 4;
    display: none;
}
.mybusiness .progress-bar-container,
.mybusiness .progress-bar {
    position: absolute;
    height: 2px;
}
.mybusiness .progress-bar-container {
    width: 100%;
    display: none;
}
.mybusiness .progress-bar {
    width: 0%;
}
.mybusiness .processes-tab .tabs-no-records {
    display: none;
}
.mybusiness .processes-group {
    width: 100%;
    position: relative;
    height: auto;
    min-height: 30px;
}
.mybusiness .processes-group.hidden-by-search {
    display: none;
}
.mybusiness .processes-group .header-bar {
    display: flex;
    top: 0px;
    position: relative;
    /* not all browsers supports sticky*/
    position: sticky;
    width: 100%;
    height: 30px;
    z-index: 2;
}
.mybusiness .processes-group .checkbox-block {
    width: 30px;
    height: 30px;
}
.mybusiness .processes-group .header-bar .unread-circle {
    position: absolute;
    display: none;
    right: 53px;
    top: 7px;
}
.mybusiness .processes-group .header-bar .customized-checkbox {
    position: absolute;
    left: 15px;
    top: 6px;
}
.mybusiness .processes-group .processes-list {
    top: 0px;
    position: relative;
    width: 100%;
    height: auto;
    display: block;
}
.mybusiness .processes-group .processes-list.with-load-more-button {
    padding-bottom: 40px;
}
.mybusiness .processes-group .processes-list.with-load-more-button .load-more-button {
    display: block;
}
.mybusiness .processes-group .processes-list.hidden-by-search {
    display: none;
}
.mybusiness .processes-group .processes-list .load-more-button-container{
    position: relative;
    width: 100%;
    text-align: center;
}
.mybusiness .processes-group .processes-list .load-more-button-container .load-more-button{
    position: relative;
    padding: 0.5em 1em;
    margin: 1em;
    border: none;
    border-radius: 10px;
}
.mybusiness .processes-group .disablement-mask {
    position: absolute;
    top: 30px;
    left: 0px;
    width: 100%;
    height: calc(100% - 30px);
    z-index: 2;
    opacity: 0.5;
    display: none;
}
.mybusiness .processes-group .header-bar .expand-collapse {
    position: absolute;
    width: 40px;
    right: 10px;
    height: 100%;
    display: inline-block;
}
.mybusiness .processes-group .header-bar > .title {
    position: absolute;
    left: 39px;
    max-width: calc( 100% - 40px);
    padding-right: 18px;
    width: auto;
    height: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    line-height: 30px;
    display: flex;
}
.mybusiness .processes-group .header-bar .counter,
.mybusiness .processes-group .header-bar .counter-for-search {
    position: relative;
    top: 0px;
    right: 0px;
    line-height: 30px;
    flex-shrink: 0;
    display: inline-block;
}
.mybusiness .processes-group .header-bar .group-role {
    position: relative;
    line-height: 30px;
    flex-grow: 1;
    display: inline-block;
    margin-right: 3px;
}
.mybusiness .processes-group .header-bar .counter-for-search {
    display: none;
}
.mybusiness .processes-group .header-bar .expand-collapse span {
    display: block;
    width: 100%;
    height: 100%;
    text-align: center;
    line-height: 30px !important;
}
.mybusiness .processes-group .header-bar .expand-icon {
    display: none !important;
}
.mybusiness .processes-group.collapsed .header-bar .collapse-icon {
    display: none !important;
} 
.mybusiness .processes-group.collapsed .header-bar .expand-icon {
    display: block !important;
}
.mybusiness .processes-group.collapsed .processes-list {
    display: none !important;
} 
.mybusiness .processes-group.loading .progress-bar-container {
    display: block;
} 
.mybusiness .processes-tab.multiselect .process-item .checkbox-block {
    display: block;
}
.mybusiness .processes-tab.multiselect .process-item .icon-block {
    left: 30px;
}
.mybusiness .processes-tab.multiselect .process-item .title-block {
    margin-left: 57px;
}
.mybusiness .processes-tab.onsearch .processes-group .counter {
    display: none;
}
.mybusiness .processes-tab.onsearch .processes-group .counter-for-search {
    display: block;
}
.mybusiness .tabs-controls-bar .control-button#delete-execute {
    left: auto;
    right: 10px;
}
.mybusiness .processes-tab .progress-bar-container {
    top: 24px;
}
.mybusiness .processes-tab.loading .progress-bar-container {
    display: block;
}

/* PROCESSES ITEMS DEFINITIONS */
.mybusiness .process-item {
    position: relative;
    display: flex;
    width: 100%;
    height: 60px;
    padding-right: 17px;
}
.mybusiness .process-item.hidden-by-search {
    display: none;
}
.mybusiness .process-item .checkbox-block {
    position: relative;
    display: inline-block;
    top: 0px;
    height: 100%;
}
.mybusiness .process-item .checkbox-block .customized-checkbox {
    position: absolute;
    top: 22px;
    left: 17px;
}
.mybusiness .process-item .customized-checkbox * {
    font-size: 15px !important;
}
.mybusiness .process-item .checkbox-block .stw-checked,
.mybusiness .process-item .checkbox-block .stw-unchecked {
    height: 100%;
}
.mybusiness .process-item .icon-block {
    position: relative;
    display: inline-block;
    width: 30px;
    height: 100%;
}
.mybusiness .process-item .icon-block .repeat-icon {
    display: none;
}
.mybusiness .process-item .icon-block.with-repeat .repeat-icon {
    display: block;
    position: absolute;
    top: 35px;
    left: 10px; 
}
.mybusiness .process-item .title-block {
    position: relative;
    height: 100%;
    display: inline-block;
    flex-grow: 1;
    margin-left: 6px;
}
.mybusiness .process-item .title-block .title,
.mybusiness .process-item .title-block .status {
    position: absolute;
    width: calc(100% - 12px);
    top: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mybusiness .process-item .title-block .status {
    top: 32px;
}
.mybusiness .process-item.no-ownership-status .title-block .title {
    top: 20px;
}
.mybusiness .process-item .details-block {
    position: relative; 
}
.mybusiness .process-item .details-block:lang(en-US) {
    width: auto;
}
.mybusiness .process-item .icon-block .icon {
    width: 19px;
    height: 19px;
    position: absolute;
    top: 20px;
    left: 10px;
}
.mybusiness .process-item .icon-block.with-repeat .icon {
    top: 16px;
}
.mybusiness .process-item .icon-block .icon img {
    width: 100%;
    height: 100%;
}
.mybusiness .process-item .unread-circle {
    display: none;
    position: absolute;
    top: 10px;
}
.mybusiness .process-item.unread .unread-circle {
    display: block;
}
.mybusiness .process-item .priority {
    position: absolute;
    top: 0px;
    height: 7px;
    width: 100%;
    text-align: right;
}
.mybusiness .process-item .priority > * {
    display: none;
}
.mybusiness .priority.priority-high .priority-high,
.mybusiness .priority.priority-med .priority-med,
.mybusiness .priority.priority-low .priority-low {
    display: block;
}
.mybusiness .process-item .details-block .due-date {
    padding-right: 3px;
    display: none;
    position: relative;
    margin-top: 9px;
    width: auto;
    height: 14px;
    text-align: right;
    right: 0px;
    padding-left: 17px;
}
.mybusiness .process-item .details-block .due-date:lang(en-US) {
    width: 137px;
}
.mybusiness .process-item .details-block .last-update {
    position: relative;
    top: 22px;
    width: auto;
    height: 14px;
    text-align: right;
    right: 0px;
    padding-left: 10px;
}
.mybusiness .process-item .details-block .due-date .icon {
    position: absolute;
    width: 13px;
    height: 13px;
    left: 1px;
    top: 1px;
    line-height: 13px !important;
}
.mybusiness .process-item .details-block .due-date span {
    white-space: nowrap;
}
.mybusiness .process-item.with-due-date .due-date {
    display: block;
}
.mybusiness .process-item.with-due-date .last-update {
    top: 38px;
}
.mybusiness .process-item.due-close .due-date .icon,
.mybusiness .process-item.due-overdue .due-date .icon {
    display: block;
}
.mybusiness .process-item .routing-progress {
    display: none;
    position: absolute;
    top: 50px;
}
.mybusiness .process-item.with-routing-progress {
    height: 80px;
}
.mybusiness .process-item.with-routing-progress .routing-progress {
    display: block;
}

/* --- /styles/mybusiness-widgets.css--- */ 

.mybusiness .widget-container-blank {
    display: inline-block;
    vertical-align: top;
}
.mybusiness .widget-container {
    position: relative;
    min-width: 16.66%;
    height: auto;
    margin: 1px;
    padding: 5px;
    padding-top: 4px;
    vertical-align: top;
}
.mybusiness .widget-content {
    position: relative;
    width: 100%;
    height: auto;
    display: block;
    /*overflow: hidden; breaks auto-complete*/
}
.mybusiness .widget-container.selectable:after {
    position: absolute;
    width: 100%;
    height: 100%;
    content: "";
    right: 0px;
    top:0px;
    z-index: 1000;
}
.mybusiness .widget-container.compound > .widget-content {
    display: flex;
    flex-wrap: wrap;
}
.mybusiness .widget-container.hidden,
.mybusiness .widget-container.hidden-by-admin {
    display: inline-block !important;
    visibility: hidden;
    height: 0;
    padding: 0;
    overflow: hidden;
}
.mybusiness .widget-title-container {
    position: relative;
    width: 100%;
    height: 23px;
}
.mybusiness .widget-title-container .title {
    position: relative;
    display: inline-block;
    width: auto;
    max-width: 100%;
    height: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mybusiness .widget-title-container .required-indicator {
    position: absolute;
    width: 10px;
    height: 100%;
    display: none;
}
.mybusiness .widget-title-container .help {
    position: absolute;
    width: 30px;
    height: 30px;
    margin-left: 5px;
    margin-top: -5px;
    display: none;
}
.mybusiness .widget-title-container.required .title {
    max-width: calc(100% - 10px);
}
.mybusiness .widget-title-container.with-help .title {
    max-width: calc(100% - 25px);
}
.mybusiness .widget-title-container.required.with-help .title {
    max-width: calc(100% - 35px);
}
.mybusiness .widget-title-container.required .required-indicator {
    display: inline-block;
}
.mybusiness .widget-title-container.with-help .help {
    display: inline-block;
}

/* COMPOUND WIDGETS SPECIFIC */
.mybusiness .widget-container.compound {
    padding: 0px;
    padding-top: 7px;
}
.mybusiness .widget-container.compound > .widget-content > .widget-title-container {
    display: none;
}
.mybusiness .widget-container.compound > .widget-title-container.with-help .title {
    height: auto;
}
.mybusiness .widget-container.compound > .widget-title-container {
    padding-left: 5px;
}
.mybusiness .widget-container.compound > .widget-title-container.with-help {
    height: 50px;
}
.mybusiness .widget-container.compound > .widget-title-container.with-help .help {
    width: auto;
    display: block;
    margin-left: 0;
}

.mybusiness .widget-container.compound > .widget-title-container.with-help .info {
    width: auto;
}

/* WIDGETS SPECIFIC */
.mybusiness .widget-content.text,
.mybusiness .widget-content.number {
    display: flex;
}
.mybusiness .widget-content.text input {
    width: 100%;
    min-width: 150px;
}


.mybusiness .widget-content.currency input[type="text"][tabindex="0"] {
    width: 150px ;
    display: inline-block;
}

.mybusiness .widget-content.text input[type="text"][tabindex="0"]  {
    width: 200px;
    min-width: 150px;
}


.mybusiness .widget-content textarea {
    position: relative;
}

.mybusiness .widget-content.qrcode textarea,
.mybusiness .widget-content.textarea textarea {
    height: auto;
    resize: none;
    width: 100%;
    min-height: 70px;
    overflow: hidden;
}

.mybusiness .widget-content.textarea textarea[tabindex="0"]  {
    width: 250px;
    min-width: 150px;
}

.table td,
.table th {
  vertical-align: middle;
}
.mybusiness .widget-content.date,
.mybusiness .widget-content.phonenumber {
    overflow: visible;
}
.mybusiness .widget-content.phonenumber .iti {
    width: 100%;
}
.mybusiness .widget-content.phonenumber .iti .iti__flag-container {
    width: auto;
    max-width: 100%;
}
.mybusiness .widget-content.separator {
    min-height: 2px;
}
.mybusiness .widget-content.separator hr {
    margin: 0;
}
.mybusiness .widget-content.info .info-content {
    width: 100%;
    padding: 5px;
}
.mybusiness .widget-content.info .content > * {
    display: block;
}
.mybusiness .widget-content.info .info-content p {
    margin: 0;
}
.mybusiness .widget-content.currency .currency-holder {
    display: none;
    position: absolute;
    right: 1px;
    top: 0;
}
.mybusiness .widget-content.currency .selected-currency {
    width: 40px;
    height: 20px;
    line-height: 20px;
    margin-top: 5px;
}
.mybusiness .widget-content.currency .currency-content {
    position: relative;
}
.mybusiness .widget-content.currency input {
    padding-right: 60px;
}
.mybusiness #Currency-label {
    display: none;
}
.mybusiness-dropdown ul {
    margin: 0;
    padding: 0;
}
.mybusiness .widget-content.currency .select2-container .select2-selection--single {
    width: 65px;
}
.mybusiness-dropdown .select2-results__option .currency-selected {
    display: none;
}
.mybusiness-dropdown .select2-results__option.select2-results__option--highlighted .currency-selected {
    display: inline;
    padding-left: 3px;
}
.mybusiness .widget-content.file > * {
    margin: 5px;
}
.mybusiness .widget-content.file .qq-uploader .qq-upload-button {
    position: absolute !important;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}
.mybusiness .widget-content.file #file-upload-drop-zone{
    position: absolute;
    z-index:500;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.mybusiness .widget-content.file .uploaded-file {
    display: inline-flex;
    width: calc((100% - 50px) / 5);
    position: relative;
}
.mybusiness .widget-content.file .uploaded-file.small {
    width: auto;
}
.mybusiness .widget-content.file .uploaded-location,
.mybusiness .add-location-icon {
    display: inline-block;
    width: calc((100% - 30px) / 3);
    height: 58px;
    position: relative;
}
.mybusiness .widget-content.file .uploaded-location {
    z-index: 3;
}
.mybusiness .widget-content.file .uploaded-location .location-image {
    width: 100%;
    height: 100%;
}
.mybusiness .widget-content.info .file-preview,
.mybusiness .widget-content.file .file-preview {
    width: 60px;
    height: 60px;
    flex-shrink: 0;
    flex-grow: 0;
    position: relative;
    overflow: hidden;
}
.mybusiness .widget-content.file .remove {
    position: absolute;
    top: -4px;
    left: -4px;
    padding: 4px;
    z-index: 1;
    width: 18px;
    height: 18px;
}
.mybusiness .widget-content.file .marker {
    width: 23px;
    height: 32px;
    position: absolute;
    top: calc(50% - 16px);
    left: calc(50% - 11px);
}
.mybusiness .widget-content.file .upload-progress-bar {
    width: 100%;
    height: 7px;
    position: absolute;
    bottom: 0;
    left: 0;
}
.mybusiness .widget-content.file .upload-progress {
    width: 0;
    height: 7px;
}
.mybusiness .widget-content.file .file-info {
    flex-shrink: 1;
    flex-grow: 1;
    overflow: hidden;
    margin-left: 10px;

    display: flex;
    flex-direction: column;
    justify-content: center;
}
.mybusiness .widget-content.file .uploaded-file.small .file-info {
    display: none;
}
.mybusiness .file-upload-icon {
    display: inline-block;
    width: 60px;
    height: 60px;
}
.mybusiness .widget-content.file .picture {
    display: none;
    width: 80px;
}
.mybusiness .widget-content.file .picture .upload-picture-icon {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
}
.mybusiness .widget-content.file .picture .add-icon {
    position: absolute;
    bottom: 10px;
    right: 10px;
}
.mybusiness .widget-content.file .picture.read-only .add-icon {
    display: none;
}
.mybusiness .widget-content.file .picture .uploaded-picture {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
}
.mybusiness .widget-content.file.contact-picture .picture {
    display: block;
    height: 80px;
}
.mybusiness .widget-content.file.contact-picture > *:not(.picture) {
    display: none !important;
}
.mybusiness .widget-content.file.contact-picture .uploaded-picture {
    display: none;
}
.mybusiness .widget-content.file.contact-picture .picture.uploaded .uploaded-picture {
    display: inline-block;
}
.mybusiness .widget-content.file.contact-picture .picture.uploaded .upload-picture-icon {
    display: none;
}
.mybusiness .widget-content.file .myb-file-widget-picture-popover {
    display: none;
}
.myb-file-widget-picture-popover .option-row.remove-picture {
    display: none;
}
.myb-file-widget-picture-popover.with-remove .option-row.remove-picture {
    display: block;
}
.myb-file-widget-picture-popover .option-row .icon {
    display: inline-block;
    width: 30px;
    margin-right: 5px;
}
.mybusiness .widget-content.signature,
.mybusiness .widget-content.doodle {
    width: 100%;
    height: 75px;
    overflow: visible;
}
.mybusiness .widget-content.signature .edit-trigger,
.mybusiness .widget-content.doodle .edit-trigger {
    width: 30px;
    height: 30px;
    position: absolute;
    top: 3px;
    right: 3px;
    cursor: pointer;
    line-height: 30px !important;
}
.mybusiness .widget-content.signature .edit-controls,
.mybusiness .widget-content.doodle .edit-controls {
    position: absolute;
    min-width: 178px;
    top: 33px;
    right: 0px;
    z-index: 3;
    display: none;
    padding: 0;
}
.mybusiness .widget-content.signature .edit-controls li,
.mybusiness .widget-content.doodle .edit-controls li {
    text-align: left;
    cursor: pointer;
    white-space: nowrap;
    width:auto;
    margin: 0;
    padding: 0 20px 0 0;
    list-style: none;
    height: 35px;
    line-height: 35px;
}
.mybusiness .widget-content.signature .edit-controls li span,
.mybusiness .widget-content.doodle .edit-controls li span {
    display: inline-block;
    height: 30px;
    width: 40px;
    line-height: 30px;
}
.mybusiness .widget-content.doodle .controls-bar,
.mybusiness .widget-content.doodle .controls-bar-bg,
.mybusiness-doodle-preview .controls-bar,
.mybusiness-doodle-preview .controls-bar-bg {
    position: absolute;
    display: flex;
    justify-content: flex-end;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 20px;
    z-index: 2;
    background: transparent;
}
.mybusiness-doodle-preview .controls-bar,
.mybusiness-doodle-preview .controls-bar-bg {
    top: -20px;
}
.mybusiness .widget-content.doodle .controls-bar .control,
.mybusiness-doodle-preview .controls-bar .control {
    position: relative;
    width: 20px;
    height: 20px;
    line-height: 20px;
    display: inline-block;
}
.mybusiness .widget-content.doodle .controls-bar.blank {
    height: 100%;
    justify-content: center;
    padding: 20px;
}
.mybusiness .widget-content.doodle .controls-bar.blank .control {
    font-size: 17px;
    margin: 5px;
}
.mybusiness .widget-content.webview a {
    width: 100%;
}
.mybusiness .widget-content.date input {
    padding-right: 40px;
}
.mybusiness .widget-content.date span.widget-icon {
    position: absolute;
    right: 0;
    top: 0;
    width: 40px;
    height: 30px;
    line-height: 30px !important;
    padding: 0;
    padding-right: 10px;
}
.mybusiness .widget-content.date label {
    display: block;
}

.mybusiness .widget-content.location span.map-icon {
    position: absolute;
    right: 0;
    top: 0;
    width: 40px;
    height: 30px;
    line-height: 30px !important;
    padding: 0;
}
.mybusiness .widget-content.location.no-map span.map-icon {
    display: none;
}
.mybusiness .widget-content.startstop .control-container {
    width: 50%;
    display: inline-block;
}
.mybusiness .widget-container.columns-2 .widget-content.startstop .control-container,
.mybusiness .widget-container.columns-3 .widget-content.startstop .control-container {
    margin: 0;
    width: 100%;
}
.mybusiness .widget-container.columns-2 .widget-content.startstop.with-both-subwidgets .stop-control,
.mybusiness .widget-container.columns-3 .widget-content.startstop.with-both-subwidgets .stop-control {
    margin-top: 10px;
}
.mybusiness .widget-content.startstop {
    text-align: center;
    display: flex;
}
.mybusiness .widget-container.columns-2 .widget-content.startstop,
.mybusiness .widget-container.columns-3 .widget-content.startstop {
    display: block;
}
.mybusiness .widget-content.startstop .control-container button  {
    line-height: 24px;
    max-width: 276px;
    width: 100%;
    margin: 0 auto;
}
.mybusiness .widget-content.startstop .control-container button span.icon {
    line-height: 25px;
    vertical-align: middle;
    margin-right: 6px;
}
.mybusiness .widget-content.startstop .control-container button span.text {
    vertical-align: middle;
}
.mybusiness .widget-content.startstop .startstop-info .duration,
.mybusiness .widget-content.startstop .startstop-info {
    display: none;
}
.mybusiness .widget-content.startstop .startstop-info {
    text-align: left;
    margin-left: 20px;
    margin-top: 15px;
    line-height: 20px;
}
.mybusiness .widget-content.startstop .startstop-info .date,
.mybusiness .widget-content.startstop .startstop-info .location {
    margin-left: 15px;
}
.mybusiness .widget-content.startstop .startstop-info .duration .title,
.mybusiness .widget-content.startstop .startstop-info .distance .title {
    display: inline-block;
}
.mybusiness .widget-content.startstop .startstop-info .distance {
    display: none;
}
.mybusiness .widget-content.startstop .startstop-info .address {
    display: inline-block;
    max-width: calc(100% - 15px);
    word-break: break-all;
}
.mybusiness .widget-content.barcode input {
    padding-right: 45px !important;
    width: 100%;
}
.mybusiness .widget-content.barcode .widget-icon {
    position: absolute;
    top: 0;
    right: 0;
    width: 40px;
    height: 30px;
    line-height: 30px !important;
}
.mybusiness .widget-content.barcode .input-clear-button {
    right: 30px;
}
.modal.doodle-modal {
    z-index: 1040;
    top: 30px;
}
.doodle-modal-ovelay {
    z-index: 1040;
}
.modal-dialog.edit-doodle-modal {
    width: 880px;
    height: 700px;
    max-width: none;
}
.modal-dialog.edit-doodle-modal .drawing-doodle-container {
    position: relative;
    width: 800px;
    height: 670px;
    margin: 0 auto;
}
.modal-dialog.edit-doodle-modal .drawing-doodle-container .layer {
    position: absolute;
    top:0px;
    left: 0px;
    width: 100%;
    height: 100%;
    display: block;
}
.modal-dialog.edit-doodle-modal .drawing-doodle-container .layer[data-role="draw-container"] {
    height: calc(100% - 55px);
}
.modal-dialog.edit-doodle-modal .drawing-doodle-container .drawing-board-canvas {
    display: none;
}
.modal-dialog.edit-doodle-modal .drawing-doodle-container .draw-canvas {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}
.drawing-doodle-container .drawing-board-control-colors-current{
    display: none;
}
.drawing-doodle-container .drawing-board-control-colors-rainbows.drawing-board-utils-hidden {
    display: block !important;
    width: 28px;;
    left: -33px;
    top: -624px;
}
.drawing-doodle-container .drawing-board-control-colors-rainbow {
    height: auto;

}
.drawing-doodle-container .drawing-board-control-colors-picker:first-child {
    margin: 1px;
}
.drawing-doodle-container .drawing-board-control-colors-picker {
    width: 14px;
    height: 14px;
    margin: 1px;
}
.drawing-doodle-container .drawing-board-control-colors-picker.selected:hover,
.drawing-doodle-container .drawing-board-control-colors-picker.selected {
    width: 14px;
    height: 14px;
    margin: 2px 0 3px 0;
}
.drawing-doodle-container .drawing-board-control-colors-picker[data-color="rgba(255, 255, 255, 1)"] {
    display: none;
}
.drawing-doodle-container .drawing-board-control-colors-picker:hover {
    width: 14px;
    height: 14px;
    margin: 0;
}
.drawing-doodle-container .pencil-slider {
    height: 600px;
    width: 22px;
    position: absolute;
    right: -30px;
    top: 0px;
}
.drawing-doodle-container .pencil-slider .slider {
    height: 560px;
    width: 22px;
    margin-top:12px;
}
.drawing-doodle-container .pencil-slider span {
    display: block;
    height: 22px;
    width: 22px;
    line-height: 22px;
    border-radius: 11px;
}
.drawing-doodle-container .ui-slider-handle {
    width: 19px !important;
    height: 10px !important;
    left: 0px !important;
}
.drawing-doodle-container input[type="range"] {
    display: none !important;
}
.drawing-doodle-container .drawing-board-control-inner {
    width: 50px !important;
    height: 50px !important;
}
.drawing-doodle-container .drawing-board-control-navigation-back {
    position: absolute;
    left: 9px;
    top: 6px;
}
.drawing-doodle-container .drawing-board-control.drawing-board-control-size {
    position: absolute;
    left: 42px;
    top: 0px;
    height: 45px;
}
.drawing-doodle-container .drawing-board-control-navigation-forward {
    position: absolute;
    left: 96px;
    top: 6px;
}
.drawing-doodle-container .drawing-board-control.drawing-board-control-navigation button {
    line-height: 30px;
}
.drawing-doodle-container .doodle-controls {
    position: absolute;
    bottom: 9px;
    right: 0;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    justify-content: flex-end;
}
.drawing-doodle-container .doodle-controls .sw-button {
    height: 33px;
    line-height: 33px;
    margin-left: 10px;
    padding-left: 10px;
    padding-right: 10px;
}
.drawing-doodle-container .doodle-controls .upload-image,
.drawing-doodle-container .doodle-controls .remove-image {
    display: none;
}

/* Selector widget */
.mybusiness .widget-content.selector {
    display: flex;
    flex-wrap: wrap;
}
.mybusiness .widget-content.selector input {
    display: none;
}
.mybusiness .widget-content.selector .radio-item,
.mybusiness .widget-content.selector .checkbox-item {
    display: inline-block;
    padding-right: 10px;
    box-sizing: border-box;
    margin-bottom: 5px;
    margin-top: 5px;
}
.mybusiness .widget-content.selector select {
    height: 30px;
    min-width: 150px;
}
.mybusiness .widget-content.selector .customized-radio,
.mybusiness .widget-content.selector .customized-checkbox {
    display: flex;
    white-space: normal;
    word-break: break-all;
    min-height: 20px;
    height: auto;
    overflow: visible;
}
.mybusiness .widget-content.selector .customized-radio-label,
.mybusiness .widget-content.selector .customized-checkbox-label
{
    margin-left: 3px;
}

.mybusiness .widget-content.date input {
    min-width: 200px;
}
/* Table widget */
.widget-content.table {
    margin: 0;
}
.widget-content.table .scrollable-container > table {
    width: 100%;
}
.widget-content.table .scrollable-container > table > tbody > tr {
    display: none;
}
.widget-content.table .scrollable-container > table > thead > tr > th {
    padding: 10px;
}
.widget-content.table td.first-cell {
    padding: 5px;
    max-width: 100px;
}
.widget-content.table td > .widget-title-container {
    display: none;
}
.widget-content.table td > .widget-content {
    min-height: 0;
}
.widget-content.table td > .widget-content.signature,
.widget-content.table td > .widget-content.doodle {
    margin: 5px;
    width: 300px;
}
.widget-content.table td > .widget-content.file .uploaded-location,
.widget-content.table td > .widget-content.file .add-location-icon {
    min-width: 200px;
}
.widget-content.table .table-buttons {
    display: inline-block;
    float: left;
    margin-top: 15px;
    height: 30px;
}
.mybusiness-widget-table-fullscreen .table-buttons .sw-button,
.widget-content.table .table-buttons .sw-button {
    padding: 5px 10px;
    margin-right: 10px;
}
.widget-content.table .table-pagination {
    display: inline-flex;
    align-items: center;
    float: right;
    margin-top: 15px;
    height: 30px;
}

.fullscreen-button {
    position: absolute;
    top: 30px;
    right: 6px;
}

.textarea-elipsis {
    position: absolute;
    bottom: 5px;
    right: 6px;
}

.widget-content.table .fullscreen-button {
    position: absolute;
    top: -20px;
    right: 0;
}
.widget-content.table .fullscreen-button span {
    padding-right: 10px;
}
.mybusiness-widget-table-fullscreen .modal-dialog {
    width: 1000px;
    height: 800px;
    max-width: none;
}
.mybusiness-widget-table-fullscreen .modal-dialog.mybusiness {
    position: relative;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    width: calc(100vw - 50px);
    height: calc(100vh - 100px);
    background: transparent;
    display: block;
}
.mybusiness-widget-table-fullscreen .modal-dialog .modal-content {
    display: flex;
    flex-direction: column;
    max-height: 100%;
    height: 100%;
}
.mybusiness-widget-table-fullscreen .modal-dialog .modal-content .modal-body {
    overflow: hidden;
    height: 100%;
}
.mybusiness-widget-table-fullscreen .modal-dialog .modal-content .modal-body .widget-content.table,
.mybusiness-widget-table-fullscreen .modal-dialog .modal-content .modal-body .scrollable-container {
    position: relative;
    height: 100%;
    overflow-y: hidden;
}
.mybusiness-widget-table-fullscreen .modal-dialog .modal-content .modal-body .widget-content.table table {
    width: calc(100% - 20px);
}
.mybusiness-widget-table-fullscreen {
    z-index: 1040;
}
.mybusiness-widget-table-fullscreen .table-controls,
.mybusiness-widget-table-fullscreen .fullscreen-button {
    display: none;
}
.widget-content.table .table-pagination .arrow-left,
.widget-content.table .table-pagination .arrow-right {
    width: 20px;
    height: 20px;
}
.widget-content.table .table-pagination .bullets {
    display: flex;
}
.widget-content.table .table-pagination .bullets > * {
    padding: 0 5px;
    margin: 0 5px;
}

/* READ-ONLY */

.mybusiness .widget-content.date input:disabled {
    padding-right: 1px;
}

.mybusiness .widget-content textarea:disabled ~ .widget-icon,
.mybusiness .widget-content input:disabled ~ .widget-icon,
.mybusiness .widget-content input:disabled ~ .map-icon {
    display: none;
}

.process-renderer-section.read-only .widget-content textarea:disabled ~ .widget-icon,
.process-renderer-section.read-only .widget-content input:disabled ~ .widget-icon,
.process-renderer-section.read-only .widget-content input:disabled ~ .map-icon
{
    display: block;
}

.mybusiness .widget-content input.with-address {
    padding-right: 30px;
}

.mybusiness .widget-content input.with-address ~ .map-icon {
    display: block;
}

.mybusiness-doodle-preview .modal-body {
    position: relative;
    padding: 1px;
}
.mybusiness-doodle-preview .modal-body > img {
    width: 100%;
}
.mybusiness-doodle-preview .modal-body > span {
    position: absolute;
    display: inline-block;
    top: 1px;
    right: 1px;
    width: 30px;
    height: 30px;
}
.mybusiness-doodle-preview .modal-body > span.download-icon {
    right: 33px;
}
.mybusiness .widget-content.compare-b {
    margin-top: 5px;
}
.mybusiness .widget-content.startstop .compare-a,
.mybusiness .widget-content.startstop .compare-b {
    padding: 5px;
}
.mybusiness .widget-content.nfc textarea {
    height: auto;
    resize: none;
}
.mybusiness .widget-content.qrcode .input-clear-button,
.mybusiness .widget-content.nfc .input-clear-button {
    top: 1px;
    right: 39px;
}
.mybusiness .widget-content.qrcode .widget-icon,
.mybusiness .widget-content.nfc .widget-icon {
    position: absolute;
    top: 0;
    right: 19px;
    width: 20px;
    height: 30px;
    line-height: 29px !important;
}
.mybusiness .widget-content.qrcode .with-clear-button,
.mybusiness .widget-content.nfc .with-clear-button {
    padding-right: 60px !important;
}
.mybusiness .widget-content.currency .select2-container {
    box-shadow: none !important;
}
.mybusiness .widget-content.currency .select2-selection__choice__remove {
    margin-top: 3px;
    width: 8px;
    height: 8px;
}
.mybusiness .widget-content.currency input.select2-container--default {
    width: 300% !important;
}
.mybusiness .widget-content.currency .select2-results__option span {
    vertical-align: middle;
}
.mybusiness .widget-content.currency .select2-container .select2-selection--single {
    height: 29px;
}
.mybusiness .widget-content.externaldb {
    display: flex;
    justify-content: center;
}
.mybusiness .widget-content.externaldb .submit-button {
    padding: 5px;
    flex-grow: 1;
}
.mybusiness .widget-content.externaldb .info {
    flex-shrink: 0;
}
.mybusiness .widget-content.callprocess {
    display: flex;
    line-height: 20px;
}
.mybusiness .widget-content.callprocess.not-visible {
    display: none;
}
.mybusiness .widget-content.callprocess .name-container {
    display: flex;
    flex-grow: 1;
}
.mybusiness .widget-content.callprocess .details-container {
    flex-shrink: 0;
}
.mybusiness .widget-content.callprocess .help {
    margin-left: 5px;
}
.mybusiness .widget-content.callprocess .status-container {
    text-align: right;
}
.copy-button,
.paste-button,
.delete-button,
.multiselect-button,
.multiselect-all-button,
.multiselect-cancel-button {
    display: none;
}

.multiselect-all-button, .multiselect-cancel-button {
    display: none;
}

.row-multiselect {
    float: left;
    margin-right: 10px;
}

.table-operations .disabled-control {
    opacity: 0.5;
}

.table-operations {
    line-height: 30px;
    width: 100%;
    text-align: right;
}
#info-attachements .content {
    display: flex;
    flex-wrap: wrap;
    justify-content: left;
    width: 100%;
}
#info-attachements .content a.attachment-item {
    display: flex;
    width:275px;
    height:65px;
    margin-left:4px;
    margin-bottom: 10px;
    position: relative;
}
#info-attachements .content a.attachment-item span.details {
    flex: 1;
    flex-direction: column;
    justify-content: center;
    display: flex;
    padding-left: 5px;
}
#info-attachements .content a.attachment-item span.details p {
    word-break: break-all;
    margin: unset;
}
#info-attachements .content a.attachment-item span.icon-filetype {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    display: inline-flex;
    width:65px;
    min-width: 65px;
    height: 65px;
    min-height: 65px;
}

/* --- /styles/mybusiness-resources-manager.css--- */ 

.mybusiness .resources-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.mybusiness .favorites-resources-container {
    display: none;
    width: 100%;
    position: relative;
    padding: 20px 20px 0 20px;
}
.mybusiness .favorites-resource-content {
    height: auto;
    width: 100%; 
    padding-top: 14px;
}
.mybusiness .favorite-resource {
    display: inline-flex;
    flex-direction: column;
    -webkit-flex-direction: column;
    width: 33%;
    height: 110px;
    padding: 0 3%;
    position: relative;
}
.mybusiness .favorite-resource-icon {
    height: 70px;
    width: 70px;
    margin: 0 auto;
    position: relative;
}
.mybusiness .favorite-resource-name {
    height: 30px;
    text-align: center;
    margin-top: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mybusiness .favorite-resource-icon span {
    display: block;
    width: 70%;
    height: 100%;
    margin: 0px 15%;
    position: absolute;
    top: 0;
}
.mybusiness .favorite-resource .remove {
    display: none;
    position: absolute;
    top: 0;
    left: 10px;
    width: 17px;
    height: 17px;
    text-align: center;
    line-height: 17px !important;
}
.mybusiness .favorite-resource:hover .remove {
    display: block;
}
.mybusiness .favorites-resources-container.collapsed .favorites-resource-content {
    max-height: 230px;
    overflow: hidden;
}
.mybusiness .favorites-resource-title {
    position: absolute;
    top: 10px;
    padding-right: 10px;
}
.mybusiness .favorites-resource-control {
    padding: 5px;
    display: none;
}
.mybusiness .favorites-resources-container.collapsed .favorites-resource-control,
.mybusiness .favorites-resources-container.expanded .favorites-resource-control {
    display: block;
}
.mybusiness .favorites-resource-control > span {
    display: none;
}
.mybusiness .favorites-resources-container.collapsed .favorites-resource-control .expand-icon,
.mybusiness .favorites-resources-container.expanded .favorites-resource-control .collapse-icon {
    display: block;
}
.mybusiness .resources-group {
    width: 100%;
}
.mybusiness .resources-group .header-bar {
    height: 30px;
    position: relative;
    width: 100%;
}
.mybusiness .resources-group .resources-control {
    position: absolute;
    top: 0;
    right: 10px;
    width: 40px;
    height: 30px;
    text-align: center;
    line-height: 30px;
}
.mybusiness .resources-group .resources-control .expand-icon {
    display: none;
}
.mybusiness .resources-group.collapsed .resources-control .expand-icon {
    display: inline;
}
.mybusiness .resources-group.collapsed .resources-control .collapse-icon {
    display: none;
}
.mybusiness .resources-group .category-name {
    position: absolute;
    left: 19px;
    top: 0;
    height: 30px;
    width: calc(100% - 80px);
    line-height: 30px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.mybusiness .resources-group.collapsed .group-templates {
    display: none;
}
.mybusiness .resource-item {
    height: 40px;
    width: 100%;
    position: relative;
}
.mybusiness .resource-name {
    position: absolute;
    top: 0;
    left: 20px;
    height: 40px;
    line-height: 40px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: calc(100% - 55px);
}

.mybusiness .selected-resource .resource-name {
    left: 15px;
}
.mybusiness .resource-item .item-control {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    width: 35px;
    line-height: 40px;
}
.mybusiness .resource-item .item-control .favorite-on {
    display: none;
}
.mybusiness .resource-item.favorite .item-control .favorite-on {
    display: inline;
}
.mybusiness .resource-item.favorite .item-control .favorite-off {
    display: none;
}

/* --- /styles/mybusiness-process-editor.css--- */ 

.mybusiness .process-editor .header-bar {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 80px;
    display: flex;
    margin-top: 3px;
}
.mybusiness .process-editor .header-bar #loading {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
}
.mybusiness .process-editor .header-bar .process-info {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding-left: 15px;
    padding-right: 5px;
    justify-content: center;
    overflow: hidden;
}
.mybusiness .process-editor .header-bar.edit-mode .process-info {
    display: none;
}
.mybusiness .process-editor .header-bar .process-title .hover-group {
    display: inline-flex;
    max-width: 100%;
    padding: 0 5px;
    margin-left: -5px;
}
.mybusiness .process-editor .header-bar .process-title .icon {
    padding-left: 5px;
    flex-shrink: 0;
}
.mybusiness .process-editor .header-bar .template-title {
    display: flex;
}
.mybusiness .process-editor .header-bar .template-title .icon {
    width: 16px;
    height: 20px;
    margin-right: 5px;
    flex-shrink: 0;
}

.mybusiness .process-editor .header-bar .process-title .title {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.mybusiness .process-options-layer .icon {
    display: inline-block;
    width: 16px;
    height: 20px;
    flex-shrink: 0;
}
.mybusiness .process-editor .header-bar .process-title-editor-container {
    display: none;
}
.mybusiness .process-editor .header-bar.edit-mode .process-title-editor-container {
    display: block;
    flex-grow: 1;
    flex-shrink: 0;
}
.mybusiness .process-editor .header-bar.edit-mode .process-title-editor {
    width: 300px;
    margin-top: 15px;
    margin-left: 15px;
    padding: 10px;
}
.mybusiness .process-editor .header-bar.edit-mode .process-title-editor input {
    width: 200px;
    min-width: 0;
}
.mybusiness .process-editor .header-bar.edit-mode .process-title-editor .sw-button {
    padding: 4px 10px;
    margin-left: 5px;
}
.mybusiness .process-editor .header-bar.edit-mode .process-title-editor .close {
    display: inline-block;
    margin-left: 5px;
}
.mybusiness .process-editor .header-bar .buttons-container {
    display: none;
}
.mybusiness .process-editor .header-bar .actions-container {
    position: relative;
    display: flex;
    height: 25px;
    width: auto;
    margin-top: 30px;
    margin-right: 30px;
    line-height: 25px;
}
.mybusiness .process-editor .header-bar .actions-container.blocked {
    filter: grayscale();
}
.mybusiness .process-editor .header-bar .actions-container .icon-button {
    display: flex;
}
.mybusiness .process-editor .header-bar .actions-container .icon-button span {
    height: 100%;
    display: inline-block;
}
.mybusiness .process-editor .header-bar .actions-container span.icon {
    margin-right: 10px;
    font-size: 17px;
}
.mybusiness .process-editor .header-bar .actions-container span.icon.with-custom-action-icon,
.myb-process-popover .icon-button span.icon.with-custom-action-icon {
    width: 25px;
    height: 25px;
    background-size: cover;
}
.myb-process-popover .icon-button span.icon.with-custom-action-icon {
    width: 17px;
    height: 17px;
    display: inline-block;
}
.mybusiness .process-editor .header-bar .actions-container span.arrow {
    font-size: 10px;
}
.mybusiness .process-editor .header-bar .actions-container .options-button.opened span.arrow {
    transform: rotate(180deg);
}
.mybusiness .process-editor .header-bar .actions-container .text {
    margin-right: 5px;
}
.mybusiness .process-editor .header-bar .actions-container .primary-actions {
    display: flex;
}
.mybusiness .process-editor .preloader-bar {
    display: none;
    top: 80px;
}
.mybusiness .process-editor .pages {
    position: absolute;
    top: 80px;
    left: 0;
    width: 100%;
    height: calc(100% - 80px);
}
.mybusiness .process-editor .pages > * {
    display: none;
    width: 100%;
    height: 100%;
}
.mybusiness .process-editor[data-page=external-process] .external-process,
.mybusiness .process-editor[data-page=blank] .blank-state,
.mybusiness .process-editor[data-page=renderer] .process-renderer,
.mybusiness .process-editor[data-page=recipients] .process-recipients,
.mybusiness .process-editor[data-page=options] .process-options {
    display: block;
}
.mybusiness .process-editor[data-page=external-process] .header-bar,
.mybusiness .process-editor[data-page=blank] .header-bar {
    display: none;
}

.mybusiness .process-editor .external-process .info-block,
.mybusiness .process-editor .blank-state .info-block {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}
.mybusiness .process-editor .external-process .info-block .external-process-button {
    min-width: 250px;
    padding: 0 30px;
    height: 25px;
    line-height: 25px;
    margin-top: 10px;
}

/* RECIPIENTS PAGE */
.mybusiness .process-recipients .list-block {
    display: none;
    height: 100%;
}
.mybusiness .process-recipients.with-list .list-block {
    display: block;
}
.mybusiness .process-recipients .list-counter {
    padding: 15px 0 0 15px;
}
.mybusiness .process-recipients .list-items {
    height: calc(100% - 35px);
}
.mybusiness .process-recipients .list-items .contacts-selector-item {
    display: inline-flex;
    width: calc(33% - 20px);
    margin: 15px 0 0 15px;
}
.mybusiness .process-recipients.with-list .info-block {
    display: none;
}
.mybusiness .process-recipients .info-block {
    padding: 200px 25% 0 25%;
}

/* RECIPIENTS POPUP */


.mybusiness .process-conversation-layer {
    height: 100%;
}
.mybusiness .process-conversation-layer .message-utilities .utilities {
    margin: 20px 50px 0px 0px;
}
.mybusiness .process-conversation-layer .message-container.location .attachment,
.mybusiness .process-conversation-layer .message-container.location .attachment-thumbnail,
.mybusiness .process-conversation-layer .message-container.location .attachment-thumbnail::after {
    width: 255px;
    height: 107px;
}
.mybusiness .process-conversation-layer .message-container.location .attachment-thumbnail img {
    width: 100%;
    height: auto;
}
.mybusiness .process-conversation-layer .sliding-layer-bar {
    height: 80px;
}

.mybusiness .process-conversation-layer .sliding-layer-content {
    top: 80px;
    height: calc(100% - 80px);
}
.mybusiness .process-conversation-layer .sliding-layer-bar .back-button {
    line-height: 80px !important;
}
.mybusiness .process-conversation-layer .sliding-layer-bar .no-subscribers {
    height: auto;
    line-height: normal;
}
.mybusiness .process-conversation-layer .sliding-layer-bar .recipient-details {
    margin-top: 20px;
    flex-grow: 1;
}
.mybusiness .process-conversation-layer .sliding-layer-bar .entity-detail-name {
    margin-top: -5px;
    position: absolute;
    width: calc(100% - 100px);
    display: flex;
    line-height: normal;
}
.mybusiness .process-conversation-layer .sliding-layer-bar .process-icon {
    width: 20px;
    height: 20px;
    vertical-align: top;
}
.mybusiness .process-conversation-layer .sliding-layer-bar .group-name {
    line-height: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100px;
    white-space: nowrap;

}
.mybusiness .process-conversation-layer .sliding-layer-bar .entity-detail-secondary {
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
    margin: 0px !important;
}
.mybusiness .process-conversation-layer .sliding-layer-bar .contact-features {
    display: flex;
    position: relative;
    text-align: center;
    white-space: nowrap;
    flex-shrink: 0;
    max-width: 60px;
    flex-wrap: wrap;
    align-items: center;
    line-height: 30px;
    height: 60px;
    top: 10px;
}
.mybusiness .process-conversation-layer .sliding-layer-bar .details-options {
    width: 30px;
    height: 30px;
    cursor: pointer;
    display: none;
}
.mybusiness .process-conversation-layer .sliding-layer-bar .media-share-button {
    display: inline-block;
}
.mybusiness .process-conversation-layer .sliding-layer-bar .contact-features .join-button-container {
    display: none;
    margin-top: 11px;
}
.mybusiness .process-conversation-layer .sliding-layer-bar .contact-features.with-join-button .join-button-container {
    display: block;
}
.mybusiness .process-conversation-layer .sliding-layer-bar .contact-features.with-join-button .voip-push-to-talk {
    display: none !important;
}
.myb-process-popover .option-row {
    height: 30px;
    line-height: 30px;
    white-space: nowrap;
    cursor: pointer;
}
/*.myb-process-popover .option-row .icon {
    width: 30px;
    height: 30px;
    display: inline-block;
    text-align: center;
    line-height: 26px;
    vertical-align: middle;
}*/
.mybusiness .process-editor .conditional-duplication-controls[data-role=template] {
    display: none;
}
.mybusiness .process-editor .conditional-duplication-controls {
    position: relative;
    display: block;
    width: auto;
    height: 25px;
    line-height: 25px;
    margin-top: 5px;
    font-style: italic;
}
.mybusiness .process-editor .conditional-duplication-controls .square-checkbox {
    position: absolute;
    top: 3px;
    left: 0px;
    cursor: pointer;
}
.mybusiness .process-editor .conditional-duplication-controls label {
    cursor: pointer;
}

/* --- /styles/mybusiness-process-renderer.css--- */ 

.mybusiness .process-renderer {
    width: 100%;
    height: 100%;
}

.mybusiness .process-renderer .loading-mask {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;    
    z-index: 100;
    padding-top: 40%;
    display: none;
}

.mybusiness .process-renderer .sections-names-list {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 40px;
    white-space: nowrap;
}
.mybusiness .process-renderer.with-selection-tools .sections-names-list {
    top: 40px;
}
.mybusiness .process-renderer .sections-scroll-container {
    position: absolute;
    left: 0px;
    top: 40px;
    height: calc(100% - 40px);
    width: 100%;
    overflow: hidden;
}
.mybusiness .process-renderer.with-selection-tools .sections-scroll-container {
    top: 80px;
    height: calc(100% - 80px);
}
.mybusiness .process-renderer .sections-container {
    position: relative;
    width: 100%;
    height: auto;
}
.mybusiness .process-renderer .section-row {
    width: 100%;
    height: auto;
    display: block;
    position: relative;
}
.mybusiness .process-renderer .sections-names-list .sections-arrow {
    position: absolute;
    top: 0px;
    width: 18px;
    text-align: center;
    line-height: 40px !important;
}
.mybusiness .process-renderer .sections-names-list .arrow-left {
    left: 0px;
}
.mybusiness .process-renderer .sections-names-list .arrow-right {
    right: 0px;
}
.mybusiness .process-renderer .sections-names-list .floating-mask {
    position: absolute;
    top: 0px;
    left: 18px;
    width: calc(100% - 36px);
    height: 100%;
    overflow: hidden;
}
.mybusiness .process-renderer .sections-names-list .floating-container {
    display: flex;
    left: 0;
    position: absolute;
    width: auto;
}
.mybusiness .process-renderer .sections-names-list .right-blur,
.mybusiness .process-renderer .sections-names-list .left-blur {
    position: absolute;
    width: 50px;
    height: 100%;
    z-index: 2;
    pointer-events: none;
    top: 0;
}
.mybusiness .process-renderer .sections-names-list .right-blur {
    right: 18px;
}
.mybusiness .process-renderer .sections-names-list .left-blur {
    left: 18px;
}
.mybusiness .process-renderer-section-name {
    position: relative;
    width: auto;
    height: 24px;
    display: inline-block;
    line-height: 22px;
    margin-left: 10px;
    padding-left: 7px;
    padding-right: 7px;
    margin-top: 8px;
}
.mybusiness .process-renderer-section-name:first-child {
    margin-left: 0px;
}
.mybusiness .process-renderer-section {
    position: relative;
    width: 100%;
    height: auto;
    display: block;
    margin-bottom: 15px;
}
.mybusiness .process-renderer-section .section-title {
    position: relative;
    margin-left: 18px;
    width: auto;
    min-height: 20px;
    height: auto;
    max-width: 96%;
    white-space: normal;
    z-index: 2;
}
.mybusiness .process-renderer-section .section-content-container {
    position: relative;
    margin-left: 18px;
    width: calc(100% - 36px);
    height: auto;
    padding: 20px 5px 10px 5px;
}
.mybusiness .process-renderer-section .section-content {
    position: relative;
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
} 
.mybusiness .process-renderer-section .suggestions {
   position: absolute;
   padding: 0 10px;
   top: 30px;
   width: 100%;
   z-index: 99;
}
.mybusiness .process-renderer-select-all-controls {
    position: absolute;
    top: 0px;
    left: 18px;
    height: 40px;
    line-height: 40px;
}
.mybusiness .process-renderer-select-all-controls .control-button.unselect-all{
    display: none;
}
.mybusiness .process-renderer .process-renderer-section .read-only-mask {
    display: none;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 2;
    background: transparent;
}
.mybusiness .process-renderer .process-renderer-section.read-only .uploaded-file .remove,
.mybusiness .process-renderer .process-renderer-section.read-only .uploaded-location .remove,
.mybusiness .process-renderer .process-renderer-section.read-only .file-upload-icon::before,
.mybusiness .process-renderer .process-renderer-section.read-only .add-location-icon::before,
.mybusiness .process-renderer .process-renderer-section.read-only .edit-trigger,
.mybusiness .process-renderer .process-renderer-section.read-only [data-widget-type="doodle"] [data-role="edit-doodle"],
.mybusiness .process-renderer .process-renderer-section.read-only [data-widget-type="doodle"] [data-role="remove-picture"],
.mybusiness .process-renderer .process-renderer-section.read-only [data-widget-type="doodle"] [data-role="upload-picture"] {
    display: none !important;
}
.mybusiness .process-renderer .process-renderer-section.read-only .file-upload-icon,
.mybusiness .process-renderer .process-renderer-section.read-only .add-location-icon,
.mybusiness .process-renderer .process-renderer-section.read-only .doodle {
    pointer-events: none;
    opacity: 0.5;
}
.mybusiness .process-renderer .process-renderer-section.read-only {
    position: relative;
}
.mybusiness .process-renderer .process-renderer-section .read-only::after {
    content: '';
    position: absolute;
    cursor: not-allowed;
    top: 20px;
    left: 0;
    bottom: 0;
    right: 0;
    background: transparent;
    z-index: 1;
}

.mybusiness .process-renderer.history-comparator .process-renderer-section.read-only {
    -webkit-filter: none;
    filter: none;
}
.mybusiness .process-renderer .sections-container .include-deleted-widgets-container{
    position: relative;
    display: inline-block;
    padding: 20px;
}
.mybusiness .process-renderer .include-deleted-widgets-container .info{
    position: relative;
    display: inline-block;
    top: 10px;
}
.mybusiness .process-renderer .include-deleted-widgets-container .checkbox-switcher{
    position: relative;
    display: block;
}

/* --- /styles/mybusiness-process-options.css--- */ 

.mybusiness .process-options {
    padding: 50px 15px 0 15px;
}
.mybusiness .process-options > * {
    margin-bottom: 50px;
}
.mybusiness .process-options .priority-block .icon {
    padding: 5px;
}
.mybusiness .process-options .priority-block .priority {
    width: 15%;
}
.mybusiness .process-options .priority-block .level-label {
    width: 25%;
}
.mybusiness .process-options .priority-block .block-content {
    display: flex;
}
.mybusiness .process-options .expandable-block {
    position: relative;
}
.mybusiness .process-options .expandable-block.expanded {
    padding: 15px;
}
.mybusiness .process-options .expandable-block:not(.expanded) .block-content {
    display: none;
}
.mybusiness .process-options .expandable-block .floating-container {
    position: absolute;
    top: -11px;
    left: -2px;
    padding-right: 15px;
    padding-bottom: 5px;
}
.mybusiness .process-options .repeat-block select {
    width: 200px !important;
    height: 30px;
}
.mybusiness .process-options .repeat-block .floating-container select {
    width: 150px !important;
    margin-left: 5px;
}
.mybusiness .process-options .repeat-block .option-label {
    margin-top: 15px;
    margin-bottom: 5px;
}
.mybusiness .process-options .setting-label,
.mybusiness .process-options .customized-checkbox-label {
    margin-left: 5px;
}
.mybusiness .process-options .due-date-block .date-picker,
.mybusiness .process-options .schedule-block .date-picker {
    width: 300px;
    position: relative;
}
.mybusiness .process-options .repeat-block .date-picker {
    width: 200px;
    position: relative;
}
.mybusiness .process-options .repeat-block .date-picker input {
    min-width: 0;
}
.mybusiness .process-options .due-date-block .date-picker > span,
.mybusiness .process-options .schedule-block .date-picker > span,
.mybusiness .process-options .repeat-block .date-picker > span {
    position: absolute;
    right: 10px;
    top: 0;
    cursor: pointer;
}
.mybusiness .process-options .repeat-block .repeat-interval .option-selector {
    display: none;
}
.mybusiness .process-options .repeat-block [data-frequency="1"] .option-selector.daily,
.mybusiness .process-options .repeat-block [data-frequency="2"] .option-selector.weekly,
.mybusiness .process-options .repeat-block [data-frequency="3"] .option-selector.monthly,
.mybusiness .process-options .repeat-block [data-frequency="4"] .option-selector.hourly {
    display: block;
}
.mybusiness .process-options .repeat-block .repeat-interval .weekly input {
    width: 30px;
    min-width: 30px;
    margin-right: 5px;
    padding: 1px;
}
.mybusiness .process-options .repeat-block .content-column {
    display: inline-block;
    width: 33%;
}
.mybusiness .process-options .repeat-block .day-selector {
    display: none;
}
.mybusiness .process-options .repeat-block [data-frequency="3"] .day-selector {
    display: block;
}
.mybusiness .process-options .repeat-block .day-selector-input {
    display: flex;
    flex-wrap: wrap;
    width: 212px;
}
.mybusiness .process-options .repeat-block .day-selector-input > div {
    width: 24px;
    height: 24px;
    margin: 3px;
}
.mybusiness .process-options .repeat-block .repeat-summary .stw-repeat-process {
    display: inline-block;
    width: 25px;
}
.mybusiness .process-options .repeat-block .repeat-summary .summary {
    display: inline-block;
    width: calc(100% - 30px);
}
.mybusiness .process-options-layer {
    padding: 30% 50px 0;
}
.mybusiness .process-options .date-picker input {
    cursor: pointer;
}

/* --- /styles/mybusiness-process-history.css--- */ 

.mybusiness .process-history-layer {
    height: 100%;
}

.mybusiness .process-history-layer .controls-bar {
    display: block;
    margin: 0 20px;
    height: 40px;
}
.mybusiness .process-history-layer .controls-bar .control-button {
    display: inline-block;
    line-height: 30px;
    margin-right: 20px;
    margin-top: 5px;
}
.mybusiness .process-history-layer .controls-bar .control-button#compare-executor {
    position: absolute;
    right: 0px;
}
.mybusiness .process-history-layer .controls-bar .control-icon {
    display: inline-block;
    vertical-align: middle;
    line-height: normal;
}
.mybusiness .process-history-layer .controls-bar .control-label {
    display: inline-block;
    line-height: 30px;
}
.mybusiness .process-history-layer .controls-bar.alternate {
    display: none;
}
.mybusiness .process-history-layer .control-button {
    cursor: pointer;
}
.mybusiness .process-history-layer.multiselect .controls-bar {
    display: none;
}
.mybusiness .process-history-layer.multiselect .controls-bar.alternate {
    display: block;
}
.mybusiness .process-history-item {
    position: relative;
    display: flex;
    width: 100%;
    height: 80px;
    padding: 20px 20px 0 35px;
}
.mybusiness .process-history-layer.multiselect .process-history-item .checkbox-block {
    display: block;
}
.mybusiness .process-history-layer .process-history-item .checkbox-block {
    position: absolute;
    left: 7px;
    top: 0;
    width: 30px;
    height: 100%;
    display: none;
}
.mybusiness .process-history-layer .process-history-scrollable-list {
    position: absolute;
    top: 40px;
    width: 100%;
    height: calc(100% - 40px);
}
.mybusiness .process-history-layer .items-list {
    position: absolute;
    left: 0px;
    top: 0;
    width: 100%;
    min-height: 100%;
    height: auto;
}
.mybusiness .process-history-item .checkbox-block .stw-checked, 
.mybusiness .process-history-item .checkbox-block .stw-unchecked {
    line-height: 42px !important;
    height: 100%;
}
.mybusiness .process-history-renderer .header-bar {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 80px;
}
.mybusiness .process-history-renderer .header-bar .process-name {
    position: absolute;
    top: 20px;
    left: 15px;
    width: 90%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mybusiness .process-history-renderer .header-bar .template-title {
    position: absolute;
    top: 40px;
    left: 36px;
    width: 90%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mybusiness .process-history-renderer .header-bar .template-icon {
    width: 16px;
    height: 16px;
    position: absolute;
    top: 42px;
    left: 15px;
}
.mybusiness .process-history-renderer .header-bar .conversation-button {
    position: absolute;
    right: 15px;
    top: 23px;
}
.mybusiness .process-history-renderer .renderer-container {
    position: absolute;
    top: 80px;
    width: 100%;
    height: calc(100% - 80px);
}
.mybusiness .process-history-renderer .info-bar {
    position: absolute;
    top: 0px;
    left: 0;
    width: 100%;
    height: 80px;
}
.mybusiness .process-history-renderer .info-bar table {
    position: absolute;
    top: 17px;
    left: 17px;
    width: calc(100% - 17px);
    table-layout: fixed;
}
.mybusiness .process-history-renderer .process-renderer {
    position: absolute;
    top: 80px;
    left: 0;
    width: 100%;
    height: calc(100% - 80px);
}
.mybusiness .process-history-renderer .info-bar .compare-details {
    padding-left: 15px;
}


/* --- /styles/mybusiness-processes-reporting.css--- */ 

.mybusiness .processes-reporting .sliding-layer-container {
    top: 47px;
    height: calc(100% - 47px) !important;
    width: 350px;
}
.mybusiness .processes-reporting .sliding-layer-bar {
    height: 40px;
}
.mybusiness .processes-reporting .sliding-layer-content {
    top: 40px;
    height: calc(100% - 40px);
}
.mybusiness .processes-reporting .slider-bar-title {
    position: relative;
    height: 40px;
    padding-left: 15px;
    padding-right: 0px;
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    width: calc(100% - 10px);
    text-overflow: ellipsis;
}

/* --- /styles/mybusiness-processes-reporting-renderer.css--- */ 

.mybusiness .processes-reporting-renderer {
    position: absolute;
    top: 0px;
    left: 352px;
    width: calc(100% - 352px);
    height: 100%;
}
.mybusiness .processes-reporting-renderer .renderer-page {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}

.mybusiness .processes-reporting-renderer .renderer-page .message {
    text-align: center;
    padding-bottom: 120px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -ms-transform: translateY(-50%) translateX(-50%);
    -webkit-transform: translateY(-50%) translateX(-50%);
}
.mybusiness .processes-reporting-renderer .renderer-page.reports-listing .scroll-container {
    width: 100%;
    height: 100%;
}
.mybusiness .processes-reporting-renderer .renderer-page.reports-listing .listing-container {
    width: 100%;
    min-height: 100%;
    height: auto;
    position: relative;
}
.mybusiness .processes-reporting-table {
    position: relative;
    width: 100%;
    height: auto;
    display: block;
    padding-top: 10px;
}
.mybusiness .processes-reporting-table .top-bar {
    position: relative;
    width: 100%;
    height: 20px;
    line-height: 20px;
    display: block;
}
.mybusiness .processes-reporting-table .top-bar .control-icon,
.mybusiness .processes-reporting-table .top-bar .control-label {
    line-height: 20px !important;
}
.mybusiness .processes-reporting-table .table-container {
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    padding: 15px;
}
.mybusiness .processes-reporting-table .table-container .table-holder {
    width: 100%;
    max-height: 700px;
}
.mybusiness .processes-reporting-table .table-container .scrollable-table {
   max-height: 100%;
   width: 100%;
   padding-right: 19px;
   overflow-y: hidden;
   overflow-x: scroll;
}
.mybusiness .processes-reporting-table.collapsed .table-container,
.mybusiness .processes-reporting-table.disabled .table-container {
    display: none;
}
.mybusiness .processes-reporting-table .top-bar .name-container {
    position: absolute;
    left: 0px;
    top: 0px;
    width: calc(100% - 275px);
    height: 100%;
    display: flex;
}
.mybusiness .processes-reporting-table .top-bar .controls-container {
    position: absolute;
    right: 25px;
    top: 0px;
    width: auto;
    height: 100%;
    display: flex;
    text-align: right;
    max-width: 500px;
}
.mybusiness .processes-reporting-table.collapsed .top-bar .controls-container {
    display: none;
}
.mybusiness .processes-reporting-table .top-bar .collapse-icon {
    position: absolute;
    width: 14px;
    height: 14px;
    display: inline-block;
    margin-left: 10px;
    margin-top: 3px;
}
.mybusiness .processes-reporting-table.expanded .top-bar .collapse-icon {   
    height: 7px;
    margin-top: 7px;
    margin-left: 6px;
}
.mybusiness .processes-reporting-table .top-bar .template-name {
    position: relative;
    width: auto;
    height: 20px;
    display: inline-block;
    max-width: 450px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    margin-right: 10px;
    margin-left: 24px
}
.mybusiness .processes-reporting-table .top-bar .status {
    display: none;
    position: relative;
    width: auto;
    height: 20px;
}
.mybusiness .processes-reporting-table .top-bar .control {
    display: flex;
    margin-left: 10px;
}
.mybusiness .processes-reporting-table .top-bar .control .control-icon {
    margin-right: 5px;
}
.mybusiness .processes-reporting-table .processes-count-container {
    display: flex;
    line-height: 20px
}
.mybusiness .processes-reporting-table .processes-count-container .counter {
    margin-left: 7px;
}
.mybusiness .processes-reporting-table {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}
.mybusiness .processes-reporting-table .control.multi-select-off {
    display: none;
}
.mybusiness .processes-reporting-table .control.multi-select-on {
    display: flex;
}
.mybusiness .processes-reporting-table.multi-select-on .control.multi-select-off {
    display: flex;
}
.mybusiness .processes-reporting-table.multi-select-on .control.multi-select-on {
    display: none;
}
.mybusiness .processes-reporting-table .reporting-table {
    min-width: 100%;
    max-width: none;
    width: auto !important;
}
.mybusiness .processes-reporting-table th,
.mybusiness .processes-reporting-table td {
    padding: 10px;
    text-align: center;
    min-width: 100px;
}

.mybusiness .processes-reporting-table .reporting-table {
    width: 100% !important;
}
.mybusiness .processes-reporting-table .dataTables_scrollHead,
.geolocation-reporting-trips-list-multiple .dataTables_scrollHead {
    min-height: 38px;
}
.mybusiness .processes-reporting-table .dataTables_wrapper {
    height: 100%;
}
.mybusiness .processes-reporting-table .dataTables_scroll {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.mybusiness .processes-reporting-table .dataTables_scrollBody {
    padding-bottom: 12px;
    overflow: hidden !important;
    max-height: 600px !important;
}
.mybusiness .processes-reporting-table .ps-scrollbar-x-rail {
    bottom: 0;
}
.mybusiness .dataTable th.select-all {
    min-width: 65px !important;
}
.mybusiness .dataTable th.select-all label {
    vertical-align: bottom;
    margin: 0;
}

.mybusiness .processes-reporting .sliding-layer-slide.renderer-slider {
    top: 28px;
}
.mybusiness .processes-reporting .sliding-layer-slide.renderer-slider .sliding-layer-content {
    top: 40px;
    height: calc(100% - 68px);
}
.mybusiness .processes-reporting .renderer-slider,
.mybusiness .processes-reporting .renderer-slider .summary-container {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}
.mybusiness .processes-reporting .renderer-slider .scrolled-container {
    width: 100%;
    height: 100%;
}
.mybusiness .processes-reporting .content-exporter-container {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}
.mybusiness .processes-reporting .content-exporter-container .info-bar {
    position: absolute;
    top:0px;
    left: 0px;
    width: 100%;
    height: 75px;
    padding: 20px;
}
.mybusiness .processes-reporting .content-exporter-container .process-renderer {
    position: absolute;
    top: 75px;
    left: 0px;
    width: 100%;
    height: calc(100% - 75px - 60px);
}
.mybusiness .processes-reporting .content-exporter-container .process-renderer.no-actions-bar {
    height: calc(100% - 75px);
}
.mybusiness .processes-reporting .content-exporter-container .actions-container {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    height: 60px;
    text-align: right;
    padding-right: 14px;
}
.mybusiness .processes-reporting .content-exporter-container .actions-container .sw-button {
    margin-left: 10px;
    height: 32px;
    margin-top: 14px;
}
.mybusiness .processes-reporting .content-exporter-container .sections-names-list {
    height: 80px;
    padding-top: 40px;
}
.process-reports-download-reports .option-row,
.process-reports-download-reports-list .option-row {
    display: block !important;
}
.mybusiness .processes-reporting-table .top-bar .clickable-bar {
    width: auto;
    display: flex;
}
.mybusiness .processes-reporting .renderer-slider .sliding-layer-title {
    position: absolute;
    left: 40px;
    top: 0px;
    width: calc(100% - 50px);
    height: 100%;
}
.mybusiness .processes-reporting .renderer-slider .sliding-layer-title.template .template-icon {
    position: absolute;
    left: 10px;
    top: 11px;
    width: 18px;
    height: 18px;
}
.mybusiness .processes-reporting .renderer-slider .sliding-layer-title.template .template-name {
    position: absolute;
    left: 35px;
    width: calc(100% - 35px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mybusiness .summary-container .summary {
    height: auto;
    margin: 20px;
    padding: 20px;
    position: relative;
}
.mybusiness .summary-container .summary .process-summary-title {
    position: absolute;
    top: -10px;
    left: -1px;
    padding: 0 10px 0 0;
}
.mybusiness .summary-container .summary td {
    padding-bottom: 10px;
    white-space: normal;
}
.mybusiness .summary-container .summary tr td:first-child {
    padding-right: 10px;
}
.mybusiness .processes-reporting-table td[data-role="Label"] {
    max-width: 250px;
    word-wrap: break-word;
}
.mybusiness .processes-reporting-table td.check {
    position: relative;
    min-width: 65px !important;
}
.mybusiness .processes-reporting-table td.check .round-checkbox {
    display: block;
    position: absolute;
    left: calc(50% - 10px);
    top: calc(50% - 10px);
    width: 20px;
    height: 20px;
}
.mybusiness .processes-reporting-table .no-zip td[data-role] {
    opacity: 0.6;
}

/* --- /styles/mybusiness-processes-reporting-filter.css--- */ 

.mybusiness .processes-reporting-filter {
    position: absolute;
    top: 28px;
    width: 350px;
    height: calc(100% - 28px);
}
/* // seems that for reporting there is no logo usage
.mybusiness .processes-reporting.with-logo .processes-reporting-filter {
    top: 177px;
    height: calc(100% - 177px);
}
*/
.mybusiness .processes-reporting-filter .preloader {
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 100;
}
.mybusiness .processes-reporting-filter .message {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 100px;
    left: 0px;
}
.mybusiness .processes-reporting-filter .processes-reporting-filter-template {
    width: 100%;
    height: 100%;
}
.mybusiness .processes-reporting-filter .processes-reporting-filter-template .scrolled-container {
    width: 98%;
}
.mybusiness .processes-reporting-filter .slider-bar-content {
    position: absolute;
    left: 40px;
    width: calc(100% - 40px);
    display: flex;
}
.mybusiness .processes-reporting-filter .subscriber-avatar {
    position: absolute;
    top: 19px;
    left: 15px;
    width: 42px;
    height: 42px;
    overflow: hidden;
}
.mybusiness .processes-reporting-filter .subscriber-avatar img {
    width: 100%;
    height: 100%;
}
.mybusiness .processes-reporting-filter .slider-bar-title {
    width: calc(100% - 45px);
}
.mybusiness .processes-reporting-filter .slider-bar-content .export-controls {
    position: absolute;
    right: 0px;
    width: 40px;
    height: 100%;
}
.mybusiness .processes-reporting-filter .slider-bar-content .export-button {
    position: absolute;
    top: 0px;
    height: 40px;
    line-height: 40px !important;
}
.mybusiness .processes-reporting-filter .page-title {
    position: absolute;
    width: 100%;
    height: 30px;
    padding-left: 20px;
}
.mybusiness .processes-reporting-filter .filter-properties {
    position: relative;
    top: 0px;
    left: 0px;
    width: 100%;
    height: auto;
    max-height: calc(100% - 50px);
    overflow: auto;
    overflow-x: hidden;
}
.mybusiness .processes-reporting-filter .customized-checkbox-label {
    white-space: normal;
}
.mybusiness .processes-reporting-filter .filter-properties .scroll-container {
    position: relative;
    width: 100%;
    min-height: 100%;
    height: auto;
}
.mybusiness .processes-reporting-filter .properties-group {
    display: block;
    position: relative;
    height: auto;
    width: calc(100% - 20px);
    margin-left: 10px;
    padding-top: 28px;
}
.mybusiness .processes-reporting-filter .properties-group.small {
    display: inline-block;
    position: relative;
    height: auto;
    width: 30%;
    margin-left: 15px;
    padding-top: 28px;
}
.mybusiness .processes-reporting-filter .properties-group:first-child {
    margin-top: 10px;
}
.mybusiness .processes-reporting-filter .properties-group .title {
    position: absolute;
    top: 0px;
    height: 28px;
    line-height: 28px;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mybusiness .processes-reporting-filter .properties-group .body {
    position: relative;
    width: 100%;
    height: calc(100% - 28px);
}
.mybusiness .processes-reporting-filter .properties-group .body table,
.mybusiness .processes-reporting-filter .properties-group .body select {
    width: 100% !important;
}
.mybusiness .processes-reporting-filter .controls-container {
    position: relative;
    width: 100%;
    height: 50px;
    padding-top: 10px;
}
.mybusiness .processes-reporting-filter .date-picker-container {
    display: block;
    position: relative;
    width: 157px;
    margin-right: 10px;
}
.mybusiness .processes-reporting-filter .date-picker-container input {
    min-width: auto;
    width: 100%;
}
.mybusiness .processes-reporting-filter .date-picker-container > span {
    display: block;
    position: absolute;
    right: 5px;
    top: 5px;
}
.mybusiness .processes-reporting-filter .select2-results {
    max-height: 240px;
}
.mybusiness .processes-reporting-filter .checkboxes-groups {
    display: flex;
    padding: 0px;
    margin-left: 5px;
    width: 100%;
}
.mybusiness .processes-reporting-filter .checkboxes-groups .properties-group {
    display: inline-block;
    width: 30%;
    margin: 1%;
    text-align: left;
}
.mybusiness .processes-reporting-filter .checkboxes-groups .square-checkbox {
    display: table-row;
    white-space: normal;
    overflow: visible;
}
.mybusiness .processes-reporting-filter .checkboxes-groups .square-checkbox .square-checkbox-label {
    display: table-cell !important;
    width: calc(100% - 18px);
}


/* --- /styles/mybusiness-processes-sorting.css--- */ 

.mybusiness .processes-sorting-layer .left-area.with-logo {
    top: 0px;
    height: 100%;
}
.mybusiness .processes-sorting-layer .select-categories-message .message {
    text-align: center;
    padding-bottom: 120px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -ms-transform: translateY(-50%) translateX(-50%);
    -webkit-transform: translateY(-50%) translateX(-50%);
}
.mybusiness .processes-sorting-layer .sliding-layer-container {
    top: 47px;
    height: calc(100% - 47px) !important;
    width: 350px;
}
.mybusiness .processes-sorting-layer .sliding-layer-bar {
    height: 40px;
}
.mybusiness .processes-sorting-layer .sliding-layer-content {
    top: 40px;
    height: calc(100% - 40px);
}
/*
.mybusiness .processes-sorting-layer .slider-bar-title {
    position: relative;
    height: 40px;
    padding-left: 15px;
    padding-right: 0px;
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    width: calc(100% - 10px);
    text-overflow: ellipsis;
}*/
.mybusiness .processes-sorting-slider {
    position: absolute;
    top: 28px;
    width: 350px;
    height: calc(100% - 28px);
}
.mybusiness .processes-sorting-slider .preloader {
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 100;
}
.mybusiness .processes-sorting-slider .message {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 100px;
    left: 0px;
}
.mybusiness .processes-sorting-slider .slider-bar-content {
    position: absolute;
    left: 40px;
    width: calc(100% - 40px);
    display: flex;
}
.mybusiness .processes-sorting-slider .slider-bar-title {
    width: calc(100% - 45px);
}
.mybusiness .processes-sorting-slider .slider-bar-content .sort-controls {
    position: absolute;
    right: 0px;
    width: 40px;
    height: 100%;
}
.mybusiness .processes-sorting-slider .slider-bar-content .sort-button {
    position: absolute;
    top: 0px;
    height: 40px;
    line-height: 40px !important;
}
.mybusiness .processes-sorting-slider .page-title {
    position: absolute;
    width: 100%;
    height: 30px;
    padding-left: 20px;
}
.mybusiness .processes-sorting-categories-template {
    height: 100%;
    display: flex;
}
.mybusiness .processes-sorting-slider .category-properties {
    position: relative;
    top: 0px;
    left: 0px;
    width: 100%;
    height: auto;
    max-height: calc(100% - 50px);
    overflow: auto;
    overflow-x: hidden;
}
.mybusiness .processes-sorting-slider .category-properties .scroll-container {
    position: relative;
    width: 100%;
    min-height: 100%;
    height: auto;
}
.mybusiness .processes-sorting-slider .properties-group {
    display: block;
    position: relative;
    height: auto;
    width: calc(100% - 20px);
    margin-left: 10px;
    padding-top: 10px;
}
.mybusiness .processes-sorting-slider .properties-group.small {
    display: inline-block;
    position: relative;
    height: auto;
    width: 30%;
    margin-left: 15px;
    padding-top: 20px;
}
.mybusiness .processes-sorting-slider .properties-group:first-child {
    margin-top: 10px;
}
.mybusiness .processes-sorting-slider .properties-group .title {
    position: relative;
    top: 0px;
    left: 5px;
    margin-bottom: 5px;
    height: 28px;
    line-height: 28px;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mybusiness .processes-sorting-slider .properties-group .body {
    position: relative;
    width: 100%;
    height: calc(100% - 28px);
}
.mybusiness .processes-sorting-slider .properties-group .body .option{
    position: relative;
    padding: 0px 0px 5px 10px;
}
.mybusiness .processes-sorting-slider .properties-group .body table,
.mybusiness .processes-sorting-slider .properties-group .body select {
    width: 100% !important;
}
.mybusiness .processes-sorting-slider .controls-container {
    position: absolute;
    width: 100%;
    margin-left: -15px;
    height: 50px;
    bottom: 20px;
}
.mybusiness .processes-sorting-slider .date-picker-container {
    display: block;
    position: relative;
    width: 157px;
    margin-right: 10px;
}
.mybusiness .processes-sorting-slider .date-picker-container input {
    min-width: auto;
}
.mybusiness .processes-sorting-slider .date-picker-container > span {
    display: block;
    position: absolute;
    right: 5px;
    top: 5px;
}
.mybusiness .processes-sorting-slider .select2-results {
    max-height: 240px;
}
.mybusiness .processes-sorting-slider .checkboxes-groups {
    display: flex;
    padding: 0px;
    margin-left: 10px;
    width: calc(100% - 20px);
}
.mybusiness .processes-sorting-slider .checkboxes-groups .properties-group {
    display: inline-block;
    width: 100%;
    margin: 0px;
}
.mybusiness .processes-sorting-slider .checkboxes-groups .square-checkbox {
    display: table-row;
    white-space: normal;
    overflow: visible;
}
.mybusiness .processes-sorting-slider .checkboxes-groups .square-checkbox .square-checkbox-label {
    display: table-cell !important;
    width: calc(100% - 18px);
}
.mybusiness .processes-sorting-slider .controls-container button {
    position: absolute;
}
.mybusiness .processes-sorting-slider .controls-container .cancel-button {
    left: 30px;
}
.mybusiness .processes-sorting-slider .controls-container .sort-button {
    right: 30px;
}
.mybusiness .processes-sorting-slider .select2-container .select2-selection--single .select2-selection__arrow {
    position: absolute;
    right: 7px;
    top: 12px;
    width: 10px;
    height: 10px;
    display: inline-block;
    content: "";
}
.mybusiness .processes-sorting-slider a.select2-selection--single {
    position: relative;
    max-height: 34px;
    line-height: 36px;
    height: auto !important;
}


/* --- /styles/mybusiness-processes-import-export.css--- */ 

.export-processes-tables-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 100%;
    height: auto;
    padding: 15px;
}
.export-processes-tables-container .table-container {
    position: relative;
    width: 100%;
    height: auto;
    margin-bottom: 40px;
}
.export-processes-tables-container .table-title {
    height: 25px;
    line-height: 25px;
}
.export-processes-tables-container .table-container table {
    width: 100%;
}
.export-processes-tables-container .table-container table.with-no-records th {
    opacity: 0.2;
}
.export-processes-tables-container th {
    height: 40px;
    line-height: 40px;
}
.export-processes-tables-container td {
    height: 30px;
    line-height: 30px;
}

/* --- /styles/mybusiness-processes-exporting.css--- */ 

.processes-exporting-statuses {
    position: absolute;
    top: 0px;
    left: 352px;
    width: calc(100% - 352px);
    height: 100%;
    /* display: none; */
}
.mybusiness .processes-exporting-table {
    position: relative;
    width: 100%;
    height: auto;
    display: block;
    padding-top: 10px;
}
.mybusiness .processes-exporting-table .table-container {
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    padding: 0 15px 15px 15px;
}
.mybusiness .processes-exporting-table .table-container .name-container {
    padding-bottom: 5px
}
.mybusiness .processes-exporting-table .exporting-table {
    min-width: 100%;
    max-width: none;
    width: auto !important;
}

/**/

.mybusiness .exporting-table th {
    padding:10px;
    min-width:100px;
}

.processes-exporting-modal .processes-exporting-modal-description {
    padding-bottom: 20px;
}
.processes-exporting-modal #export-summary-label {
    position: absolute;
    top: 60px;
    left: 16px;
    width: auto;
    padding: 0 9px 0 10px;
}
.processes-exporting-modal #export-summary-label.details {
    top: 0px;
}
.processes-exporting-modal table {
    position: relative;
    width: 100%;
}
.processes-exporting-modal table td {
    padding-top: 2.5px;
    padding-bottom: 2.5px;
}
.processes-exporting-modal table td:nth-child(odd) {
    width: 30%;
}
.processes-exporting-modal table td:nth-child(even) {
    width: 70%;
}
.processes-exporting-modal .export-details {
    padding:10px;
}
.processes-exporting-modal  .modal-footer {
    display: flex;
    justify-content: space-between;
}
.processes-exporting-modal .btn-success.details{
    position: relative;
    margin: auto;
}
.mybusiness .processes-exporting-renderer {
    position: absolute;
    top: 0px;
    left: 352px;
    width: calc(100% - 352px);
    height: 100%;
}
.mybusiness .processes-exporting-renderer .renderer-page {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    overflow-y: scroll;
}
.mybusiness .processes-exporting-statuses {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}

.mybusiness .processes-exporting-renderer .renderer-page .message {
    padding-bottom: 120px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -ms-transform: translateY(-50%) translateX(-50%);
    -webkit-transform: translateY(-50%) translateX(-50%);
}

/* --- /styles/myrules-global.css--- */ 

#my-rules-packages-menu {
    z-index: 1000;
}
#menu-item-my-rules.empty {
    display: none;
}
#menu-item-my-rules .expand-controls {
    display: block;
    position: absolute;
    top: 18px;
    right: 0px;
    width: 12px;
}
#menu-item-my-rules .expand-controls span {
    display: none;
}
#menu-item-my-rules:not(.expanded) span[data-role=expand] {
    display: block;
}
#menu-item-my-rules.expanded span[data-role=collapse] {
    display: block;
}
#menu-item-my-rules .packages-menu {
    display: none;
    width: auto;
    min-width: 180px;
    height: auto;
    min-height: 30px;
    position: absolute;
    left: -71px;
    top: calc(100% + 7px);
    padding-left: 10px;
    padding-right: 10px;
}
#menu-item-my-rules.expanded .packages-menu {
    display: block;
}
#menu-item-my-rules .package-item {
    display: block;
    width: auto;
    min-width: 100%;
    height: 30px;
    line-height: 30px;
    white-space: nowrap;
}
#menu-item-my-rules .package-icon {
    display: none;
    position: absolute;
    top: 9px;
    left: 19px;
    width: calc(100% - 39px);
    height: calc(100% - 21px);
    border-radius: 3px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#menu-item-my-rules.with-package-icon .package-icon {
    display: block;
}
#menu-item-my-rules.with-package-icon .icon {
    display: none;
}

/* --- /styles/notifications-panel.css--- */ 

.notifications-panel {
    position: fixed;
    top: 150px;
    left: calc(50vw - 350px);
    width: 700px !important;
    z-index: 2000;
    min-height: 40px;
    max-height: calc(100vh - 300px);
    height: auto;
    cursor: default;
    display: none;
}
.notifications-panel.opened {
    display: block;
}
.notifications-panel .modal-bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
}
.notifications-panel .popup-title {
    display: block;
    position: absolute;
    top: -50px;
    height: 50px;
    line-height: 50px;
    width: 100%;
    z-index: 2;
}
.notifications-panel .popup-title .title {
    position: absolute;
    left: 13px;
}
.notifications-panel .popup-title .close-btn {
    position: absolute;
    top: 19px;
    right: 10px;
}
.notifications-panel.not-all-selected .select-all {
    display: flex !important;
}
.notifications-panel.not-all-selected .unselect-all {
    display: none !important;
}
.notifications-panel.multi-select-on .close-btn-block {
    display: none;
}
.notifications-panel .close-btn-block .delete-notification {
    width: 32px;
    text-align: center;
}
.notifications-panel .no-notifications {
    position: relative;
    display: block;
    top: 0px;
    height: 40px;
    width: 100%;
    line-height: 40px;
    padding-left: 10px;
}
.notifications-panel.with-no-records .no-notifications {
    display: block;
}
.notifications-panel.with-no-records .listing-container,
.notifications-panel.with-no-records .show-all-notifications-btn,
.notifications-panel.with-no-records .controls-bar .control-button,
.notifications-panel.with-no-records .download-filtered-notifications {
    display: none !important;
}
.notifications-panel .top-arrow {
    position: absolute;
    top: -10px;
    right: 10px;
    width: 30px;
    height: 10px;
}
.notifications-panel .controls-bar-container {
    position: relative;
    display: block;
    height: 40px;
    line-height: 40px;
}
.notifications-panel .controls-bar {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: flex-end;
    padding-right: 11px;
}
.notifications-panel .controls-bar.alternate {
    display: none;
}
.notifications-panel.multi-select-on .controls-bar {
    display: none;
}
.notifications-panel.multi-select-on .controls-bar.alternate {
    display: flex;
}
.notifications-panel .control-button {
    min-width: 20px;
    position: relative;
    height: 40px;
    line-height: 40px;
    display: inline-flex;
    margin-right: 5px;
}
.notifications-panel .control-button .action-icon {
    position: relative;
    line-height: 40px;
    margin-right: 5px;
}
.notifications-panel .control-button .action {
    position: relative;
    width: auto;
    height: 100%;
}
.notifications-panel .control-button.select-all,
.notifications-panel .control-button.unselect-all {
    position: absolute;
    top: 0px;
    left: 10px;
    width: 220px;
    height: 40px;
    line-height: 40px;
}
.notifications-panel .control-button.hidden {
    display: none;
}
.notifications-panel .listing-container-scrollable {
    position: relative;
    margin-top: 40px;
    width: 100%;
    height: auto;
    max-height: calc(100vh - 292px);
    overflow: auto;
}
.notification-panel .listing-container-scrollable .listing-container {
    position: relative;
    width: 100%;
    height: auto;
    min-height: 100%;
}
.notifications-panel .listing-container-scrollable {
    display: block;
}
.notifications-panel .notifications-container {
    position: absolute;
    width: 100%;
}
.notifications-panel .notification-item {
    position: relative;
    width: 100%;
    min-height: 30px;
    height: auto;
    display: block;
    padding-top: 3px;
}
.notifications-panel .notification-item.hidden-by-filter {
    display: none;
}
.notifications-panel.multi-select-on .notification-item[data-can-be-deleted="0"]  {
    opacity: 0.5;
    cursor: default;
}
.notifications-panel.multi-select-on .notification-item[data-can-be-deleted="0"] .checkbox-block {
    opacity: 0;
}
.notifications-panel .tabs-container {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 30px;
    line-height: 30px;
    display: flex;
}
.notifications-panel .tabs-container.one-tab {
    display: none;
}
.notifications-panel .tabs-container .tab {
    width: auto;
    display: inline-block;
    padding-left: 10px;
    padding-right: 10px;
}
.notifications-panel .tabs-container .tab.hidden-by-no-feature {
    display: none;
}
.notifications-panel .tabs-content {
    position: relative;
    width: 100%;
    height: auto;
    min-height: 40px;
    max-height: calc(100vh - 250px);
    overflow-y: auto;
}
.notifications-panel .tabs-content [data-tab] {
    position: relative;
    width: 100%;
    height: auto;
    display: none;
}
.notifications-panel .tabs-content [data-tab].visible {
    display: block;
}
.notifications-panel .notification-item div[data-role],
.notifications-panel .notification-item .skinned-checkbox {
    display: none;
    margin: 5px;
}
.notifications-panel .notification-item.quota div[data-role="quota"],
.notifications-panel .notification-item.feature-voip div[data-role="feature-voip"],
.notifications-panel .notification-item.feature-voip-video div[data-role="feature-voip-video"],
.notifications-panel .notification-item.feature-ptt div[data-role="feature-ptt"],
.notifications-panel .notification-item.feature-ack div[data-role="feature-ack"],
.notifications-panel .notification-item.webrtc-not-available div[data-role="webrtc-not-available"],
.notifications-panel .notification-item.process-incoming-overdue div[data-role="process-incoming-overdue"],
.notifications-panel .notification-item.process-overdue div[data-role="process-overdue"],
.notifications-panel .notification-item.process-incoming-expiration div[data-role="process-incoming-expiration"],
.notifications-panel .notification-item.process-expired div[data-role="process-expired"],
.notifications-panel .notification-item.unrelated div[data-role="unrelated"],
.notifications-panel .notification-item.geolocation-state-changed div[data-role="geolocation-state-changed"] {
    display: block;
}
.notifications-panel .notification-item table {
    width: 100%;
    height: 100%;
    font-family: inherit !important;
    font-size: inherit !important;
}
.notifications-panel .notification-item td {
    vertical-align: middle;
    min-width: 10px;
}
.notifications-panel .notification-item .body-block {
    width: 100%;
    height: 30px;
}
.notifications-panel .notification-item .date-block {
    min-width: 100px;
}
.notifications-panel.multi-select-on .notification-item .checkbox-block .skinned-checkbox {
    display: block;
}
.notifications-panel .show-all-notifications-btn {
    display: none;
    height: 30px;
    line-height: 30px;
}
.notifications-panel #loading {
    height: 40px;
}

/* --- /styles/iframe-api.css--- */ 

#iframes-api {
    display: none;
    position: absolute;
    top: 54px;
    left: 0;
    width: 100vw;
    height: calc(100vh - 54px);
    z-index: 1000; /* it must be under #call-banner-manager which has 1001*/
}
#iframes-api.visible {
    display: block;
}
#iframes-api .iframes-company-logo {
    display: block;
    position: absolute;
    left: 0;
    top:0;
    width: 350px;
    height: 160px;
    left: calc((100% - 1260px)/2);
    z-index: 2;
}
#iframes-api .iframes-company-logo:after {
    display: block;
    content: "";
    width: 310px;
    height: 1px;
    position: absolute;
    left: calc((100% - 310px) / 2);
    bottom: 0px;
}
#iframes-api .iframes-company-logo img {
     width: 267.5px;
     position: absolute;
     left: calc((100% - 268.5px) / 2);
     top: 32px;
 }
#iframes-api .iframes-company-logo.no-logo {
    display: none;
}
#iframes-api .iframe-container {
    display: none;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top:0;
}
#iframes-api .iframe-container.rised {
    display: block;
}
#iframes-api iframe {
    width: 100%;
    height: 100%;
    border: none;
}

/* --- /styles/color-picker.css--- */ 



/* --- /styles/unread-monitor-layer.css--- */ 

.unread-monitor-element.total-sticker {
    position: relative;
    display: flex !important;
    width: 100%;
    height: 25px;
    z-index: 401;
}
.unread-monitor-element.total-sticker.hidden {
    display: none !important;
}
.unread-monitor-element.total-sticker .text {
    position: relative;
    width: auto;
    min-width: 50px;
    margin-left: auto;
    margin-right: auto;
    height: 25px;
    line-height: 25px;
}
.unread-monitor-element.bottom-sticker {
    position: absolute;
    display: none;
    bottom: 10px;
    right: 15px;
    width: 40px;
    height: 25px;
    z-index: 401;
}
.unread-monitor-element.bottom-sticker:after {
    position: absolute;
    width: 0;
    height: 0;
    content: "";
    top: 9px;
    left: 16px;
}
.unread-monitor-element.bottom-sticker .counter {
    display: none;
    position: absolute;
    min-width: 20px;
    width: auto;
    height: 20px;
    content: "";
    top: -10px;
    left: -7px;
    border-radius: 10px;
    line-height: 20px;
    padding-left: 5px;
    padding-right: 5px;
    text-align: center;
    z-index: 2;
}
.unread-monitor-element.bottom-sticker.with-counter .counter {
    display: block;
}


/* --- /styles/call-out-button-manager.css--- */ 

.call-out-button {
    width: 40px;
    height: 35px;
    text-align: center;
    position: absolute;
    display: inline-block;
}
.page-features .call-out-button[data-page="contacts"],
.section-title  .call-out-button[data-page="geolocation"]{
    position: relative !important;
    height: 30px;
    top: auto;
    right: auto;
}
.call-out-button[data-page="conversations"] {
    right: 10px;
    bottom: 0px;
}
.call-out-button[data-page="geolocation"] {
    right: 17px;
    top: 17px;
}
.left-container.contact .page-features,
.geolocation-contacts .page-features {
    position: absolute;
    right: 20px;
    top:0;
    width: auto;
}
.geolocation-contacts .page-features {
    right: 5px;
    display: flex;
}
.contacts-filter-button {
    float: right;
    display: inline-block;
    position: relative;
}

.guest-invite-btn {
    width: 40px;
    margin-right: 8px;
    display: inline-block;

}

.contacts-filter {
    height: auto;
    width: 300px;
    max-height: calc(100vh - 346px);
    overflow-y: auto;
    overflow-x: hidden;
    margin-bottom: 46px;
}
.contacts-filter .close {
    position: absolute;
    right: 25px;
    top: 6px;
}
.contacts-filter .filter-container {
    height: auto;
    width: calc(100% - 20px);
    margin: 20px;
    margin-top: 10px;
    padding-bottom: 40px;
}
.contacts-filter .buttons-container {
    height: auto;
    width: calc(100% - 20px);
    display: flex;
    justify-content: space-between;
    position: absolute;
    bottom: 0;
    padding-bottom: 10px;
    width: calc(100% - 20px);
}
.contacts-filter .buttons-container button:last-child {
    margin-left: 10px;
}
.contacts-filter .properties-container {
    margin-top: 5px;
}
.contacts-filter .property-row {
    margin-bottom: 5px;
}
.contacts-filter .label-row {
    margin-top: 10px;
}
.call-out-keyboard .modal-header {
    z-index: 4;
    position: relative;
}
.call-out-keyboard .disablement-mask {
    position: absolute;
    z-index: 3;
    width: 100%;
    height: calc(100% + 47px);
    top: -47px;
    left: 0;
    display: none;
}
.call-out-keyboard.disabled .disablement-mask {
    display: block;
}

/* --- /styles/call-out-keyboard.css--- */ 

.call-out-keyboard .modal-sm {
    top: 23px;
    width: 410px !important;
    max-width: none;
}
.call-out-keyboard .modal-body {
    height: 460px;
}
.call-out-keyboard .input-container {
    width: calc(100% - 48px);
    height: 40px;
    position: absolute;
    top: -12px;
    left: 25px;
}
.call-out-keyboard input {
    position: absolute;
    left: 0px;
    top: 0px;
    margin: 0px;
    width: calc(100% - 30px);
    height: 100%;
}
.call-out-keyboard .placeholder {
    position: absolute;
    top: 0px;
    width: calc(100% - 24px);
    height: 100%;
    z-index: 1;
    line-height: 40px;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.call-out-keyboard .flag-dropdown {
    height: 25px;
    margin-top: 6px;
}
.call-out-keyboard .reset-input {
    position: absolute;
    top: 12px;
    right: 0px;
    width: 15px;
    height: 18px;
    line-height: 18px !important;
    text-align: center;
}
.call-out-keyboard .auto-complete-container {
    position: absolute;
    display: none;
    top: 36px;
    left: 25px;
    width: 360px;
    height: 54px;
}
.call-out-keyboard .auto-complete-container .main-row {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    display: flex
}
.call-out-keyboard .results-opener {
    position: relative;
    padding-left: 10px;
    line-height: 34px;
}
.call-out-keyboard .results-opener.multiple {
    padding-right: 20px;
}
.call-out-keyboard .results-opener.multiple:after {
    position: absolute;
    right: 0px;
    top: 12px;
    content: "";
}
.call-out-keyboard .main-row > div {
    display: inline-block;
    height: calc(100% - 20px);
    margin-top: 10px;
}
.call-out-keyboard .first-result {
    flex-grow: 1;
}
.call-out-keyboard .results-counter {
    min-width: 50px;
}
.call-out-keyboard .results-list {
    display: none;
    position: absolute;
    z-index: 3;
    width: 250px;
    height: auto;
    right: -15px;
    top: 50px;
}
.call-out-keyboard .results-list .scroll-container {
    position: relative;
    display: block;
    width: calc(100% - 10px);
    margin: 5px;
    margin-bottom: 0px;
    height: auto;
    min-height: 60px;
    max-height: 280px;
    overflow: hidden;
}
.call-out-keyboard .results-list .subscriber-item {
    width: 100%;
    height: 50px;
    display: block;
}
.call-out-keyboard .results-list .arrow {
    width: 0;
    height: 0;
    position: absolute;
    right: 11px;
    top: -12px;
}
.call-out-keyboard .results-list .arrow:after {
    position: absolute;
    top: 2px;
    right: -10px;
}
.call-out-keyboard .auto-complete-container.expanded .results-list {
    display: block;
}
.call-out-keyboard .keys-container {
    position: absolute;
    top: 90px;
    left: 25px;
    width: 360px;
    height: 280px;
}
.call-out-keyboard .keys-container .row {
    position: relative;
    display: flex;
    width: 100%;
    height: 70px;
    line-height: 70px;
    margin: 0px !important;
    padding: 0px !important;
}
.call-out-keyboard .key {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 60px;
    margin-top: 5px;
    margin-left: 37px;
    margin-right: 10px;
    border-radius: 67px;
    line-height: 60px;
}
.call-out-keyboard .key .number {
    position: absolute;
    top: -4px;
    left: 0px;
    width: 100%;
    height: 100%;
    text-align: center;
    line-height: 70px;
    z-index: 2;
}
.call-out-keyboard .key .number.star {
    top: 1px;
}
.call-out-keyboard .key .letters {
    position: absolute;
    top: -4px;
    left: 50%;
    width: 50%;
    height: 100%;
    line-height: 70px;
    padding-left: 14px;
}
.call-out-keyboard .button-container {
    position: absolute;
    bottom: 30px;
    left: 0px;
    width: 100%;
    height: 45px;
    text-align: center;
}
.call-out-keyboard .call-button {
    width: 125px;
    height: 100%;
    border-radius: 50px;
    font-size: 30px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    line-height: 45px;
}
.call-out-keyboard .subscriber-item {
    position: relative;
    display: block;
    width: 190px;
    height: 40px;
}
.call-out-keyboard .subscriber-item .picture {
    position: absolute;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    overflow: hidden;
}
.call-out-keyboard .subscriber-item .picture img {
    width: 100%;
}
.call-out-keyboard .subscriber-item .name,
.call-out-keyboard .subscriber-item .msisdn {
    position: absolute;
    top: 0px;
    left: 45px;
    width: calc(100% - 45px);
    line-height: 20px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.call-out-keyboard .subscriber-item .msisdn { 
    top: 20px;
}
.call-out-keyboard .first-result .subscriber-item {
    margin-top: -4px;
    margin-left: 45px;
}
.call-out-keyboard .list-container .subscriber-item {
    margin-bottom: 5px;
}
.call-out-keyboard .list-container .subscriber-item:after {
    position: absolute;
    bottom: 2px;
    left: 5px;
    width: calc(100% - 10px);
    height: 1px;
    content: "";
}
.call-out-keyboard .list-container .subscriber-item:last-child:after {
    display: none;
}
.call-out-keyboard .subscriber-item .msisdn span:first-child {
    font-family: General-font-bold, Arial, Helvetica, sans-serif;
    text-decoration: underline;
}

/* --- /styles/message-ack.css--- */ 

.chat-window-send-messages .message-ack-control {
    position: relative;
    display: flex;
}

.geolocation-chat-window.with-ack .max-upload-info {
    display: none;
}
.message-status .message-ack,
.sent-message-details .message-ack,
.chat-window-send-messages .message-ack {
    position: relative;
    display: inline-block;
    width: auto;
    min-width: 23px;
    line-height: 23px;
    height: 23px;
    padding-left: 3px;
    padding-right: 3px;
    border-radius: 14px;
    text-align: center;
}
.message-status .message-ack,
.sent-message-details .message-ack {
    width: 15px;
    height: 15px;
    line-height: 15px;
    min-width: 15px;
    font-size: 9px;
    padding: 0;
    margin: 0;
    display: block;
}
.chat-window-send-messages .message-ack .tick {
    display: none;
    position: absolute;
    right: -6px;
    top: 11px;
}
.chat-window-send-messages .message-ack-control.active .tick {
    display: block;
}
#send-message {
    position: relative;
    margin-top: 12px;
    margin-right: 10px;
}
#send-message .message-ack {
    position: absolute;
    display: none;
    min-width: 30px;
    width: auto;
    height: 30px;
    line-height: 24px;
    border-radius: 15px;
    right: 23px;
    top: -1px;
}
#send-message.with-ack .message-ack {
    display: block;
}
#send-message.with-ack {
    padding-left: 20px !important;
}
.chat-messages .message .message-ack-control {
    position: absolute;
    display: none;
    right: -50px;
    bottom: 0px;
    width: 40px;
    height: 40px;
    z-index: 2;
    line-height: 40px;
    text-align: center;
    border-radius: 14px;
}
.chat-messages .message .message-ack-control::after {
    position: absolute;
    content: "";
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    left: -9px;
    top: 15px;
}
.chat-messages .message .message-ack-control span {
    width: 30px !important;
    height: 30px !important;
    display: block;
    position: absolute;
    top: 5px;
    right: 5px;
    line-height: 30px;
    text-align: center;
    overflow: hidden !important;
    white-space: nowrap !important;
    margin: 0px;
}
.chat-messages.with-ack-controls .message.with-ack .message-ack-control {
    display: block;
}
.chat-messages.with-ack-controls .message.with-ack .message-container:not(.multiple)  {
    width: calc(100% - 90px);
}
.chat-messages.with-ack-controls .message.with-ack .message-container.multiple  {
    width: calc(100% - 140px);
    margin-right: 70px;
}
.chat-messages .message .time {
    position: relative;
}
.chat-messages .message .ack-flag {
    display: none;
    position: absolute;
    top: -2px;
    right: -17px;
    width: auto;
    min-width: 15px;
    height: 15px;
    line-height: 15px;
    text-align: center;
}
.chat-messages .message.acknowledged .ack-flag {
    display: block;
}
.message-status .message-ack-counter {
    display: none;
    width: auto;
    height: 13px;
    margin-right: 2px;
}
.message-sent .message-status .message-ack {
    margin-right: 5px;
    display: none;
}


/* --- /styles/quota-renderer.css--- */ 

.quota-renderer .progress-bar-container {
    width: 250px;
    height: 15px;
    vertical-align: bottom;
    margin-right: 22px;
}
.quota-renderer .header-info-top > div {
    display: inline-block;
}
.quota-renderer .header-info-top  {
    padding-bottom: 6px;
}
.quota-renderer .header-info-bottom {
    opacity: 0;
}
.quota-renderer .header-info-bottom.warning {
    opacity: 1;
}
.quota-renderer .attachment-manager-content {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    overflow: hidden;
}
.quota-renderer .no-title {
    display:none;
}

.quota-renderer .attachment-details,
.quota-renderer .process-details,
.quota-renderer .upgrade-storage-quota
{
    padding: 2px 0px;
    width: fit-content;
}

/* --- /styles/video-conference-landing-pages.css--- */ 

.conference-closed {
    margin: 0;
}
.conference-closed .brand-logo {
    margin-left: 30px;
    width: 280px;
    height: 88px;
}
.conference-closed .message {
    position: absolute;
    width: 100%;
    height: 74px;
    top: calc((100% - 74px)/2);
}
.conference-redirect-container {
    display: flex;
    flex-direction: column;
    position: absolute;
    width: 100%;
    height: auto;
    top: 300px;
}
.conference-redirect-container > div {
    position: relative !important;
}
.conference-redirect-container .button {
    text-align: center;
    margin: 20px;
    padding: 10px;
    width: 50%;
    user-select: none;
    display: flex;
    flex-direction: column;
}
.conference-redirect-container .button span {
    display: block;
    flex-grow: 1;
    line-height: 30px;
}
.conference-redirect-container .redirect-controls {
    margin-left: 5%;
    width: 90%;
    display: flex;
}

/* --- /styles/reach-back.css--- */ 

.channel-reach-back-container {
    display: none;
    position: absolute;
    top: 54px;
    height: auto;
    z-index: 1054;
}
.channel-reach-back-container.opened {
    display: block;
}
.channel-reach-back-container .title-bar {
    position: relative;
    width: 100%;
    height: 38px;
    padding-left: 10px;
    padding-right: 10px;
    line-height: 38px;
    display: flex;
    justify-content: space-between;
}
.channel-reach-back-container .title-bar .circle {
    position: relative;
    top: 7px;
    left: auto;
}
.channel-reach-back-container .title-bar .undo-button {
    display: none;
}
.channel-reach-back-container .no-records {
    height: 30px;
    line-height: 30px;
    margin-left: 10px;
}
.channel-reach-back-container .requests-list {
    margin-left: 10px;
    max-height: calc(100vh - 600px);
    height: auto;
    overflow-y: auto;
    padding-left: 10px;
}
.channel-reach-back-container .channel-reach-back-request {
    display: flex;
    height: auto;
    min-height: 70px;
    position: relative;
    padding-top: 10px;
}
.channel-reach-back-container .channel-reach-back-request span {
    display: inline-block;
}
.channel-reach-back-container .channel-reach-back-request .details-block {
    position: relative;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    padding-right: 10px;
}
.channel-reach-back-container .channel-reach-back-request .group-name {
    display: flex;
    line-height: 26px;
}
.channel-reach-back-container .channel-reach-back-request .details {
    display: flex;
}
.channel-reach-back-container .channel-reach-back-request .details .status {
    flex-grow: 1;
}
.channel-reach-back-container .channel-reach-back-request .details .date {
    flex-shrink: 0;
}
.channel-reach-back-container .channel-reach-back-request .controls-block {
    width: 75px;
    flex-shrink: 0;
    display: flex;
    justify-content: space-evenly;
    line-height: 70px;
}
.channel-reach-back-container .ptt-button {
    width: 35px;
    height: 35px;
    text-align: center;
    border-radius: 20px;
    line-height: 35px;
    margin-top: 16px;
}
.channel-reach-back-container .channel-reach-back-request.to-be-deleted {
    opacity: 0.3;
}

/* --- /styles/audio-configuration.css--- */ 

.audio-config-container {
    display: none;
    position: absolute;
    top: 54px;
    height: auto;
    z-index: 1050;
    max-width: max-content;
}
.audio-config-tpl .header-audio-section,
.audio-config-tpl .footer-audio-section {
    display: inline-flex;
    width: fit-content;
    word-break: keep-all;
    padding: 5px;
    font-weight: bold;
    font-size: 14px;
    cursor: default;
}
.audio-config-tpl .header-audio-section .stw-icon {
    padding: 5px 5px 0 0;
}
.audio-config-tpl {
    box-shadow: 2px 3px 6px -1px #B5B5B5;
    background-color: #F7F7F7;
    border-right: 2px solid #B5B5B5;
    border-bottom: 2px solid #B5B5B5;
}
.audio-config-tpl:after {
    width: 0;
    height: 0;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 12px solid #F7F7F7;
    content: "";
    position: absolute;
    top: -12px;
    left: 20px;
}
.audio-config-tpl .audio-config-hr {
    display: block;
    margin: 0 auto;
    width: 80%;
}
.audio-config-tpl .header-audio-section.output,
.audio-config-tpl .body-audio-section.output {
    display: none;
}
.audio-config-tpl .body-audio-section {
    width: max-content;
}
.audio-config-tpl .body-audio-section .audio-config-option {
    line-height: 25px;
    padding: 0 15px 2px 25px;
}
.audio-config-tpl .body-audio-section .audio-config-option-used {
    position: absolute;
    left: 8px;
    padding-top: 6px;
}
.audio-config-tpl .header-audio-section.refresh {
    cursor: pointer;
    display: block;
    margin: auto;
}
.audio-config-tpl .header-audio-section.refresh .stw-icon {
    padding: 0;
    line-height: 2em;
}