body {
    height: 100%;
    width: 100%;
    font-size: 12px;
    font-family: 'Open Sans', Verdana, Geneva, Tahoma, sans-serif;
    margin: 0;
    overflow: hidden;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.text-container {
    margin: 16px 0;
}

span {
    margin: 0 0 8px;
}

textarea {
    margin-bottom: 16px;
}

img {
    margin: 0;
}

.sidebarwrapper {
    width: 400px;
    height: 100vh;
    position: absolute;
    left: 0;
    top: 0;
    padding: 16px;
    z-index: 1000;
    display: flex;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-align-items: center;
    align-items: flex-start;
    -webkit-justify-content: center;
    justify-content: center;
}

    .sidebarwrapper.fullscreen {
        width: 100%;
    }

.sidebar-interactive-content {
    vertical-align: middle;
    display: block;
    /*top: 35%;*/
    position: relative;
    margin: auto;
    max-width: 400px;
    width: 100%;
}

    .sidebar-interactive-content .center-content {
    }

.title-text {
    font-size: 24px;
}

button:not(.close), .mx-btn {
    width: 100%;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    margin-bottom: 15px;
    padding: 6px 26px;
    -moz-border-radius: 24px !important;
    -webkit-border-radius: 24px !important;
    border-radius: 24px !important;
    line-height: 1.5;
    cursor: pointer;
}

button.toolbar-button {
    max-width: 64px;
    display: flex;
    margin: 0 auto;
    justify-content: center;
    align-content: center;
}

button.menu-button {
    /*max-width: 64px;*/
    display: flex;
    margin: 0 auto;
    justify-content: center;
    align-content: center;
    padding: 6px 8px;
}

.button-container {
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}

.button-group[help-menu-buttons] {
    position: absolute;
    right: 0;
    margin-right: 12px;
}

.button-group {
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    margin-right: 12px;
}

    .button-group.floor-aligned {
        -webkit-align-items: flex-end;
        align-items: flex-end;
        padding: 0 6px;
    }

    .button-group div {
        margin: 0 4px;
    }

        .button-group div:first-child {
            margin-left: 0px;
        }

        .button-group div:last-child {
            margin-right: 0px;
        }

.user-notification-container {
    width: 100%;
    padding: 16px;
}

    .user-notification-container span {
        /*font-weight: bold;*/
    }

input[type="text"],
input[type="password"] {
    background-color: rgba(36, 36, 39, 1);
    background-image: none;
    border-top: none;
    border-left: none;
    border-right: none;
    border-radius: 1px;
    color: inherit;
    display: block;
    padding: 6px 12px;
    margin-bottom: 16px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    width: 100%;
    outline: none;
}

.link-container-center {
    text-align: center;
    padding: 8px 0;
}

.multipleItems-row {
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -webkit-align-items: center;
    align-items: center;
}

    .multipleItems-row > div {
        margin: 0 8px;
    }

        .multipleItems-row > div:first-child {
            margin-left: 0;
            margin-right: 8px;
        }

        .multipleItems-row > div:last-child {
            margin-left: 8px;
            margin-right: 0;
        }

.user-control {
    width: 100%;
}

    .user-control.short {
        width: 160px;
    }

.timer-container {
}

.svg-btn-icon {
    width: 20px;
    height: 20px;
    margin: 0;
}

.sidebar-Menu {
    position: absolute;
    display: block;
    left: 100%;
    top: 0;
    width: 400px;
    height: 100vh;
    background-color: #FFF;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    padding: 0;
    z-index: 1000;
    -moz-transition: left 0.6s, display 1s;
    -o-transition: left 0.6s, display 1s;
    -webkit-transition: left 0.6s, display 1s;
    transition: left 0.6s, display 1s;
    overflow-y: auto;
}

    .sidebar-Menu[open] {
        left: calc(100% - 400px);
    }

@media only screen and (max-width: 600px) {
    .sidebar-Menu {
        width: 100%;
    }

        .sidebar-Menu[open] {
            left: 0px;
        }
}


.call-img-centre {
    width: 512px;
    height: 100%;
    max-height: 512px;
}

.mx-row {
    margin: 8px 0;
    display: flex;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-justify-content: center;
    justify-content: center;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
}

    .mx-row.flow {
        -ms-flex-direction: row;
        -webkit-flex-direction: row;
        flex-direction: row;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        -webkit-align-items: center;
        align-items: center;
    }

    .mx-row.split {
        margin: 16px 0;
        -webkit-justify-content: space-between;
        justify-content: space-between;
        -ms-flex-direction: row;
        -webkit-flex-direction: row;
        flex-direction: row;
        -webkit-align-items: center;
        align-items: center;
    }

    .mx-row:first-child {
        margin: 0 0 16px 0;
    }

.mx-form-control {
    width: 100%;
    resize: none;
}

.mx-infohelp-container {
    display: flex;
    -webkit-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-align-items: center;
    align-items: center;
    /*   -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;*/
    max-width: 160px;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    margin: 6px 0;
}

    .mx-infohelp-container.top-column {
        -ms-flex-direction: column;
        -webkit-flex-direction: column;
        flex-direction: column;
    }

.mx-helpbar-v {
    height: 30px;
    width: 1px;
    background-color: #FFF;
    margin-left: 0px;
}

    .mx-helpbar-v.extended-4 {
        height: 210px;
        width: 1px;
        background-color: #FFF;
        margin-left: 52px;
    }

    .mx-helpbar-v.extended-3 {
        height: 135px;
        width: 1px;
        background-color: #FFF;
        margin-left: 72px;
    }

    .mx-helpbar-v.extended-2 {
        height: 50px;
        width: 1px;
        background-color: #FFF;
        margin-left: 72px;
    }

    .mx-helpbar-v.extended-1 {
        height: 20px;
        width: 1px;
        background-color: #FFF;
        margin-left: 68px;
    }


.circle {
    width: 32px;
    height: 32px;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    padding: 12px;
    box-sizing: border-box;
    margin-right: 12px;
}

.draw-circle {
    width: 26px;
    height: 26px;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    box-sizing: border-box;
    margin: 16px 0;
    cursor: pointer;
}

    .draw-circle .draw-innerCircle {
        display: none;
    }

    .draw-circle[selected] .draw-innerCircle {
        width: 10px;
        height: 10px;
        display: block;
        -moz-border-radius: 12px;
        -webkit-border-radius: 12px;
        border-radius: 12px;
    }

.footer-centered {
    position: relative;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    margin: 0 auto;
    z-index: -1;
    width: 100%;
}

.drawing-shapes-bar {
    width: 100%;
    height: 100%;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
    /*padding: 2px 0;*/
    margin: 8px 0px;
    -moz-border-radius: 24px !important;
    -webkit-border-radius: 24px !important;
    border-radius: 24px !important;
    line-height: 1.5;
}

    .drawing-shapes-bar.v-bar {
        -ms-flex-direction: column;
        -webkit-flex-direction: column;
        flex-direction: column;
        -webkit-align-items: flex-end;
        align-items: flex-end;
        background-color: transparent;
        width: auto;
        height: 100%;
        position: absolute;
        right: 0;
        z-index: 1002;
        margin: 0 12px;
    }

.svg-toolbarbtn-icon {
    width: 20px;
    height: 20px;
}

.v-bar-container {
    display: flex;
    -webkit-align-items: flex-end;
    align-items: flex-end;
    position: absolute;
    left: 0;
    bottom: -10px;
}

.txtInput_container {
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.25);
    position: absolute;
    z-index: 1000;
}

.drw_textInput {
    background-color: #0aa9dc40 !important;
    border: 2px solid #0AA9DC !important;
    -moz-border-radius: 8px !important;
    -webkit-border-radius: 8px !important;
    border-radius: 8px !important;
    padding: 6px !important;
    color: #1EBDF0 !important;
}

.top-center-buttons {
    margin-top: 64px;
}

.fixed-text-container {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    -moz-user-select: none;
}

.toolbar-button-container {
    margin: 0 auto;
}

.messageAttachmentRow {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    text-overflow: ellipsis;
    overflow: hidden;
}

.tcs-container {
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
}

.tcs-text-container {
    text-align: left;
}

.button-actionbar {
    display: flex;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
    -webkit-align-items: center;
    align-items: center;
    padding: 12px;
    border-bottom: 1px solid RGB(246, 246, 246);
}

.action-button {
    border: 1px solid rgb(44, 33, 55);
    -moz-border-radius: 50% 50%;
    -webkit-border-radius: 50% 50%;
    border-radius: 50% 50%;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    padding: 4px;
    cursor: pointer;
}

.tabs-menutoolbar {
    padding: 8px 12px;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
}

.actionbar-titlebar {
    padding: 8px 4px;
}

.info-action-bar {
    margin: 16px 0;
}

.tab-button {
}

    .tab-button button[on] {
        background-color: #0AA9DC;
        color: #FFF;
    }

        .tab-button button[on]:focus,
        .tab-button button[on]:active,
        .tab-button button[on]:hover {
            background-color: #0AA9DC;
            color: #FFF;
        }

    .tab-button button img:first-child {
        margin: 0 4px 0 0;
    }

.notes-container {
    padding: 16px 0;
}