/*********************/
/**   Font Icons    **/
/*********************/

@font-face {
    font-family: 'callcompleteIcons';
    src: url('fonts/callcompleteIcons.eot?3xfnjc');
    src: url('fonts/callcompleteIcons.eot?3xfnjc#iefix') format('embedded-opentype'), url('fonts/callcompleteIcons.ttf?3xfnjc') format('truetype'), url('fonts/callcompleteIcons.woff?3xfnjc') format('woff'), url('fonts/callcompleteIcons.svg?3xfnjc#callcompleteIcons') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: proxima-nova;
    src: url('fonts/proximanova-light-webfont.ttf') format("truetype");
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: proxima-nova;
    src: url('fonts/proximanova-regular-webfont.ttf') format("truetype");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: proxima-nova;
    src: url('fonts/proximanova-semibold-webfont.ttf') format("truetype");
    font-weight: 600;
    font-style: normal
}

@font-face {
    font-family: proxima-nova;
    src: url('fonts/proximanova-bold-webfont.ttf') format("truetype");
    font-weight: 700;
    font-style: normal
}


.pulsating-text {
    animation-fill-mode: both;
    animation-iteration-count: 3;
    animation-name: pulsating-text;
    animation-duration: 1s;
}

@keyframes pulsating-text {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.3);
    }

    100% {
        transform: scale(1);
    }
}



/*.icon*/
[class^="icon"], [class*=" icon"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'callcompleteIcons' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.iconCallCompleteLogo:before {
    content: "\e900";
}

.iconBolt:before {
    content: "\e901";
}

.iconBoltOutline:before {
    content: "\e902";
}

.iconMore:before {
    content: "\e903";
}

.iconMoreOutline:before {
    content: "\e904";
}

.iconNoPhoto:before {
    content: "\e905";
}

.iconPhone:before {
    content: "\e906";
}

.iconWarning:before {
    content: "\e907";
}

.iconPlay:before {
    content: "\e909";
}

.iconPause:before {
    content: "\e908";
}

.iconStop:before {
    content: "\e90a";
}

.iconClose:before {
    content: "\e90b";
}

.iconEmail:before {
    content: "\e90c";
}

.iconCamera:before {
    content: "\e90d";
}

.iconCheckMark:before {
    content: "\e90e";
}

.iconSMS:before {
    content: "\e90f";
}

.iconListen:before {
    content: "\e910";
}

.iconAudioCreate:before {
    content: "\e915";
}

.iconAudioUpload:before {
    content: "\e916";
}

.iconArrowLeft:before {
    content: "\e911";
}

.iconArrowRight:before {
    content: "\e912";
}

.iconChevronLeft:before {
    content: "\e913";
}

.iconChevronRight:before {
    content: "\e914";
}

.iconInfo:before {
    content: "\e917";
}


/***************************************
***************************************
    SPINNER
***************************************
***************************************/

@-webkit-keyframes spinnerRotate {
    from {
        -webkit-transform: rotate(0deg)
    }

    to {
        -webkit-transform: rotate(360deg)
    }
}

@-moz-keyframes spinnerRotate {
    from {
        -moz-transform: rotate(0deg)
    }

    to {
        -moz-transform: rotate(360deg)
    }
}

@-ms-keyframes spinnerRotate {
    from {
        -ms-transform: rotate(0deg)
    }

    to {
        -ms-transform: rotate(360deg)
    }
}

.processing-spinner {
    font-size: 32px;
    font-size: 2rem;
    color: #1e90ff;
    position: absolute;
    top: 50%;
    left: 50%;
    display: inline-block;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    -webkit-animation-name: spinnerRotate;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: spinnerRotate;
    -moz-animation-duration: 0.5s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: spinnerRotate;
    -ms-animation-duration: 0.5s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
}

.processing-overlay {
    width: 100%;
    height: 100%;
    background-color: #fff;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    display: flex;
    align-items: center;
    opacity: 50%;
}

.processing-spinner {
    display: none;
    border: 0.25rem solid #ddd;
    border-radius: 100%;
    background: transparent;
    width: 2rem;
    height: 2rem;
    border-top-color: #00ca67;
    font-size: initial;
    top: 14%;
    left: 45%
}

.processing-overlay .processing-spinner {
    top: auto;
}

.processing-spinner-wrapper {
    position: relative;
    display: inline;
    margin: 0.8rem;
    top: -0.8rem;
}

    .processing-spinner-wrapper .processing-spinner {
        display: block;
    }

#msg-01,
#msg-02 {
    visibility: hidden;
    opacity: 0.0;
    transition: all 0.5s ease-in-out;
}

#msg-01.active,
#msg-02.active {
    visibility: visible;
    opacity: 1;
}

#msg-02 {
    position: absolute;
}

#msg-02 .title {
    display: inline;
}


/***************************/
/**   Site-Wide Styles    **/
/***************************/

/*Global overrides*/
html, body {
    font-family: proxima-nova, Proxima Nova,Lucida Grande,Segoe UI,Segoe,Lucida Sans,Lucida Sans Unicode,Verdana,sans-serif !important;
    width: 100% !important;
    height: 100% !important;
    overflow-x: hidden;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#feffff+67,f7f7f7+100 */
    background: #feffff; /* Old browsers */
    background: -moz-linear-gradient(top, #feffff 67%, #f7f7f7 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #feffff 67%,#f7f7f7 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #feffff 67%,#f7f7f7 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feffff', endColorstr='#f7f7f7',GradientType=0 ); /* IE6-9 */
}

@media screen and (min-width: 768px) {
    html, body {
        font-size: 13px;
    }
}

@media screen and (min-width: 1920px) {
    html, body {
        font-size: 14px;
    }
}

@media screen and (min-width: 2560px) {
    html, body {
        font-size: 16px

    }
}


a {
    color: #00ca67;
    text-decoration: none;
}
    a:hover,
    a:active,
    a:visited,
    a:focus {
        color: hsl(151, 100%, 36%) !important;
        text-decoration: none;
        outline: none !important;
        cursor: pointer !important
    }
a.disabled {
    color: #CCC;
    cursor: default;
}

.disabled {
    color: #CCC;
}


.disabled:hover {
    color: #CCC;
}
.spacer {
    padding: 0 10px;
}
.container {
    width: 100% !important;
}
.row {
    margin-right: 0px !important;
    margin-left: 0px !important;
    position: relative;
}

hr {
    margin-top: 1rem;
    margin-bottom: 1rem;
    border: 0;
    height: 1px;
    background-color: #ddd;
}


h1 {
    line-height: normal;
    font-size: 1.875rem;
    font-weight: 600;
    margin: 0;
}

.row-sticky-header {
    padding: 3.125rem 0 0 !important;
    position: fixed;
    top: 8.125rem;
    background: rgba(255,255,255,.9);
    box-shadow: 0px 8px 10px rgba(255,255,255,.9);
    width: 71.66%;
    z-index: 1;
    display: block;
    min-height: 7.25rem;
}


    .row-sticky-header h1,
    .row-sticky-header h2 {
        margin: 0;
    }


/***********************
        Header
***********************/
    header {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0px !important;
    position: fixed;
    z-index: 10;
}

    header .row {
        position: relative;
        max-width: 100% !important;
        width: 100% !important;
        height: 8.333rem;
        background-color: #fff;
        border-bottom: 1px solid #eee;
        box-shadow: 0px -10px 25px rgba(0,0,0,0.25)
    }

.logo {
    width: 16.667rem;
    height: auto;
    position: absolute;
    top: 2rem;
    left: 2rem;
    fill: #555;
}

.logo img{
    width: 217px;
}


#content {
    max-width: 100% !important;
    width: 100% !important;
    padding: 1.25rem 2.5rem 2.5rem;
    margin-top: 10rem;/*120px*/
}

    #content > .container {
        padding: 0;
    }


.right {
    float: right;
}
.nav-user {
    position: absolute;
    right: 2rem;
    height: 100%;
    width: 33.333%;
}

    .nav-user .navbar-nav {
        position: absolute;
        right: 0;
        bottom: 0.13rem;
    }
    .nav-user .contact-header {
        margin-top: 2rem;
        font-size: 0.875rem;
        text-align: right;
        white-space: nowrap;
    }

    .nav-user .navbar-nav > li > a {
        font-size: 1rem;
        border-bottom: 1px solid #fff;
    }

    .apartment-dropdown {
        min-width: 177px;
    }

    .nav-user .navbar-nav > li.nav-communities > a {
        margin-right: 0;
    }

    .nav-user .navbar-nav li.open > a {
        z-index: 1001;
        border-bottom: 1px solid #ddd !important;
        background-color: #fff !important;
        border-top: solid 1px #ddd !important;
        margin-top: 1px;
        margin-left: 15px !important;
        margin-right: 25px !important;
    }

    .nav-user .navbar-nav li.open > a .caret {
        transform: rotateZ(180deg);
    }

    .nav-user .contact-header span {
        font-weight: bold;
    }

    .nav-user .navbar-nav .dropdown-menu {
        left: initial !important;
        right: 0 !important;
    }

    .bold {
        font-weight: bold
    }

/***********************
        Footer
***********************/
#signin {}

footer {
    max-width: 100%;
    width: 100%;
    padding: 0 2rem;
    position: fixed;
    z-index: 1;
    bottom: 0;
    background-color: #f9f9f9;
    height: 2.5rem;
    line-height: 2.5rem;
    font-size: 0.875rem;
    color: #555;
    border-top: 1px solid #eee;
    box-shadow: 0px 10px 25px rgba(0,0,0,0.25)

}

    footer a {
        /*float: right;*/
        color: #555 !important;
        text-decoration: underline
    }

    footer a:visited {
        color: #555 !important;
        text-decoration: underline
    }

    footer a:hover {
        color: #555 !important;
        text-decoration: none !important
    }

    footer .legal {
        float: none;
        text-decoration: underline;
    }

.happyco-footer {
    position: fixed;
    bottom: 40px;
    width: 100%;
    text-align: center;
}

.happyco-footer a,
.happyco-footer a:visited,
.happyco-footer a:active {
        color: #555 !important;
    font-weight: bold;
    text-decoration: underline;
}
/***********************
        Sign In
***********************/
body#signin header {
    position: relative;
}


.signin-wrapper,
.signin-wrapper-mobile {
    max-width: 350px;
    margin: 0 auto;
    padding: 5rem 0;
}


.signin-wrapper {
    display: none;
}

@media (min-width: 768px) {
    body#signin header .row {
        height: 6.333rem;
    }

    .signin-wrapper {
        display: block;
    }

    .signin-wrapper-mobile {
        display: none;
    }
}

.signin-wrapper .title,
.signin-wrapper-mobile .title {
    line-height: normal;
    font-size: 1.75rem;
    font-weight: 600;
    margin: 0 0 2rem;
}

.signin-wrapper .subtitle,
.signin-wrapper-mobile .subtitle{
    margin: -1rem 0 2rem;
    color: #555;
}

.signin-wrapper .exception-txt-wrapper,
.signin-wrapper-mobile .exception-txt-wrapper {
    margin-bottom: 2rem;
}

.signin-wrapper label,
.signin-wrapper-mobile label {
    display: block;
    float: left;
    padding-right: 10px;
    white-space: nowrap;
}

.signin-wrapper input[type="checkbox"] {
    margin-right: 0.5rem;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none;
}

.signin-wrapper label span,
.signin-wrapper-mobile label span {
    vertical-align: middle;
}


.signin-legal,
.signin-legal{
    color: #555 !important;
}

/***********************************************
    Settings Profile - Chnage your password
************************************************/

body[data-state="settings-profile"] .signin-wrapper {
    margin: 0 auto;
    padding: 2rem 0rem;
    max-width: initial;
}

label[for=ckbNoEmail] {
    color: #00ca79;
}

/***********************************************
    Header
************************************************/
header > .navbar-nav {
    width: 100%;
    margin-left: -2rem;
}

header .navbar-collapse {
    border: none;
    padding: 0;
    float: left;
    margin: 0;
    bottom: -0.538rem;
    position: relative;
}

.navbar-nav li a {
    padding-top: 15px;
    padding-bottom: 5px !important;
    color: #333 !important;
}
.navbar-default {
    border: 0px !important;
    margin-bottom: 0px !important;
    background-color: transparent;
    position: absolute;
    bottom: 0rem;
    left: 0rem;
    width: 100%;
    text-align: center
}

.navbar-default .navbar-collapse {
    border: none;
    padding: 0
}

.navbar-nav > li {
    float: left;

}

.navbar-default .navbar-nav > li > a {
    font-size: 1rem;
    letter-spacing: 0.05rem;
    white-space: nowrap;
    margin: 0 1.895rem

}

    .navbar-default .navbar-nav > li > a:first-child {
        margin-left: 2rem;
    }

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:focus,
.navbar-default .navbar-nav > .open > a:hover {
    z-index: 2000;
    border-bottom: 1px solid #ddd !important
}

.navbar-default .navbar-nav > .open > a .caret,
.navbar-default .navbar-nav > .open > a:hover .caret {
    transform: rotateZ(180deg)
}

.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > li > a:hover {
    color: #000;
    background-color: transparent;
    border-bottom: solid #eee;
}

body[data-state="schedule"] .navbar-default .navbar-nav > li:nth-child(1) > a,
body[data-state="activities"] .navbar-default .navbar-nav > li:nth-child(2) > a,
body[data-state="resident-alert"] .navbar-default .navbar-nav > li:nth-child(3) > a,
body[data-state="resident-contact-list"] .navbar-default .navbar-nav > li:nth-child(3) > a,
body[data-state="community-broadcast"] .navbar-default .navbar-nav > li:nth-child(3) > a,
body[data-state="corporate-contact-list"] .navbar-default .navbar-nav > li:nth-child(2) > a,
body[data-state="corporate-broadcast"] .navbar-default .navbar-nav > li:nth-child(1) > a,
body[data-state="settings-team"] .navbar-default .navbar-nav > li:nth-child(4) > a,
body[data-state="settings-communities"] .navbar-default .navbar-nav > li:nth-child(4) > a,
body[data-state="settings-profile"] .navbar-default .navbar-nav > li:nth-child(4) > a,
body[data-state="schedule"] .navbar-default .navbar-nav > li:nth-child(1) > a:focus,
body[data-state="activities"] .navbar-default .navbar-nav > li:nth-child(2) > a:focus,
body[data-state="resident-alert"] .navbar-default .navbar-nav > li:nth-child(3) > a:focus,
body[data-state="settings-team"] .navbar-default .navbar-nav > li:nth-child(4) > a:focus,
body[data-state="settings-communities"] .navbar-default .navbar-nav > li:nth-child(4) > a:focus,
body[data-state="settings-profile"] .navbar-default .navbar-nav > li:nth-child(4) > a:focus,
body[data-state="call-forwarding"] .navbar-default .navbar-nav > li:nth-child(4) > a:focus,
body[data-state="schedule"] .navbar-default .navbar-nav > li:nth-child(1) > a:hover,
body[data-state="activities"] .navbar-default .navbar-nav > li:nth-child(2) > a:hover,
body[data-state="resident-alert"] .navbar-default .navbar-nav > li:nth-child(3) > a:hover,
body[data-state="resident-contact-list"] .navbar-default .navbar-nav > li:nth-child(3) > a:hover,
body[data-state="community-broadcast"] .navbar-default .navbar-nav > li:nth-child(3) > a:hover,
body[data-state="corporate-contact-list"] .navbar-default .navbar-nav > li:nth-child(2) > a:hover,
body[data-state="corporate-broadcast"] .navbar-default .navbar-nav > li:nth-child(2) > a:hover,
body[data-state="settings-team"] .navbar-default .navbar-nav > li:nth-child(4) > a:hover,
body[data-state="settings-communities"] .navbar-default .navbar-nav > li:nth-child(4) > a:hover,
body[data-state="settings-profile"] .navbar-default .navbar-nav > li:nth-child(4) > a:hover,
body[data-state="call-forwarding"] .navbar-default .navbar-nav > li:nth-child(4) > a:hover {
    color: #000;
    background-color: transparent;
    border-bottom: solid #00ca67
}

.search {
    width: 400px;
}
.input-group-addon {
    padding: 0px !important;
}
.dropdown-menu > li > a:focus,
.dropdown-menu > li > a:hover {
    color: #00ca67 !important;
    text-decoration: none;
    background-color: transparent !important;
}
.dropdown-menu {
    color: #555 !important;
    border-radius: 3px !important;
    padding: 10px;
}
.table > thead > tr > th {
    border-bottom: 0px solid #ddd !important;
}
/*hr.dropdown-hr {
    margin: 5px 15px !important;
}*/
.nav .open > a, .nav .open > a:focus, .nav .open > a:hover {
    background-color: transparent !important;
    border-color: transparent !important;
}
.nav > li > a:focus, .nav > li > a:hover {
    text-decoration: none;
    background-color: transparent !important;
}
.navbar-default .dropdown-menu {
    top: 1px !important;
    left: -11px !important;
    min-width: initial !important;
    border-radius: 3px !important;
}
.navbar-nav .dropdown-menu {
    top: 1px !important;
    left: 4px !important;
    min-width: 100% !important;
    border-radius: 3px !important;
    padding-top: 3.25rem;
}
.nav > li > a {
    padding-left: 0px !important;
    padding-right: 0px !important;
    margin-left: 15px;
    margin-right: 25px;
    white-space: nowrap;
}
.dropdown-menu > li > a {
    padding: 10px 1rem 0rem !important;
    font-size: 1rem;
}
/*.dropdown-align {
    padding-left: 15px;
    font-size: 12px;
    margin-top: 4px;
    margin-bottom: 10px;
    color: #000;
    opacity: 0;

}*/
.caret {
    margin-left: 10px !important;
}
.col-md-3{
    width: 20% !important;
}
.col-md-9 {
    width: 80% !important;
}

.page-description {
    line-height: 2.5rem;
    border-radius: 0.5rem;
    font-size: 1.125rem;
    color: #555;
    margin-bottom: 1rem;
}


/********************
 Broadcast
*********************/

#btnPlayAudio {
    position: absolute;
    top: -.5rem;
    z-index: 1;
}

#btnPlayAudio_Text {
    font-weight: 700;
    color: #00ca67;
    position: absolute;
    top: 13px;
}

/*.corporate-broadcast #broadcast-add-modal .modal-dialog {
    max-width: 1280px;
}*/

#broadcast-add-modal #btnPrevStep,
#broadcast-add-modal #btnNextStep {
    font-size: 1.125rem;
    padding: .5rem 1rem;
}

    #broadcast-add-modal #btnPrevStep:disabled,
    #broadcast-add-modal #btnNextStep:disabled {
    text-decoration: line-through;
    color: #555 !important;
    }

#broadcast-add-modal #btnPrevStep {
    margin-left: -1rem;
    float: left;
}

#broadcast-add-modal #btnNextStep {
    margin-right: -1rem;
    color: #fff !important;
    background-color: #00ca67 !important;
}


#broadcast-add-modal-steps {
padding-right: 0;
}

    #broadcast-add-modal #btnPrevStep i {
    margin-right: 0.25rem;
    font-size: 0.75rem;
    }

    #broadcast-add-modal #btnNextStep i {
    margin-left: 0.25rem;
    font-size: 0.75rem;
    }

#broadcast-add-modal-steps .step {
    display: none;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    visibility: hidden;
    will-change: opacity;
    opacity: 0;
    -webkit-opacity: 0;
    transition: opacity ease-in-out 5000ms;
    height: 0;
    overflow: hidden;
    padding: 2rem 0rem;
}

        #broadcast-add-modal-steps .step.is-visible {
        visibility: visible;
        opacity: 1.0;
        -webkit-opacity: 1.0;
        height: auto;
        overflow: visible;
        }

            #broadcast-add-modal-steps #step-create.is-visible {
            display: flex;
            flex-flow: column;
            min-height: 13.25rem;
            justify-content: center;
            padding-bottom: 2rem;
            }

            #broadcast-add-modal-steps .step.is-visible {
            padding: 0 1rem;
            }

            #broadcast-add-modal-steps .date-control {
            width: 100%;
            }

            #broadcast-add-modal-steps #step-recipients.is-visible {
            min-height: 9.077em;
            padding: 1rem;
            }

            #broadcast-add-modal-steps .step:not(#step-create).is-visible {
            display: block;
            }

        #broadcast-add-modal-steps #step-create .description {
        justify-content: center;
        align-items: center;
        margin-bottom: 2rem;
        color: #555;
        display: none;
        }

#broadcast-add-modal-steps #step-create .ctas {
justify-content: center;
align-items: center;
flex-basis: 60%;
}

#broadcast-add-modal-steps #step-create #step-create-options {
display: flex;
justify-content: center;
align-items: center;
margin: 2rem auto 3rem !important;
}

#broadcast-add-modal-steps .iconAudioCreate,
#broadcast-add-modal-steps .iconAudioUpload {
cursor: pointer;
border-radius: 100%;
height: 5rem;
width: 5rem;
display: flex;
justify-content: center;
align-items: center;
margin: 1rem auto;
font-size: 2rem;
color: #555;
background-color: #f9f9f9;
border: 4px solid #fff;
box-shadow: 0px 2px 0px #f2f2f2;
}

#broadcast-add-modal-steps #step-create-options .col-md-5 {
    border: solid 1px #ECEEEF;
    padding: 24px;
}

    #broadcast-add-modal-steps #step-create-options .col-md-5:hover {
    background-color: #ECEEEF;
    cursor: pointer;
    }

#broadcast-add-modal-steps #callInRecording-box-01 {
    margin: 0 auto .25rem;
    padding: 1rem 1.125rem;
    text-align: center;
    width: 90%;
    border-radius: 3px;
    line-height: 1.5rem;
    border: 1px solid #00ca67;
}


#broadcast-add-modal-steps #callInRecording-box-02 {
    margin: 2rem auto;
    padding: 1.5rem;
    text-align: center;
    border-radius: 3px;
    line-height: 1.5rem;
    border: 1px solid #00ca67;
    display: flex;
    flex-flow: column;
}

#broadcast-add-modal-steps #callInRecording-box-01 p {
    font-size: 1.5rem;
    line-height: normal;
}

#broadcast-add-modal-steps #callInRecording-box-02 p {
    margin: 0rem 0 1.25rem;
    font-weight: 600;
}

#broadcast-add-modal-steps .callInRecording-box #btnPlayAudio {
}

#btnCreateAudio:after,
#btnUploadAudio:after {
    position: absolute;
    display: block;
    color: #000;
    font-size: 0.75rem;
    top: 2.5rem;
    left: 50%;
    transform: translateX(-50%);
}

.create-options-heading {
    font-weight: 600;
}

#broadcast-add-modal .modal-header,
#broadcast-history-modal .modal-header {
    background-color: #fff;
    padding-bottom: 0;
}
#broadcast-history-modal .modal-body {
    padding-bottom: 10px;
}

.broadcast-history-recipients .list-item > div {
    box-shadow: inset 0px -1px 0px #D9DDE0;
    margin-bottom: 8px;
    padding: 10px 0 10px 0px !important;
}

.listenToAudio,
.btn-preview {
    cursor: pointer;
}

.create-options-icon,
.create-options-desc {
    height: 55px;
}

#broadcast-add-modal-steps .checkbox-default-group {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    height: 3rem;
}

        #broadcast-add-modal-steps .checkbox-default-group > label {
            margin-right: 1rem;
        }

#step-create-audio-1 .row {
    line-height: 1rem;
}

#broadcast-add-modal-steps #step-create-audio-1 #message {
    text-indent: 0;
    padding: 0.875rem;
    line-height: normal !important;
    height: auto !important;
}

        #broadcast-add-modal-steps #step-create-audio-1 #message:focus {
        /*white-space: wrap;
        text-overflow: none;
        overflow: visible;
        padding-top: inherit;*/
        }

        #broadcast-add-modal-steps #step-create-audio-1 #message:not(:focus) {
            /*text-indent: 0rem;
            padding: 0rem 0.875rem;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
            padding-top: 0.875rem;*/
        }

        #broadcast-add-modal-steps .ctas .btn {
            position: relative;
            color: #fff !important;
            background-color: #00ca79 !important;
        }

    #broadcast-add-modal-steps .checkbox-default-group label {
        display: block;
        font-weight: normal;
        color: #555;
        user-select: none;
        cursor: pointer;
        text-indent: unset;
        line-height: 1.5rem;
    }


    /** Broadcast Datepicker Calendar **/
    body[data-state="community-broadcast"] .datetimepicker.dropdown-menu .table-condensed > tbody > tr > td,
    body[data-state="community-broadcast"] .datetimepicker.dropdown-menu .table-condensed > tbody > tr > th,
    body[data-state="community-broadcast"] .datetimepicker.dropdown-menu .table-condensed > tfoot > tr > td,
    body[data-state="community-broadcast"] .datetimepicker.dropdown-menu .table-condensed > tfoot > tr > th,
    body[data-state="community-broadcast"] .datetimepicker.dropdown-menu .table-condensed > thead > tr > td,
    body[data-state="community-broadcast"] .datetimepicker.dropdown-menu .table-condensed > thead > tr > th {
        padding: 0.675rem 1rem;
        text-align: center;
        font-size: 1.5rem;
        position: relative;
    }

    body[data-state="community-broadcast"] .datetimepicker.dropdown-menu .table-condensed .glyphicon {
        width: 2.5rem;
        height: 2.5rem;
        display: flex;
        justify-content: center;
        align-items: center;
        top: 0rem !important;
        left: 0rem;
        cursor: pointer;
        position: absolute;
    }



/*** Resident Contact Styles
**************************************/
body[data-state='community-broadcast'] form.csvFileUpload,
body[data-state='corporate-broadcast'] form.csvFileUpload,
body[data-state='resident-contact-list'] form.csvFileUpload,
body[data-state='corporate-contact-list'] form.csvFileUpload {
    padding: 1rem 0rem;
    display: flex;
}

body[data-state='community-broadcast'] .csvFileUpload .fileupload-buttonbar,
body[data-state='corporate-broadcast'] .csvFileUpload .fileupload-buttonbar,
body[data-state='resident-contact-list'] .csvFileUpload .fileupload-buttonbar,
body[data-state='corporate-contact-list'] .csvFileUpload .fileupload-buttonbar {
    margin: 0rem !important;
    flex-basis: 100%;
}

body[data-state='community-broadcast'] #btn-resident-upload,
body[data-state='corporate-broadcast'] #btn-resident-upload,
body[data-state='resident-contact-list'] #btn-resident-upload,
body[data-state='corporate-contact-list'] #btn-resident-upload {
    /*margin-left: -1rem;*/
}

body[data-state='community-broadcast'] .csvFileUpload .progress-extended,
body[data-state='community-broadcast'] .csvFileUpload table[role=presentation],
body[data-state='corporate-broadcast'] .csvFileUpload .progress-extended,
body[data-state='corporate-broadcast'] .csvFileUpload table[role=presentation],
body[data-state='resident-contact-list'] .csvFileUpload table[role=presentation],
body[data-state='resident-contact-list'] .csvFileUpload table[role=presentation],
body[data-state='corporate-contact-list'] .csvFileUpload .progress-extended,
body[data-state='corporate-contact-list'] .csvFileUpload table[role=presentation] {
    display: none;
}


body[data-state='community-broadcast'] .options,
body[data-state='corporate-broadcast'] .options {
    line-height: 3rem;
}

body[data-state='community-broadcast'] #bulk-actions input,
body[data-state='corporate-broadcast'] #bulk-actions input {
    margin-right: 0.75rem;
}

body[data-state='community-broadcast'] #bulk-actions label,
body[data-state='corporate-broadcast'] #bulk-actions label {
    font-weight: normal;
}


body[data-state='resident-contact-list'] .options,
body[data-state='corporate-contact-list'] .options {
    padding: 0.425rem 1.125rem 1.25rem !important;
}

body[data-state='community-broadcast'] #bulk-actions input[type=checkbox],
body[data-state='corporate-broadcast'] #bulk-actions input[type=checkbox],
body[data-state='resident-contact-list'] #bulk-actions input[type=checkbox],
body[data-state='corporate-contact-list'] #bulk-actions input[type=checkbox] {
    /*margin-right: 1.125rem;*/
}

body[data-state='community-broadcast'] #bulk-actions .step-or,
body[data-state='corporate-broadcast'] #bulk-actions .step-or,
body[data-state='resident-contact-list'] #bulk-actions .step-or,
body[data-state='corporate-contact-list'] #bulk-actions .step-or {
    padding: 0 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
}

#resident-alert {
    width: 800px;
    float: unset;
    margin: auto;
}

#resident-alert .page-description {
    line-height: unset !important;
}


#resident-alert .tooltip-description {
    width: 188px;
}

#resident-alert .switch-control {
    float: right;
    margin-right: 24px;
    margin-top: 5px;
}

.resident-alert-enable .slider:after,
.resident-alert-enable input:checked + .slider:after,
.community-broadcast-delivery-method .slider:after,
.community-broadcast-delivery-method input:checked + .slider:after {
    content: "";
}

.resident-alert-enable .tooltip-wrapper {
    margin-left: 3px;
}

.resident-alert {
    margin-bottom: 0 !important;
}


#resident-alert .tooltip-wrapper {
}

.resident-alert-label {
    font-weight: bold;
}

.resident-alert-message-header {
    text-indent: unset !important;
}

.resident-alert-message-header img {
    /*vertical-align: unset !important;*/
    margin-bottom: 7px;
}

#resident-alert .tooltip-legend {
    -webkit-transform: translateX(-52%);
    transform: translateX(-52%);
}

.resident-alert-message textarea{
    height: 96px !important;
}

.resident-alert-message textarea,
#broadcast-add-modal textarea,
#broadcast-add-modal input {
    background-color: #f5f5f5;
    border: unset !important;
    border-radius: 4px;
}

.resident-alert-enable,
.community-broadcast-delivery-method {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    background-color: #f5f5f5;
    border-radius: 4px;
}

.community-broadcast-delivery-method {
    margin-bottom: 10px;
}

#broadcast-history-modal .header,
#step-create-audio-1 .header,
#step-upload-audio-1 .header,
#step-schedule .header,
#step-recipients .header {
    margin-left: 16px !important;
    font-weight: 600;
    font-size: 20px;
}

#broadcast-history-modal .header img,
#step-create-audio-1 .header img,
#step-upload-audio-1 .header img,
#step-schedule .header img,
#step-recipients .header img{
    margin-right: 10px;
}

#broadcast-history-modal .steps,
#step-create-audio-1 .steps,
#step-upload-audio-1 .steps,
#step-schedule .steps,
#step-recipients .steps {
    margin-left: 16px !important;
    line-height: 1.5rem;
}

#step-schedule input{
    background-color: unset !important;
}

.step-active {
    padding-top: 1px;
    display: inline-block;
    text-align: center;
    width: 20px;
    height: 20px;
    border-radius: 20px;
    background-color: #000;
    color: #fff;
}

.step-inactive {
    display: inline-block;
    padding-top: 1px;
    text-align: center;
    width: 20px;
    height: 20px;
    border-radius: 20px;
    background-color: #8B99A1;
    color: #fff;
}

.step-completed {
    display: inline-block;
    padding-top: 1px;
    text-align: center;
    width: 20px;
    height: 20px;
    border-radius: 20px;
    background-color: #00ca79;
    color: #fff;
}

.step-spacer {
    width: 235px;
    height: 2px;
    margin: 3px;
    display: inline-block;
    background-color: #8B99A1;
}

.step-spacer-completed {
    width: 40%;
    height: 2px;
    margin: 5px;
    display: inline-block;
    background-color: #00ca79;
}

.step-message-text {
    font-size: 14px;
    font-weight: 600;
    color: #8E99A1;
}

.step-message-text.completed {
    color: #00CA79;
}

.step-message-text.active {
    color: #20282F;
}

.broadcast-credits {
    font-size: .875rem;
    padding: .5rem 1rem;
    border-radius: 2rem;
    width: auto;
    background-color: #f5f5f5;
    display: inline-block;
    height: 2.325rem;
    top: 1px;
    position: relative;
}

#broadcast-add-modal .broadcast-credits {
    font-size: 1rem;
    padding: 1.5rem 1rem;
    border-radius: 0;
    display: none;
    height: auto;
    text-align: center;
    background-color: #d8f0ff !important;
}

.resident-upload-content,
.broadcast-add-content {
    border: 2px dashed #ccc;
    padding: 2rem;
    margin: 0rem;
    background-color: #f9f9f9;
    min-height: 160px;
    font-size: 1rem;
    color: #555;
    display: flex;
    flex-flow: column;
    justify-content: center;
}

    .resident-upload-content .fa-upload,
    .broadcast-add-content .fa-upload {
        margin-bottom: 5px;
        font-size: 3rem;
        color: #00ca67;
    }

.broadcast-time{
    white-space: nowrap;
}

.broadcast-status {
    padding: 3px 8px;
    border-radius: 6px;
    white-space: nowrap;
}

.broadcast-status.processed {
    background-color: #D8F5ED;
    font-size: 14px;
}

.broadcast-status.pending {
    background-color: #FFF7EC;
    font-size: 14px;
}

.broadcast-status.processed img,
.broadcast-status.pending img{
    margin-right: 5px;
    margin-top: -2px !important;
}

.broadcast-status i {
    float: left;
    margin-top: 5px;
}

.fileupload-buttonbar {
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: center;
    margin-top: 65px;
}

        .fileupload-buttonbar .glyphicon {
            font-size: 16px !important;
            top: 1px !important;
        }

    .btn-primary .glyphicon {
        font-size: 16px !important;
        top: 1px !important;
    }

    .fileupload-processing {
        text-align: center !important;
    }

.fileupload-buttonbar .fileinput-button {
    color: #00ca67 !important;
    border: 1px solid #00ca67 !important;
    background-color: transparent !important;
}

    .fileupload-buttonbar #btnSaveList {
        margin: 0 !important;
    }



.fileupload-buttonbar .btn-success {
    color: #fff;
    background-color: #00ca67 !important;
    border-color: transparent !important;
}



body[data-state='resident-contact-list'] .tip-question,
body[data-state='corporate-contact-list'] .tip-question {
    cursor: pointer;
    color: #00ca67;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none;
    position: relative;
}

    body[data-state='resident-contact-list'] .tip-question.active .caret,
    body[data-state='corporate-contact-list'] .tip-question.active .caret {
        -webkit-transform: rotateZ(180deg);
        transform: rotateZ(180deg);
    }

body[data-state='resident-contact-list'] .tip-answer,
body[data-state='corporate-contact-list'] .tip-answer {
    padding: 1rem 1.5rem;
    color: #555;
    display: block;
    font-size: 1rem;
    background: #f2f2f2;
    border-radius: 2px;
    margin-bottom: 1rem;
    flex-direction: column;
    position: absolute;
    top: 2.5rem;
    left: 10rem;
    z-index: 1;
    width: 28rem;
}

    body[data-state='resident-contact-list'] .tip-answer button,
    body[data-state='corporate-contact-list'] .tip-answer button {
        margin-top: 1rem;
    }


/*BULK ACTIONS & SORT BY*/
body[data-state='resident-contact-list'] .settings-form .caret,
body[data-state='corporate-contact-list'] .settings-form .caret {
    margin: 0px;
    position: relative;
    top: initial;
    border-top-color: #000;
    left: initial;
    -webkit-transform: none;
    transform: none;
}

/*TABLE*/
body[data-state='community-broadcast'] #residentList,
body[data-state='community-broadcast'] #communityBroadcastHistoryList,
body[data-state='corporate-broadcast'] #residentList,
body[data-state='corporate-broadcast'] #communityBroadcastHistoryList {
    padding-right: 20px;
}

/*#resident-contact-list-container,
#corporate-contact-list-container {
    max-height: 350px;
    overflow-y: scroll;
}*/

#resident-contact-list .dropdown,
#corporate-contact-list .dropdown,
#community-broadcast-history-list .dropdown {
    padding-left: 8px;
}

#community-broadcast-history-list th .checkbox-control {
    position: absolute;
    top: -2px;
}

#resident-contact-list,
#corporate-contact-list,
#community-broadcast-history-list {
    font-size: 1rem;
    /*border-top: solid 1px #aaa;*/
    border-bottom: solid 1px #aaa;
    /*table-layout: fixed;*/
}

.tableFixHead {
    overflow-y: auto;
    height: 400px;
}

#resident-contact-list thead,
#corporate-contact-list thead,
#community-broadcast-history-list thead {
    height: 2rem;
    vertical-align: middle;
    text-align: center;
    font-size: 0.875rem;
    background: #f9f9f9
}

#resident-contact-list .checkbox-control,
#resident-contact-list .check-box {
    position: static;
}

#resident-contact-list thead th,
#corporate-contact-list thead th,
#community-broadcast-history-list thead th {
    font-size: 1rem;
    color: #555;
    font-weight: 400;
}

#resident-contact-list thead th.user-role {
    width: 90px;
}

#resident-contact-list .name {
    font-weight: bold;
    white-space: nowrap;
}

#resident-contact-list .phone,
#resident-contact-list .mobile {
    white-space: nowrap;
    color: #555;
}

#resident-contact-list .email {
    white-space: nowrap;
    overflow: hidden;
    width: 90%;
    text-overflow: ellipsis;
}

.broadcast-info{
    color: #425563;
}


.broadcast-history-types {
    padding: 0;
    list-style-type: circle;
    padding-inline-start: 34px;
    line-height: 25px;
}

.broadcast-history-types li {
    display: inline;
    font-size: 14px;
    font-weight: 400;
}

.broadcast-history-recipients {
    background-color: #F5F6F7;
    padding: 8px 16px;
    border-radius: 4px;
}



.broadcast-history-recipients {
    overflow-y: auto;
    max-height: 400px;
    min-height: 110px;
}



#broadcast-history-modal .icon {

}

#step-schedule .circle,
#broadcast-history-modal .circle {
    border: solid 1px #ECEEEF;
    height: 32px;
    width: 32px;
    line-height: 32px;
    -moz-border-radius: 50%;
    border-radius: 50%;
    text-align: center;
}

#broadcast-history-modal .circle img {
    margin-bottom: 6px;
}

#step-schedule .circle img {
    margin-bottom: 5px;
}

#step-schedule .label,
#broadcast-history-modal .label {
    font-weight: 600;
    color: #B3BBC1;
    line-height: 16px;
    font-size: 12px;
    padding: unset !important;
}

#step-schedule .desc,
#step-schedule .desc input,
#broadcast-history-modal .desc,
#broadcast-history-modal .desc input {
    font-weight: 600;
    color: #425563;
    line-height: 16px;
    font-size: 14px !important;
    text-indent: unset !important;
}

#broadcast-history-modal .line {
    width: 480px
}

#broadcast-history-modal .recipients {
    padding: 0px 60px;
}

.broadcast-history-recipients .name {
    font-size: 14px;
    font-weight: 600;
}

#community-broadcast-history-list td:nth-child(1) {
    width: 55%;
}

.broadcast-info .name {
    font-size: 16px;
    font-weight: 600;
}

.broadcast-info .message {
    font-size: 14px;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
    overflow: hidden;
    max-width: 700px;
}


.broadcast-actions {
    height: 40px;
    width: 40px;
    text-align: center;
    cursor: pointer;
    margin-left: 45px;
}

.broadcast-actions img {
    margin-top: 0 !important;
}

.broadcast-actions.active,
.broadcast-actions:hover {
    background-color: #D9DDE0;
    border-radius: 20px;
}

.select-menu {
    border-radius: 8px;
    border: solid 1px #00ca67;
    display: none;
    position: absolute;
    background: #FFF;
    right: 0;
    z-index: 10000;
}

.select-menu p {
    margin: 0;
}

.select-menu div,
.select-menu p a {
    color: #000 !important;
    padding: 5px 5px 5px 15px;
    white-space: nowrap;
}

.select-menu div:hover,
.select-menu p a:hover {
    background-color: #F5F6F7;
    cursor: pointer;
}

.select-menu div:first-child:hover,
.select-menu p a:first-child:hover {
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.select-menu div:last-child:hover,
.select-menu p a:last-child:hover {
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}

.broadcast-duration-menu {
    width: 120px;
    right: unset !important;
    margin-top: 4px;
    /*box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
    -webkit-box-shadow: 0 6px 12px rgb(0 0 0 / 18%);*/
}

#resident-contact-list tbody th,
#corporate-contact-list tbody th,
#community-broadcast-history-list tbody th {
    padding-left: 1rem;
}

    #resident-contact-list tbody th,
    #corporate-contact-list tbody th,
    #community-broadcast-history-list tbody th,
    #resident-contact-list tbody td,
    #corporate-contact-list tbody td,
    #community-broadcast-history-list tbody td {
        border-color: #D9DDE0;
    }

    #resident-contact-list thead th:nth-child(1),
    #corporate-contact-list thead th:nth-child(1) {
        width: 2.75rem;
    }

    #community-broadcast-history-list td {
        vertical-align: middle;
    }
    
 /*   #community-broadcast-history-list thead th:nth-child(2) {
        width: 25%;
    }*/

    #community-broadcast-history-list th:nth-child(3) {
        width: 110px;
    }

    
    #community-broadcast-history-list th:nth-child(4) {
        width: 110px;
    }

    #resident-contact-list thead th:nth-child(5),
    #corporate-contact-list thead th:nth-child(5),
    #community-broadcast-history-list th:nth-child(5) {
        width: 152px;
    }
    
    #community-broadcast-history-list th:nth-child(6) {
        width: 165px;
    }

    #community-broadcast-history-list th:nth-child(7) {
        width: 106px;
    }

    #community-broadcast-history-list thead th:last-child,
    #community-broadcast-history-list tbody td:last-child  {
        width: 50px;
        padding-right: 0 !important;
    }

    #community-broadcast-history-list td a {
        display: block;
    }

    .broadcast-actions-menu {
        width: 168px;
    }

    .tooltip-wrapper {
        /*display: inline-block;*/
        position: relative;
        width: 1.125rem;
        height: 1.125rem;
        text-align: center;
        /*top: 2px;*/
        /*margin-left: 0.5rem;*/
    }

    .tooltip-cta {
        font-family: "Helvetica", sans-serif;
        font-size: 0.875rem;
        font-weight: 400;
        line-height: 0rem;
        color: #fff;
        background-color: #555;
        display: flex;
        width: 1.5rem;
        height: 1.25rem;
        position: absolute;
        cursor: pointer;
        white-space: nowrap;
        border-radius: 1rem;
        text-indent: initial;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        top: 0;
    }

    body[data-state="call-forwarding"] .tooltip-wrapper {
        font-family: "Georgia", serif;
        font-style: italic;
        margin: 0rem;
        margin-right: 0.5rem;
    }

.tooltip-legend {
    display: block;
    visibility: hidden;
    -webkit-opacity: 0;
    opacity: 0;
    padding: 12px;
    font-size: 0.875rem;
    position: absolute;
    top: 3rem;
    text-align: left;
    z-index: 2;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #ccc;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175);
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
    color: #000;
}

@media (min-width: 320px) {
    .tooltip-legend {
        /*left: 50%;*/
        left: 11px;
        -webkit-transform: translateX(-75%);
        transform: translateX(-75%)
    }
}

@media (min-width: 1024px) {
    .tooltip-legend {
        /*left: 50%;*/
        left: 11px;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }
}


.tooltip-legend ul {
    display: block;
    list-style: none;
    padding: 0;
    margin: 0;
}

    .tooltip-legend ul > li:not(:last-child) {
        margin-bottom: 0.75rem;
        padding-bottom: 0.75rem;
        border-bottom: 1px solid #eee;
    }

.tooltip-wrapper.active .tooltip-legend {
    visibility: visible;
    -webkit-opacity: 1;
    opacity: 1;
}

.tooltip-description {
    color: #555;
    display: block;
    text-align: center;
    /*padding-left: 1.25rem;*/
}

#resident-contact-list .caret,
#corporate-contact-list .caret,
#community-broadcast-history-list .caret {
    margin: 0px !important;
    position: absolute;
    top: -4px;
    border-top-color: #555;
}


@media (min-width: 320px) {
    #resident-contact-list .caret,
    #corporate-contact-list .caret,
    #community-broadcast-history-list .caret {
        left: 50%;
        -webkit-transform: rotateZ(180deg);
        transform: rotateZ(180deg);
    }
}

@media (min-width: 1024px) {
    #resident-contact-list .caret,
    #corporate-contact-list .caret,
    #community-broadcast-history-list .caret {
        left: 50%;
        -webkit-transform: rotateZ(180deg) translateX(50%);
        transform: rotateZ(180deg) translateX(50%);
    }
}

/*** Activity Styles ***/
#activities .dropdown {
    padding-left: 8px;
}

#activities {
    font-size: 1rem;
    margin-top: 1rem;
    border-top: solid 1px #aaa;
    border-bottom: solid 1px #aaa   ;
    table-layout: fixed;
}
#activities thead {
    height: 2rem;
    vertical-align: middle;
    text-align: center;
    font-size: 0.875rem;
    background: #f9f9f9
}

    #activities thead th {
        font-size: 1rem;
        color: #555;
        font-weight: 400;
    }

    #activities tbody th {
        padding-left: 1rem;
        border-color: #aaa;
    }

    #activities tbody td {
        border-color: #aaa;
    }


    #activities thead td:nth-child(1) {
        vertical-align: unset !important;
    }

    #activities thead th:nth-child(4) {
        width: auto
    }

    
    .broadcast-info .message {
        max-width: 100px;
    }

    #activities thead th:nth-child(1) {
        width: 3rem
    }

    #activities thead th:nth-child(2) {
        width: 11.667rem
    }

    #activities thead th:nth-child(3) {
        width: 14.167rem;
        white-space: nowrap
    }

    #activities thead th:nth-child(5) {
        width: 10.667rem;
    }

    @media (min-width: 1024px) {
        .broadcast-info .message {
            max-width: 300px;
        }
        #activities thead th:nth-child(2) {
            width: 12.667rem
        }

        #activities thead th:nth-child(3) {
            width: 15.167rem;
        }

        #activities thead th:nth-child(5) {
            width: 20%;
        }
    }

    @media (min-width: 1280px) {
        .broadcast-info .message {
            max-width: 400px;
        }
        #activities thead th:nth-child(3) {
            width: 16.667rem;
        }
    }

    @media (min-width: 1366px) {
        .broadcast-info .message {
            max-width: 500px;
        }
        #activities thead th:nth-child(5) {
            width: 25%;
        }
    }

    @media (min-width: 1680px) {
        .broadcast-info .message {
            max-width: 600px;
        }
        #activities thead th:nth-child(5) {
            width: 33.333%;
        }
    }

    @media (min-width: 1920px) {
        .broadcast-info .message {
            max-width: 700px;
        }
        #activities thead th:nth-child(2) {
            width: 16.667rem
        }

        #activities thead th:nth-child(3) {
            width: 20.167rem
        }
    }

    @media (min-width: 320px) {
        #activities .tooltip-legend {
            left: 50%;
            -webkit-transform: translateX(-75%);
            transform: translateX(-75%)

        }
    }

    @media (min-width: 1024px) {
        #activities .tooltip-legend {
            left: 50%;
            -webkit-transform: translateX(-50%);
            transform: translateX(-50%)
        }
    }


        #activities .tooltip-legend ul {
            display: block;
            list-style: none;
            padding: 0;
            margin: 0;
        }

        #activities .tooltip-legend ul > li:not(:last-child) {
            margin-bottom: 0.75rem;
            padding-bottom: 0.75rem;
            border-bottom: 1px solid #eee;
        }


        #activities .tooltip-wrapper.active .tooltip-legend {
            visibility: visible;
            -webkit-opacity: 1;
            opacity: 1;
        }

        #activities .tooltip-description {
            color: #555;
            display: block;
            padding-left: 1.25rem;
        }

        #activities .caret {
            margin: 0px !important;
            position: absolute;
            top: -4px;
            border-top-color: #555;
        }


        @media (min-width: 320px) {
            #activities .caret {
                left: 50%;
                -webkit-transform: rotateZ(180deg);
                transform: rotateZ(180deg);

            }
        }

        @media (min-width: 1024px) {
            #activities .caret {
                left: 50%;
                -webkit-transform: rotateZ(180deg) translateX(50%);
                transform: rotateZ(180deg) translateX(50%);
            }
        }

#activities .activity-note {
    color: #555;
}

#activities .btn-add-note {
    font-weight: normal;
}

#activities .activity-routine-maintenance-or-leasing-note {
    color: #555;
}

#activities-add-note-modal #txtNotes {
    padding: 1.5rem;
    margin: 1rem;
    height: 6rem;
    width: 96%;
    overflow: auto;
    text-indent: 0rem;
    text-overflow: initial;
    line-height: 1.75rem;
    vertical-align: top;
    resize: none;
    outline: none !important;
    border: none;
}

#activities-add-note-modal #txtNotesCharNum {
    color: #555;
    position: absolute;
    bottom: -3rem;
    left: 1rem;
    font-size: 14px;
}

#activities-add-note-modal .modal-header #modal-datetime{
    float: right;
    margin-right: 2rem
}

/* Activities Table: Notes for multiline text ellipsis */
#activities .block-with-text {
    overflow: hidden;
    position: relative;
    line-height: 1.2rem;
    max-height: 3.6rem;
    text-align: left;
    margin-right: -1rem;
    padding-right: 1rem;
    width: 90%;
}
    #activities .block-with-text:after {
        content: '...';
        color: #ccc;
        position: absolute;
        right: 0;
        bottom: 0.125rem;
        line-height: inherit;
        width: 50%;
        padding-left: 1.5rem;
        background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 15%, rgba(255,255,255,1) 100%);
        background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 15%,rgba(255,255,255,1) 100%);
        background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 15%,rgba(255,255,255,1) 100%)
    }

    #activities .block-with-text:before {
        position: absolute;
        z-index: 1;
        right: 0;
        bottom: 0.125rem;
        content: 'Add Notes';
        color: red;
        line-height: inherit;
        width: 50%;
        padding-left: 2.66rem;

    }


#activities .activity-status.assigned:before,
#activities .activity-status.pending:before,
#activities .activity-status.completed:before,
#activities .activity-status.converted-to-routine:before,
#activities .activity-status.listened:before,
#activities .activity-status.called:before {
    content: '';
    display: inline-block;
    width: 0.75rem;
    height: 0.75rem;
    position: relative;
    margin-right: 0.5rem;
    border-radius: 100%;
}

#activities .activity-status.assigned:before,
#activities .activity-status.listened:before {
    border: 2px solid #f2d055;
}

#activities .activity-status.pending:before,
#community-broadcast-history-list .broadcast-status.pending:before{
    border: 2px solid #ffa07a;
}

#activities .activity-status.completed:before,
#activities .activity-status.converted-to-routine:before,
#activities .activity-status.called:before,
#community-broadcast-history-list .broadcast-status.processed:before {
    border: 2px solid #00ca79;
}

#activities .activity-status,
#community-broadcast-history-list .broadcast-status {
    font-weight: 600;
    display: inline-block;
}

#activities .activity-responsetime {
    color: #555;
    padding-left: 1.125rem

}

.activities .options li,
.resident-contact-list .options li,
.corporate-contact-list .options li {
    padding: 10px 1rem 0rem !important;
    font-size: 1rem;
}
    .activities .options li:hover,
    .resident-contact-list .options li:hover,
    .corporate-contact-list .options li:hover {
        color: #00ca67 !important;
        cursor: pointer;
        text-decoration: none;
        background-color: transparent !important;
    }

.activities h2,
.settings-team h2 {
    line-height: normal;
    font-size: 1.75rem;
    font-weight: 600;
    margin: 0 0 2rem;
}

.nav-toggle {
    border: solid 1px #CCC;
    border-radius: 4px
}
    .nav-toggle li {
        padding: 0;
    }
    .nav-toggle li.selected {
        background-color: #00ca67
    }

        .nav-toggle li.selected:first-child {
            border-radius: 3px 0 0 3px;
        }
        .nav-toggle li.selected:last-child {
            border-radius: 0 3px 3px 0;
        }
        .nav-toggle li a {
            margin: 0rem;
            padding: 0.417rem 1.667rem !important; /*5px 20px*/
            display: inline-block;
            font-size: 1rem;
            line-height: 1.667rem;
            width: 9rem;
            text-align: center;
        }
    .nav-toggle .selected a {
        color: #fff !important
    }

.activities .options {
    padding: 0px 1rem !important;
    white-space: nowrap;
    font-size: 1rem;
}

    .activities .options:last-child {
        padding: 0 !important;
        position: absolute;
        right: 0;
        top: 0;
        width: auto;
    }

    .activities .options .dropdown-menu[aria-labelledby="sort-by"] {
        left: initial;
        right: 0 !important;
        white-space: nowrap;
    }


    .activities .navbar {
        float: right;
        margin-bottom: 2rem
    }

#sort-by-actions {
    margin-right: 0.75rem;
    white-space: nowrap;
}

#inbox-status, #inbox-type, #sort-by, #dt-month, #dt-year, #prevnext-monthyear-controls {
    background-color: #FFF;
    border: none;
    outline: none;
    font-size: 1rem;
    font-weight: 600;
}


.inbox-button {
    padding: 5px 0px 5px 10px;
    background-color: #D9F7E8;
    font-weight: 700;
    color: #00ca67;
    cursor: pointer;
    border-radius: 4px;
    width: 100px;
    display: inline-block;
}


.inbox-button.archive {
    width: 110px;
}

.inbox-icon {
    position: relative;
    font-size: 14px;
}

.inbox-icon:before {
    font-family: "Font Awesome 5 Free";
    top:0;
    left:-5px;
    padding-right:10px;
    content: "\f0f3"; 
}

.inbox-chevron {
    position: relative;
    font-size: 14px;
    top: 2px;
}

.inbox-chevron:before {
    font-family: "Font Awesome 5 Free";
    top:0;
    left:-5px;
    padding-right:10px;
    content: "\f078"; 
}

.inbox-type {
    text-transform: capitalize;
    margin-right: 5px;
}


.info-icon {
    position: relative;
    color: #00ca67;
    font-size: 18px;
}

.info-icon:before {
    font-family: "Font Awesome 5 Free";
    top:0;
    left:-5px;
    padding-right:10px;
    content: "\f05a"; 
}


.preview-play {
    color: #00ca67;
    position: relative;
    font-size: 35px;
}

.preview-play:before {
    font-family: "Font Awesome 5 Free";
    top:0;
    left:-5px;
    padding-right:10px;
    content: "\f144"; 
}

.preview-pause {
    color: #00ca67;
    position: relative;
    font-size: 35px;
}

.preview-pause:before {
    font-family: "Font Awesome 5 Free";
    top:0;
    left:-5px;
    padding-right:10px;
    content: "\f28b"; 
}

#prevnext-monthyear-controls {
    top: -0.325rem;
    position: relative;
}

    #prevnext-monthyear-controls #prevnext-monthyear-value {
        padding-right: 0.5rem;
    }

    #prevnext-monthyear-controls button,
    #calendar_main .fc-right button {
        background: transparent;
        border: none;
        padding: 0;
        margin: 0 .125rem;
        height: 2rem;
        width: 1rem;
        line-height: 2.325rem;
        font-size: .75rem;
        -webkit-tap-highlight-color: none;
        -webkit-highlight: none;
        -webkit-appearance: initial;
        pointer-events: auto !important;
    }

    #prevnext-monthyear-controls button:focus,
    #calendar_main .fc-right button:focus {
        outline: none !important
    }


    #bulk-actions.open .dropdown-menu {
    position: absolute;
    left: -1.5rem;
    top: -1.5rem;
    padding-top: 3rem;
    z-index: 1;
    min-width: 160px
}

#sort-by-actions.open .dropdown-menu,
#month-selector.open .dropdown-menu,
#year-selector.open .dropdown-menu {
    position: absolute;
    right: -1.5rem !important;
    top: -1.5rem;
    padding-top: 3rem;
    z-index: 1;
    min-width: 100px;
}

#month-selector.open .dropdown-menu,
#year-selector.open .dropdown-menu {
    margin-left: -10px;
    width: 125px;
}
#bulk-actions.open input[type="checkbox"],
#bulk-actions.open #inbox-status,
#sort-by-actions.open #sort-by,
#month-selector.open #dt-month,
#year-selector.open #dt-year {
    z-index: 2;
    position: relative;
    font-size: 1rem
}
#bulk-actions .caret,
#sort-by-actions .caret {
    margin-left: 10px !important;
}

#bulk-actions.open .caret,
#sort-by-actions.open .caret,
#month-selector.open .caret,
#year-selector.open .caret {
    transform: rotateZ(180deg)
}

#btnRunReport {
    margin-left: 20px;
}
.activity-phone {
    font-weight: 600;
}
.activity-length {
    color: #555 !important;
}
.activities .voice-message {
    font-weight: 600;
}
.activities .download-audit,
.activities .completion-date,
.activities .completion-time {
    color: #555;
    cursor: pointer;
    margin-right: 0.325rem;
    border: 1px solid #ddd;
    border-radius: 100%;
    width: 2rem;
    height: 2rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 0.925rem !important;
}
.activities .download-audit:hover,
.activities .completion-date:hover,
.activities .completion-time:hover {
    color: #fff;
    background-color: #00ca79;
    border-color: #00ca79;
}
.activities .activity-text {
    width: 90%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #555;
}
.activities .activity-date {
    width: 115px;
    color: #555;
}
.activities .activity-provider {
    color: #555;
}
.activities .modal-header {
    font-size: 14px
}
.activity-responsetime {
    color: #555;
}
.status-width {
    width: 260px !important;
}
.actions {
    text-align: right;
}
.modal-header .title {
    text-transform: capitalize;
}

.activities audio {
    width: 96%;
    margin: 1rem 1rem;
}

.activities .transcript {
    font-size: 1rem;
    padding: 1.5rem 2.425rem;
    background-color: #fafafa;
    margin: -1.425rem 1rem 0;
    color: #555;
}

.activities #response-time {
    padding: 1rem;
    border: 1px solid #ddd;
    margin: 1rem;
}

    .activities #response-time-header {
        line-height: 2rem;
        display: flex;
        align-items: center;
        position: relative;
    }

        .activities #response-time-header .title {

        }
        .activities #response-time-header .duration {
            padding-left: 1rem;
            font-weight: bold;
        }

        .activities #response-time-header #headingOne {
            display: flex;
            width: 4rem;
            height: 4rem;
            position: absolute;
            right: 0;
            top: 50%;
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
            margin-right: -1rem;
            align-items: center;
        }

            .activities #response-time-header #headingOne a {
                width: 100%;
                display: block;
                text-align: right;
                padding-right: 1rem;                
            }

    .activities .response-time-details {
        padding-top: 1rem;
        max-height: 40vh;
        overflow-y: auto;
    }

        .activities .response-time-details ul {
            list-style-type: none;
            margin: 0;
            padding: 0;
            display: table;
            table-layout: fixed;
            width: 100%;
            border-collapse: collapse;
        }

        .activities .response-time-details li {
            padding: 1rem;
            border-bottom: 1px solid #ddd;
            display: table-row;
        }

        .activities .response-time-details li:last-child {
            border-bottom: none;
        }

        .activities .response-time-details .datetime {
            display: table-cell;
            width: 15rem;
            white-space: nowrap;
            padding: 1rem

        }

        .activities .response-time-details .txt {
            display: table-cell;
            padding: 1rem;
        }


#activities-loader-modal .processing-spinner-wrapper {
    margin-left: -1rem;
}


/******************************
    Scheduling Styles 
*******************************/

#calendar {
    height: 50%;
}
#calendar_current .fc-unthemed td .fc-today .fc-day-number {
    width: 30px;
    height: 30px;
    color: #000 !important;
    /*font-family: Muli-Bold !important;*/
    text-align: center
}
#calendar_main .fc-unthemed td.fc-today .fc-day-number {
    padding: 4px 8px;
    color: #000
    /*font-family: Muli-Bold*/
}
#calendar_current .fc-unthemed td {
    border-color: transparent !important;
    font-size: 10px !important;
    padding-top: 2px !important

}
#calendar_current .fc-unthemed th {
    border-color: transparent !important;
    text-transform: uppercase;
    color: #555;
    /*font-family: Muli-Bold;*/
    padding-bottom: 10px;
    font-size: 10px !important
}

#calendar_main .fc-unthemed th {
    border-color: transparent !important;
    text-transform: uppercase;
    color: #555;
    /* font-family: Muli-Bold; */
    font-size: 0.875rem;
    padding: 0.75rem;
    background-color: #f4f4f4
}
#calendar_current .fc-basic-view .fc-body .fc-row {
    min-height: 3em !important

}
#calendar_current .fc-content-skeleton table,
#calendar_current .fc-content-skeleton td,
#calendar_current .fc-helper-skeleton td {
    text-align: center;
     vertical-align: middle;
}

    #calendar_current .fc-content-skeleton td .fc-day-number,
    #calendar_current .fc-helper-skeleton td .fc-day-number {
        display: inline-block;
    }


#calendar_current .fc-ltr .fc-basic-view .fc-day-top .fc-day-number {
    margin-left: 0px !important

}
#calendar_current .fc-widget-header {
    height: 2rem;
    vertical-align: middle;
    text-align: center;
    background-color: #f9f9f9;
}



#calendar_main .fc-unthemed th {
    text-transform: uppercase;
    padding-bottom: 11px

}
#calendar_main .fc-day {
    height: 15.5rem;
    width: 100%;
    position: relative;
}

    #calendar_main .fc-basic-view .fc-body .fc-row {
        z-index: initial;
    }

    #calendar_main .fc .fc-row .fc-content-skeleton table {
        height: 100%;
    }

    #calendar_main .fc-basic-view .fc-body .fc-row:after {
        content: "";
        display: block;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        position: absolute;
        z-index: initial;
        border-left: 1px solid #aaa !important;
        border-right: 1px solid #aaa !important;
    }

    #calendar_main .fc-widget-content .dragging:after {
        content: '';
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        width: 100%;
        background-color: #e5ffe5 !important;
        opacity: 0.7;
        z-index: -1;
    }

    #calendar_main .fc-widget-content .dragging .schedule-block-details {
        opacity: 0.7;
    }

    #calendar_main .fc-widget-content .dragging #schedule-wrapper {
        /*This hides the dragging and options CTAs */
        opacity: 0
    }


#calendar_current .fc-day-grid {
    border-top: #aaa 1px solid;
    overflow: hidden;
}
#calendar_main .fc-day-grid {
    margin-top: 2px;
}
#calendar_main .fc-scroller {
    /*overflow-x: visible !important;
    overflow-y: visible !important;
    height: auto !important*/
    overflow: visible !important;
    height: auto !important;
}
.fc-basic-view .fc-body .fc-row {
    min-height: auto !important;
    height: auto !important;
    position: relative !important
}
.fc {
    /*font-family: Muli-Regular;*/
}
.fc td, .fc th {
    border-width: 0px;
}
.fc button .fc-icon {
    position: relative;
    top: -.05em;
    margin: 0 .2em;
    vertical-align: unset !important; 
    font-size: 1em !important;
}
.fc-center {
    margin-top: 3px;
}

#calendar_main td.fc-head-container.fc-widget-header {
    height: 2rem !important;
    position: relative !important;
}
    #calendar_main td.fc-head-container.fc-widget-header > .fc-row.fc-widget-header {
        position: fixed !important;
        top: 16.5rem !important;
        margin: 0;
        z-index: 10;
        pointer-events: none;
        width: calc(100vw - 4.875rem);
    }

.fc-unthemed .fc-content, .fc-unthemed .fc-divider, .fc-unthemed .fc-list-heading td, .fc-unthemed .fc-list-view, .fc-unthemed .fc-popover, .fc-unthemed .fc-row, .fc-unthemed tbody, .fc-unthemed td, .fc-unthemed th, .fc-unthemed thead {
    border-color: transparent !important;
}
#calendar_current .fc-toolbar.fc-header-toolbar {
    margin: 0rem !important;
    position: relative;
    border-bottom: 1px solid #ddd;
}
#content.schedule aside {
    padding: 0;
}

#calendar_container #calendar_current {
    font-size: 0.75rem;
    opacity: 0;
    visibility: hidden;
    will-change: opacity;
    transition: opacity ease-in-out 250ms;
    position: absolute;
    top: 3rem;
    left: 0;
    z-index: 2;
    width: 350px;
    background-color: rgba(255,255,255,1);
    padding: 2rem 2rem;
    box-shadow: 0 5px 10px rgba(0,0,0,.2);
    border-radius: 3px !important;
    border: 1px solid rgba(0,0,0,.2);

}

#calendar_container.active #calendar_current {
    opacity: 1;
    visibility: visible;
}


#calendar_current .fc-view-container {
    background-color: #fff;
}

#calendar_current .fc {
    font-size: 0.75rem !important
}
#calendar_current .fc-left h2 {
    padding-left: 1.25rem;
    font-size: 1.25rem;
    line-height: 3rem;
}
#calendar_current .fc-toolbar .fc-right {
    float: none;
    position: absolute;
    width: 4rem;
    height: 100%;
    top: 0;
    right: 0;
}

#calendar_current .fc-toolbar .fc-prev-button,
#calendar_current .fc-toolbar .fc-next-button {
    display: flex;
    height: 100%;
    width: 50%;
    justify-content: center;
    margin: 0;
    padding: 0 !important;
}


#calendar_current .fc td {
    border-width: 0px !important;
    text-align: center;
    vertical-align: middle;
    margin: 0;
}


.fc-right .fc-next-button, .fc-right .fc-prev-button {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    /*font-family: Muli-Regular;*/
    padding-bottom: 5px;
    padding-left: 0px !important;
    color: #555666;
    outline: none !important;
    cursor: pointer
}
.fc-ltr .fc-basic-view .fc-day-top .fc-day-number {
    float: none !important;
    margin-left: 0px !important;
    padding: 1px !important;
    color: #555;
    z-index: 100000 !important;
}


#calendar_container {
    position: relative;
        
}

#calendar_main {
    padding-top: 5.325rem;
}

#calendar_main .fc-content-skeleton .fc-day-number {
    display: inline-flex;
    width: 1.5rem;
    height: 1.5rem;
    background-color: transparent;
    color: #555;
    border-radius: 100%;
    justify-content: center;
    align-items: center;
    margin: 0.5rem 0 0 0.7rem !important;
    font-size: 1rem;
}

#calendar_main .fc-header-toolbar {
    position: fixed;
    width: 100%;
    margin: -3rem auto 0;
    top: 11.25rem;
    left: 0;
    right: 0;
    display: flex;
    padding: 0 2.313rem;
    height: 8.25rem;
    pointer-events: none;
    z-index: 9;
}

#calendar_main .fc-header-toolbar .fc-left {
    padding-top: 3rem;
    float: none;
    background: rgba(255,255,255,.9);
}

    #calendar_main .fc-left h1 {
        /*line-height: normal;
        font-size: 1.75rem;
        font-weight: 600;
        text-align: left;*/
        margin: 0;
    }

#calendar_main .fc-header-toolbar .fc-right {
    top: 4.1rem;
    position: relative;
    float: none;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: flex-end;
    justify-content: flex-end;
    padding-bottom: 1rem;
    background: rgba(255,255,255,.9);
}

    #calendar_main .fc-right h2 {
        line-height: normal;
        font-size: 1rem;
        font-weight: 600;
        padding-right: .5rem;
        height: 2rem;
        display: inline-flex;
        align-items: center;
    }

    #calendar_main .fc-right buttons {
        pointer-events: auto !important;
    }

    #calendar_main .fc-header-toolbar #date-controls {
        font-size: 1rem;
        font-weight: 600;
        margin: 0rem;
        padding: 0rem 1rem;
        cursor: pointer;
        -webkit-touch-callout: none; /* iOS Safari */
        -webkit-user-select: none; /* Safari */
        -khtml-user-select: none; /* Konqueror HTML */
        -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
        user-select: none

    }

        #calendar_main .fc-header-toolbar #date-controls::after {
            content: "";
            position: relative;
            display: inline-block;
            width: 0;
            height: 0;
            margin-top: -0.4rem;
            margin-left: 1rem;
            vertical-align: middle;
            /*border-top: 4px dashed;
            border-top: 4px solid\9;
            border-right: 4px solid transparent;
            border-left: 4px solid transparent*/
        }

        #calendar_main .fc-header-toolbar #date-controls::after {
            transform: rotateZ(180deg);
        }

#calendar_main .fc-view-container {
    position: relative;
    z-index: 1;
}

    #calendar_main th.fc-day-header {
        vertical-align: middle;
        text-align: center;
        font-size: 1rem;
        font-weight: 600;
        background: #f9f9f9;
        border-width: 0

    }

        #calendar_main th.fc-day-header span {
            display: flex;
            height: 2rem;
            align-items: center;
            justify-content: center;
            border-top: 1px solid #aaa;
            border-bottom: 1px solid #aaa;
            text-transform: uppercase;
        }


    #calendar_main .fc-content-skeleton .fc-today .fc-day-number {
        border: 2px solid #00ca67;
        font-weight: bold;
    }

    #calendar_main .fc-row .fc-bg {
        position: relative;
        min-height: 8rem;
        border-bottom: 1px solid #aaa;
        margin-bottom: -1px;
    }

#calendar_main .fc-row .fc-content-skeleton {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    padding-bottom: 0px

}
    #calendar_main .fc-row .fc-content-skeleton > table {
        height: 100%;
    }

    #calendar_main .fc-unthemed thead {
        
    }

    #calendar_main .fc-content-skeleton thead td {
        border-left: 1px solid #aaa !important;
        border-right: 1px solid #aaa !important;
        height: 15.5rem;
    }

    #calendar_main .fc-content-skeleton thead td:last-child {
        
    }

    #calendar_main .fc-content-skeleton tbody {
        display: none;
    }

#calendar_main thead.fc-head {
    position: relative;
    pointer-events: none;
}

#calendar_main .fc-content-skeleton .fc-today {
    background: none !important;
    color: #000 !important

}

.fc-unthemed td.fc-today {
    background-color: transparent !important
}

#calendar_current .biMonthlySelected {
    background-color: #e5ffe5 !important;
}

#calendar_current .fc-row .fc-content-skeleton {
    padding-left: 0px !important;
    z-index: 1 !important;
    height: 2rem;
    line-height: 2.125rem;
}

#calendar_current .fc td, #calendar_current .fc th {
    border-width: 0 !important;
}

#calendar_current .fc-bg {
    border-bottom: 0px solid #fff

}

    #calendar_current .fc-bg .fc-past {
        overflow: hidden;
        position: relative;
        border: none;
    }

#calendar_current .fc-today .fc-day-number {
    background-color: #fff;
    border: 2px solid #00ca67;
    font-weight: bold;
    width: 1.125rem;
    height: 1.125rem;
    line-height: 1.25rem;
    border-radius: 100%;
    text-align: center

}
/*
#calendar_current .fc-bg .fc-past::before,
#calendar_current .fc-bg .fc-past::after {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 50%;
    bottom: 0;
    width: 1px;
    height: 100%;
    background-color: #eee
}

    #calendar_current .fc-bg .fc-past::before {
        transform: translateX(-50%) rotateZ(330deg)
    }

    #calendar_current .fc-bg .fc-past::after {
        transform: translateX(-50%) rotateZ(-330deg)
    }*/


#schedule-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10 !important
}

#schedule-menu {
    float: right;
    margin-top: 2px;
}

    #schedule-menu a {
        width: 24px;
        height: 32px;
        color: #00ca67;
        font-size: 1.5rem;
        display: inline-flex;
        justify-content: center;
        align-items: center;
        margin-right: 4px;
    }


#schedule-wrapper .drag {
    position: absolute;
    top: 2px;
    right: 28px;
    width: 24px;
    height: 32px;
    color: #00ca67;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
    font-size: 1.5rem;
    cursor: grab !important;
    cursor: -webkit-grab !important;
    cursor: -moz-grab !important
}
    
    #schedule-wrapper .drag:active {
        cursor: grabbing !important;
        cursor: -webkit-grabbing !important;
        cursor: -moz-grabbing !important
    }



#schedule-menu-popover:hover {
    color: #00ca67;
}
#schedule-menu-popover a {
    cursor: pointer;
}

#popover-placeholder {
    position: absolute;
    top: -16.66%;
    top: 0.25rem;
    left: 90%;
    z-index: 999;
}
    #popover-placeholder .popover {
        top: initial !important;
        left: initial !important;
    }

#popover-placeholder .popover.right {
    border-radius: 3px !important;
}
#popover-placeholder .popover.left {
    /*left: -121px !important;*/
    border-radius: 3px !important;
    margin: auto !important;

}
.popover .arrow {
    visibility:hidden !important;
}
.popover-content ul {
    padding: 0;
    list-style: none;
}
.popover-content ul hr {
    margin-bottom: 10px !important;
    margin-top: 10px !important;
}
.schedule-block {
    padding: 2.975rem 0.25rem 0.25rem;
    opacity: 1;
    will-change: opacity;
    transition: all ease-in-out 250ms;

    /*  position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: -5px;
    max-height: 100%;
    overflow-x: hidden;
    overflow-y: scroll*/
}

#calendar_main .fc-widget-content td:hover .schedule-block {
    opacity: 0.5;
}


#calendar_main .schedule-block-dummy {
    display: none;

}

#calendar_main .schedule-block-time {
    color: #000;
    min-width: 90px !important;
    position: relative;
    display: block;
    text-decoration: none;
    font-size: 1rem;
    font-weight: 400;
}

#calendar_main .schedule-block-primary {
    color: #000;
    width: 70%;
    display: inline-block;
    font-weight: 300;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#calendar_main .schedule-block-details {
    padding: 4px 6px 0px 6px;
    font-size: 1rem;
    border-radius: 6px;
    color: #fff;
    border: 1px solid #add6ef;
    background-color: #F0F7FF;
    margin-bottom: 0.25rem
}


#calendar_main .schedule-block-details.has-exception {
    background-color: #ffe9e0;
    border-color: #ffa07a;
}


   #calendar_main .schedule-block-details:parent .schedule-block-time.exception {
    background-color: red !important
}

#calendar_main .contiguous-l {
    background-color: #F0F7FF;
    border-color: #add6ef;
    border-left-width: 1px;
    border-right-width: 2px;
    border-right-style: dashed;
    position: relative;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

#calendar_main .contiguous-r {
    background-color: #F0F7FF;
    border-color: #add6ef;
    border-right-width: 1px;
    border-left-width: 2px;
    border-left-style: dashed;
    position: relative;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

#calendar_main .fc-past .schedule-block {
    opacity: .4 !important;
}


#calendar_main .schedule-block .exception {
    font-weight: bold;
    display: inline-block

}


.fc-past .schedule-block .exception {
    opacity: .4 !important;
}
.exception .column-add {
    margin-left: 22px !important;
}
.exception .column-add-small {
    margin-left: 31px !important;
}
.column-add {
    padding-left: 1rem !important;

}
.column-add-small {
    padding-left: 1rem !important;

}
.column-minus {
    margin-left: -45px !important;
}
.column-minus-small {
    margin-left: -32px !important;
}
.exception .column-minus {
    margin-left: 2px !important;
}

.exception .column-minus-small {
    margin-left: 2px !important;
}
.schedule-wait-value {
    margin-right: 3px;
}

/*.schedule-backup-wrapper {
    padding: 0rem 0rem 1rem 1rem !important;
    background-color: #f5f5f5;
    margin: 0 2rem !important
}*/
    .schedule-backup-wrapper .select-field-caret {
        margin-top: 1rem;
    }

        .exception-txt-wrapper {
            border: 1px solid #aaa;
            border-radius: 3px;
            margin: 0
        }
        
        .exception-txt-wrapper .iconWarning {
            border-right: 1px solid #aaa;
            padding: 10px;
            display: table-cell;
            vertical-align: middle;
            font-size: 1.25rem;
            color: #ffa07a
        }

        .exception-txt-wrapper .exception-txt {
            display: table-cell;
            padding: 10px 20px;
            vertical-align: middle;
            line-height: normal
        }

.backup-time {
    white-space: nowrap;
    line-height: 1rem;
    background-color: #fff;
    border-radius: 0 0 3px 3px;
}
.backup-add {
    padding-left: 40px;
}
.add-time {
    line-height: 2rem;
    white-space: nowrap;
    padding: 0 !important;
    text-align: left

}
    .add-time a {
        font-size: 1rem;
        outline: none !important;
        text-decoration: none !important;
        color: #00ca67 !important
    }

.time-block {
    text-align: right;

}
.exception .time-remove {
    float: right;
    padding-right: 20px;
}
.modal-open .modal {
    overflow-y: hidden;
}

.modal-body {
    padding: 0;

}

.alert-modal-content {
    height: 240px;
}

    .alert-modal-content .modal-body {
        padding-top: 30px;
        text-align: center;
    }

        .alert-modal-content .modal-body .btn {
            margin-top: 20px;
        }

#alert-modal .modal-content,
#confirm-modal .modal-content,
#add-note-modal .modal-content {
    padding-bottom: 10px;
}

#activities-loader-modal .modal-body {
    padding: 3rem 0rem 4rem;
}

/*#settings-modal .modal-body {
    min-height: 12rem;
}

#settings-modal .modal-body .alert-message {
    padding: 20px;
    min-height: 8rem;
}*/

#settings-modal .modal-body.delete-profile {
    min-height: 85px;
    padding-top: 1rem;
    padding-bottom: 1rem;
    font-size: 1rem;
}


/*#settings-modal .modal-body.delete-profile .col-md-12 {
    height: 95px;
}*/

#schedule-modal .modal-header {
    padding: 10px 15px;
}

    #schedule-modal #modal-alert-body,
    #settings-modal #modal-alert-body {
        min-height: auto
    }

        #schedule-modal .alert-txt-wrapper,
        #settings-modal .alert-txt-wrapper {
            border: 1px solid #ddd;
            border-radius: 3px;
            margin: 2rem
        }

        #schedule-modal .alert-txt-wrapper .iconWarning,
        #settings-modal .alert-txt-wrapper .iconWarning {
            border-right: 1px solid #ddd;
            padding: 10px;
            display: table-cell;
            vertical-align: middle;
            font-size: 1.25rem;
            color: #ffa07a
        }

        #schedule-modal .alert-txt-wrapper .alert-txt,
        #settings-modal .alert-txt-wrapper .alert-txt {
            display: table-cell;
            padding: 10px 20px;
            vertical-align: middle;
            line-height: normal;
            font-size: 1rem
        }

#schedule-modal .schedule-form {
    font-size: 1rem;
    position: relative;
    margin: 1rem;
    border: 1px solid #ddd;
    box-shadow: 0px 1px 6px rgba(0,0,0,0.07);
    background-color: #f5f5f5;
    border-radius: 3px;}

    #schedule-modal .schedule-form .spacer {
        color: #555;
        display: inline-block;
    }
    
    #schedule-modal .schedule-form span {
        /*font-family: Muli-Regular !important*/
    }

    #schedule-modal .schedule-form label {
        display: block;
        font-weight: normal;
        color: #555;
    }

        .schedule-block-wrapper {
            background-color: #fff;
            border-radius: 3px 3px 0 0;
        }

            .schedule-block-wrapper > .col-xs-6 {
                padding: 0 !important;
            }

        .schedule-wait-wrapper {
            background-color: #f9f9f9;
            margin: 0.925rem !important;
            border-radius: 3px;
            border: 1px solid #ccc;
            display: flex;
        }

        .schedule-wait-wrapper:before {
            content: '';
            position: absolute;
            z-index: 1;
            top: -6px;
            left: 50%;
            -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
            width: 0;
            height: 0;
            border-left: 8px solid transparent;
            border-right: 8px solid transparent;
            border-bottom: 6px solid #ccc;
        }

        .schedule-wait-wrapper .title-wait,
        .schedule-wait-wrapper .title-then-call,
        .schedule-wait-wrapper .select-then-call {
            display: inline-flex;
            margin: 0;
            line-height: normal;
        }

            .schedule-wait-wrapper .title-wait,
            .schedule-wait-wrapper .title-then-call {
                color: #555;
                padding: 0 0.875rem;
                white-space: nowrap;
                align-items: center

            }

            .schedule-wait-wrapper .title-wait {
                padding-left: 0rem;
            }

        .schedule-wait-wrapper .select-then-call {
            width: 100%;
            background-color: #fff;
        }

        .backup-remove {
            align-items: center;
            display: inline-flex;
            padding-left: 1rem;
            font-size: 0.75rem;
            color: #555;
            cursor: pointer;
        }

        .backup-remove:hover {
            color: #000;
        }

#schedule-modal .schedule-form .time-start,
#schedule-modal .schedule-form .time-end {
    display: inline-block;
    width: 33.33%;
}

    #schedule-modal .schedule-form .schedule-primary {
        
    }

    #schedule-modal .modal-body .exception::before,
    #schedule-modal .modal-body .exception::after {
        content: '';
        display: block;
        width: 4px;
        position: absolute;
        top: 0;
        bottom: 0;
        background-color: #ffa07a;
    }

    #schedule-modal .modal-body .exception::before {
        left: 0;
    }

    #schedule-modal .modal-body .exception::after {
        right: 0;
    }

#schedule-modal .progress {
    position: fixed;
    width: 100%;
    height: auto;
    left: 0%;
    bottom: 53px;
    background: #eee;
    border: 1px solid #d0d0d0;
    border-radius: 0;
    margin: 0
}

.progress-bar {
    background-color: dodgerblue;
    height: 5px;
    font-size: 0.75rem;
    width: 100%;
}

    .progress-bar .progress-number {
        position: fixed;
        bottom: 68px;
        right: 2rem;
        color: dodgerblue;
        font-size: 1rem;
        font-weight: bold;
        line-height: normal
    }

#schedule-modal .wait,
#schedule-modal .wait * {
    display: inline-flex

}

#schedule-modal .updown {
    height: 3rem;
    width: 3rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: solid 1px #ddd;
    background-color: #fff;
    font-size: 1.5rem;
    font-weight: bold;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

#schedule-modal .schedule-wait .updown:first-child {
    border-radius: 3px 0 0 3px;
    color: #555;
}

#schedule-modal .schedule-wait .updown:last-child {
    border-radius: 0 3px 3px 0;
    color: #555;
}

#schedule-modal .schedule-wait-time {
    height: 3rem;
    position: relative;
    padding: 0 1rem;
    border: 1px solid #ddd;
    background-color: #fff;
    border-width: 1px 0;
    line-height: normal;
    align-items: center;
    justify-content: center

}

#schedule-modal .schedule-wait-value {
    font-weight: bold;
}

#activities-completion-time-modal .modal-body .row:first-child {
    padding: 2rem 0;
    display: flex;
    justify-content: center;
}

.schedule-block-backup {
    color: #fff;
    background: #add6ef;
    padding: 0px 5px;
    border-radius: 10px;
    margin-left: 4px;
    font-weight: 400;
    float: right;
    font-size: 1rem

}

#schedule-wrapper #schedule-menu,
#schedule-wrapper #schedule-menu-handle {
    opacity: 0.5;
    will-change: opacity;
    transition: all ease-in-out 250ms;
}

    #schedule-wrapper #schedule-menu:hover,
    #schedule-wrapper #schedule-menu:active,
    #schedule-wrapper #schedule-menu-handle:hover,
    #schedule-wrapper #schedule-menu-handle:active {
        opacity: 1;
    }

#schedule-wrapper .edit {
    position: absolute;
    bottom: 3px;
    left: 10px;
    font-size: 20px;
    cursor: pointer !important;
}

#schedule-undo a {
    font-size: 1em !important;
    opacity: 1.0 !important;
    padding-left: 5px;
    padding-right: 1px;
    line-height: 32px !important;
    text-decoration: none;
    color: #00ca67 !important;
    font-weight: normal !important;
}

#schedule-undo {
    z-index: 10;
    position: fixed;
    bottom: -4.65rem;
    visibility: hidden;
    will-change: opacity;
    opacity: 0;
    -webkit-opacity: 0;
    transition: opacity ease-in-out 250ms;
}

    #schedule-undo.active {
        bottom: 4.65rem;
        visibility: visible;
        opacity: 1.0;
        -webkit-opacity: 1.0;
    }

    .undo-txt-wrapper {
        background: #fff;
        border: 1px solid #ddd;
        border-radius: 3px;
        margin: 0;
        color: #555;
        box-shadow: 0 5px 15px rgba(0,0,0,.07);
        white-space: nowrap
    }

        .undo-txt-wrapper .iconWarning {
            border-right: 1px solid #ddd;
            padding: 10px;
            display: table-cell;
            vertical-align: middle;
            font-size: 1.25rem;
            color: #ffa07a
        }
        .undo-txt-wrapper .undo-txt {
            display: table-cell;
            padding: 10px 20px;
            vertical-align: middle;
            line-height: normal
        }

.check-block {
        color: #00ca67;
}
.fa-check-square {
    margin-right: 15px;
    margin-top: 3px;
}

/*
#calendar_main .fc-unthemed td .dragging {
    background: #eee !important;
    filter: alpha(opacity = 30);
    -moz-opacity: 0.3;
    opacity: 0.3
}*/

#calendar_main .fc-unthemed td .dragger {
    opacity: 0

}

#schedule-wrapper .drag:hover, #schedule-wrapper .edit:hover {
    color: #00ca67 !important;
}
.glyphicon {
    font-size: 16px !important;
    top: -10px !important;
}
.glyphicon:hover {
    color: #00ca67;
}

.glyphicon.disabled:hover {
    color: #CCC;
}

.fc-biMonthly-view .fc-day-number {
    float: left !important;
}

.fc .fc-toolbar > * > * {
    margin-left: 0 !important;
}

.fc .fc-button {
}
    

    .fc-state-default {
    border: none !important;
    background-color: transparent !important;
    background-image: none !important;
    border-color: #ddd !important;
    color: #555;
    text-shadow: none !important;
    box-shadow: none !important;
    border-radius: 0px !important;
    padding: 0 15px !important;
}
.fc-state-active, .fc-state-down {
    background-color: #00ca67 !important;
    background-image: none;
    box-shadow: none !important;
    outline: none !important;
    color: #fff !important;
    border: none !important;
    border-radius: 0px !important;
}
.fc-month-button {
    padding-left: 20px !important;
    padding-right: 20px !important;
    height: 2.5em !important;
}
.fc-biMonthly-button {
    height: 2.5em !important;
}
.schedule-form .row {
    padding: 1rem;

}

.schedule-form .fa-exclamation {
    color: red;
}
.schedule-backup-wrapper .fa-level-up {
    margin-right: 20px;
    color: #ddd;
    font-size: 1.5em;
}
.popover-content {
    font-size: 0.875rem;
    color: #555;
}
    .popover-content ul {
        margin-bottom: 0px !important;
        white-space: nowrap;
    }
.popover-content li {
    padding-bottom: 0px !important;
    line-height: 2em;
}
.popover-content li:hover {
    color: #00ca67 !important;
    cursor: pointer;
}
.popover-content {
    font-family: 'Muli', sans-serif !important;
    font-size: 1rem;
    color: #555
}

.popover-content li.disabled {
    color: #c0c0c0;
}

.popover-content li.disabled:hover {
    color: #c0c0c0 !important;
    cursor: auto;
}

/*** Modal Styles ***/
.modal-dialog {
    margin: 0;
    width: 100%;
    max-width: 600px;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%) !important;
    position: absolute

}
.modal-content {
    border: none !important;
    border: none !important;
    border-radius: 0px !important;
}
input, select, textarea {
    outline: none !important;
    border: none;
    border-bottom: 1px solid #aaa;
    margin: 0 10px;
}
select.invalid {
    border-bottom: 1px solid red;
}
.modal button {
    outline: none !important;
    border: none;
}
li.ui-timepicker-selected, .ui-timepicker-list li:hover, .ui-timepicker-list .ui-timepicker-selected:hover {
    background: none !important;
    color: #00ca67 !important;
}
.ui-timepicker-wrapper {
    width: 132px !important;
    border: none !important;
    font-size: 1rem;
}

/*
.modal select, .modal input {
    border: none;
    background: none;
    border-radius: 0px !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-bottom: 1px solid #ddd !important;
    background-image: linear-gradient(45deg, transparent 50%, gray 50%), linear-gradient(135deg, gray 50%, transparent 50%);
    background-position: calc(100% - 6px) calc(1em + -2px), calc(100% - 2px) calc(1.2em + -5px);
    background-size: 4px 4px, 4px 5px;
    background-repeat: no-repeat;
    height: 2rem;
    width: 33.333%;
    color: #555;
    font-size: 14px !important;
    text-indent: 10px;

}*/
input:disabled {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAIklEQVQIW2NkQAKrVq36zwjjgzhhYWGMYAEYB8RmROaABADeOQ8CXl/xfgAAAABJRU5ErkJggg==) repeat;
    border-bottom: 1px solid #f2f2f2 !important;
    opacity: 0.3

}
div.invalid,
span.invalid {
    color: red;
}

input.invalid, textarea.invalid {
    border-bottom: solid 1px red !important;
}

.modal .btn-default {
    color: #555 !important;
    background-color: #fff !important;
    border-color: transparent !important;
}
.btn:active:focus,
.btn-default.active.focus,
.btn-default.active:focus,
.btn-default.active:hover,
.btn-default:active.focus,
.btn-default:active:focus,
.btn-default:active:hover,
.open > .dropdown-toggle.btn-default.focus,
.open > .dropdown-toggle.btn-default:focus,
.open > .dropdown-toggle.btn-default:hover {
    color: #555 !important;
    background-color: none !important;
    border-color: transparent !important;
}
.btn.active,
.btn:active {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}
.btn-primary, .btn-warning, .btn-danger, .btn-default, .btn-text, .link-accordion, .btn {
    padding: 0.313rem 1rem;
    display: inline-block;
    font-size: 1rem;
    border-radius: 3px;
    position: relative;
}
    .btn-primary:focus
    .btn-warning:focus,
    .btn-danger:focus,
    .btn-default:focus,
    .btn-text:focus,
    .btn:focus,
    .link-accordion i:focus,
    .activities .download-audit:focus {
        outline: none;
        background-color: inherit;
        box-shadow: #fff 0 0 0 1px,rgba(33,33,33,0.5) 0 0 0 2px !important;
    }

    .activities .download-audit:focus {
        border-radius: 100%;
    }

    #sidebar-nav a {
        box-shadow: none !important;
    }

    .link-accordion {
        color: #555;
    }

    .link-accordion.active {
        background-color: #00ca67 !important;
        color: #fff !important;
    }

    .link-accordion .iconChevronRight {
        place-self: center;
        position: absolute;
        top: 1rem;
        right: 0.5rem;
        transform: rotate(90deg) translateY(50%);
        color: #333;
        transform-origin: center;
    }

    .link-accordion.active .iconChevronRight {
        transform: rotate(-90deg);
        color: #fff !important;top: 1rem;
        right: 1rem;
    }

.navbar-default .navbar-nav > li > a:focus,
.nav-user .navbar-nav > li > a:focus {
    box-shadow: none !important;
}

#confirm-cancel.btn-default,
#alert-cancel.btn-default,
#ignore-alert.btn-default {
    border: 1px solid #ccc !important
}

#confirm-alert,
#alert-alert,
#ignore-alert {
    margin-bottom: 1.25rem;
}

.btn-primary {
    color: #fff !important;
    background-color: #00ca67 !important;
    border-color: transparent !important
}

.btn-primary:active,
.btn-primary:hover {
    color: #fff !important;
    background-color: hsl(151, 100%, 36%) !important;
}

.btn-text {
    background: transparent;
    line-height: 1.75rem;
}

.modal-header {
    padding: 0 1rem;
    border-bottom: none !important;
    background: #eee;
}
.modal-title {
    font-size: 1.25rem;
}
    #activities-modal .modal-header .start-time {
        float: right;
        margin-right: 2rem;
    }

.progress-title {
    font-size: 1.25rem

}

#schedule-modal .modal-schedule-form {
    max-height: 50vh;
    overflow-x: hidden;
    overflow-y: auto;
}

#schedule-modal .progress-title,
#broadcast-add-modal .progress-title {
    position: relative;
    width: 99.99%;
    background: #f4f4f4;
    box-shadow: 0px -1px 17px rgba(0,0,0,0.05)
}
    #schedule-modal .progress-title h4,
    #broadcast-add-modal .progress-title h4 {
        font-size: 1rem;
        color: #555;
        padding: 1rem 2rem 1.5rem;
        margin: 0
    }

    #broadcast-add-modal .progress-title h4 {
        font-weight: 700;
        color: #333;
        padding: .5rem 1rem;
        border-bottom: 1px solid #ddd;
    }

.modal-header hr {
    margin-bottom: 0 !important;
}
.modal-text {
    font-size: 1rem !important;
}

    .modal-body .modal-text .panel-body {
        padding: 15px;
        font-size: 1rem;
    }

.modal-footer {
    border-top: none !important;
    width: 100%;
    padding: 1rem 2rem;
    background: #fff;
    box-shadow: 0px 0px 2px rgba(0,0,0,0.1);
}

    .modal-footer .btn + .btn {
        margin-right: -15px
    }

/*** Settings ***/

#sidebar-nav,
#sidebar-forwarding {
    padding: 3.75rem 0rem 0rem;
    position: fixed;
    z-index: 1;
    width: 20%;
}

    #sidebar-nav::after,
    #sidebar-forwarding:after {
        content: '';
        position: absolute;
        width: 1px;
        height: 75vh;
        top: 0;
        right: 0px;
        z-index: 2;
        background: rgba(170,170,170,0);
        background: -moz-linear-gradient(top, rgba(170,170,170,0) 0%, rgba(168,168,168,1) 10%, rgba(155,155,155,1) 90%, rgba(153,153,153,0) 100%);
        background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(170,170,170,0)), color-stop(10%, rgba(168,168,168,1)), color-stop(90%, rgba(155,155,155,1)), color-stop(100%, rgba(153,153,153,0)));
        background: -webkit-linear-gradient(top, rgba(170,170,170,0) 0%, rgba(168,168,168,1) 10%, rgba(155,155,155,1) 90%, rgba(153,153,153,0) 100%);
        background: -o-linear-gradient(top, rgba(170,170,170,0) 0%, rgba(168,168,168,1) 10%, rgba(155,155,155,1) 90%, rgba(153,153,153,0) 100%);
        background: -ms-linear-gradient(top, rgba(170,170,170,0) 0%, rgba(168,168,168,1) 10%, rgba(155,155,155,1) 90%, rgba(153,153,153,0) 100%);
        background: linear-gradient(to bottom, rgba(170,170,170,0) 0%, rgba(168,168,168,1) 10%, rgba(155,155,155,1) 90%, rgba(153,153,153,0) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aaaaaa', endColorstr='#999999', GradientType=0 );
    }

    #sidebar-nav .list-group {
        border-bottom-width: 0px;
        border-radius: 0px;
    }

        #sidebar-nav .list-group a,
        #sidebar-nav .list-group .list-group-item {
            padding: 0.75rem 1rem;
            margin-bottom: 0px;
            border-width: 0px;
            font-size: 1rem;
            color: #555;
            border-radius: 0px;
            background-color: transparent;
        }
        
        #sidebar-nav .list-group .list-group-item.active,
        #sidebar-nav .list-group .list-group-item.active:focus {
            background-color: #00ca67;
            color: #fff !important;
        }

        #sidebar-nav .list-group .list-group-item.active:hover {
            background-color: hsl(151, 100%, 36%);
        }

        #sidebar-nav .list-group .list-group-item:last-child {
            border-bottom-width: 0px;
        }
        
    #sidebar-nav .list-group-item:first-child,
    #sidebar-nav .list-group-item:last-child {
        border-radius: 0
    }

    #sidebar-nav h3,
    #sidebar-forwarding h3 {
        margin: 1.75rem 1rem 2rem;
        font-size: 1.25rem;
        font-weight: 600;
    }

    #sidebar-forwarding h3 {
        text-align: center;
        font-weight: bold;
    }

    #sidebar-nav hr {
        border: none;
        height: 1px;
        background: rgba(170,170,170,0);
        background: -moz-linear-gradient(left, rgba(170,170,170,0) 0%, rgba(168,168,168,1) 10%, rgba(153,153,153,1) 100%);
        background: -webkit-gradient(left top, right top, color-stop(0%, rgba(170,170,170,0)), color-stop(10%, rgba(168,168,168,1)), color-stop(100%, rgba(153,153,153,1)));
        background: -webkit-linear-gradient(left, rgba(170,170,170,0) 0%, rgba(168,168,168,1) 10%, rgba(153,153,153,1) 100%);
        background: -o-linear-gradient(left, rgba(170,170,170,0) 0%, rgba(168,168,168,1) 10%, rgba(153,153,153,1) 100%);
        background: -ms-linear-gradient(left, rgba(170,170,170,0) 0%, rgba(168,168,168,1) 10%, rgba(153,153,153,1) 100%);
        background: linear-gradient(to right, rgba(170,170,170,0) 0%, rgba(168,168,168,1) 10%, rgba(153,153,153,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aaaaaa', endColorstr='#999999', GradientType=1 );
    }

.settings-team .options {
    padding-left: 8px !important
}

.settings-team .navbar-btn {
    margin: 0;
}

.settings-team .navbar-btn .navbar {
    margin-bottom: 2rem
}

#profile,
#main {
    padding: 0rem;
    padding-left: 25%;
}

#profile-add-actions {
    
}

#profile-add-new,
#profile-add-new:active,
#profile-add-new:focus,
#profile-add-existing,
#profile-add-existing:active,
#profile-add-existing:focus {
    color: #00ca67;
    text-decoration: none;
    display: block;
    padding: 0.75rem 1rem;
    margin-bottom: 0px;
    border-width: 0px;
    background-color: transparent;
}

#profile-existing {
    background: #f5f5f5;
    display: flex;
}

#profile-add-existing {
    padding-bottom: 0.75rem;
}

#profile-add-actions .select-field-caret {
    background: #fff;
    margin: 1rem;
    flex-basis: 100%;
}

@media (min-width: 768px) {
    #profile-add .hidden-txt {
        display: none;
    }
}

@media (min-width: 1024px) {
    #profile-add .hidden-txt {
        display: inline;
    }
}

.settings-password {
    line-height: normal;
    display: flex;
    align-items: center;
    height: 3rem;
    padding: 0 1rem;
    font-size: 1rem;
    border-bottom: 1px solid #aaa;
}

    .settings-password:focus,
    select:focus:not(:disabled),
    input:focus:not(:disabled):not(:disabled),
    textarea:focus:not(:disabled):not(:disabled),
    .checkbox-control:focus .check-box {
        border-color: #333;
    }

.checkbox-control:focus:not(:disabled)
.checkbox-control:focus:not(:disabled)
.switch-control:focus:not(:disabled),
.switch-control:focus:not(:disabled) .slider,
.switch-control:focus:not(:disabled) .slider:before {
    outline: none;
    box-shadow: #fff 0 0 0 1px,rgba(33,33,33,1) 0 0 0 2px !important;
}

.settings-password:selection:not(:disabled),
select:selection:not(:disabled),
input:selection:not(:disabled),
.settings-password:-moz-selection:not(:disabled),
select:-moz-selection:not(:disabled),
input:-moz-selection:not(:disabled),
*:selection:not(:disabled),
*:-moz-selection:not(:disabled) {
    background: rgba(240, 247, 255, 0.8); /* WebKit/Blink Browsers */
}

#content.settings-profile #profile,
#content.settings-communities #communities {
    float: none;
    padding: 0;
    padding-left: 25%;
}

#content.settings-communities .spacer.time-end-arrow {
    color: #555;
    display: inline-block;
}

#content.settings-communities .time-start,
#content.settings-communities .time-end {
    display: inline-block;
    width: 40%;
}

#content.settings-communities .btn-text {
    top: 0.25rem;
}

#content.settings-communities button#community-save {
    float: right
}

#content.settings-communities .form-footer,
#content.settings-profile .form-footer,
#content.resident-alert .form-footer {
    padding-left: 0rem;
    margin-left: 0 !important;
}


.settings-form {
    padding: 0px !important;
    font-size: 0.875rem
}

    .settings-form > .row > div,
    .settings-form > .row > div > .row > div,
    .settings-form .form-block > .row > div {
        padding: 0;
    }

body[data-state="settings-team"] .settings-form > .row,
body[data-state="call-forwarding"] .settings-form > .row,
body[data-state="settings-communities"] .settings-form > .row {
    padding-top: 5.25rem;
}

.settings-form .row.fluid {
    display: flex;
}

.settings-form .col-fluid {
    margin-top: auto;
}
    .settings-form label {
        font-size: 1rem;
        font-weight: normal;
        color: #555;
        display: block;
        user-select: none;
    }

    input[type="text"],
    input[type="file"],
    input[type="number"],
    input[type="password"],
    select,
    textarea {
        width: 100%;
        height: 3rem;
        font-size: 1.125rem;
        text-indent: 0.875rem;
        margin: 0;
        padding: 0;
        border-radius: 0;
        -webkit-appearance: none;
        -moz-appearance: textfield;
        appearance: none;
        background-color: transparent;
        text-overflow: ellipsis;
        float: none;
    }

    input[type="file"] {
        padding-top: 0.5rem;
    }

    .form-block textarea {
        text-indent: 0rem;
        padding: 0.875rem;
        line-height: normal;
        display: block;
        height: 6rem;
        resize: none;
    }

        .form-block .hint {
            margin-top: 0.875rem;
            padding: 0.875rem;
            background-color: #fff;
            border-radius: 3px;
            color: #555;
            border-bottom: 1px solid #ddd;
            box-shadow: -1px 1px 6px rgba(0,0,0,0.05);
            display: grid;
            grid-template-columns: 25% auto;
        }

            .form-block .hint .hint-label {
                font-size: 1rem;
                color: #555;
            }

            .form-block .hint .hint-txt {
                font-size: 0.875rem;
                color: #555;
            }

                .form-block * ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
                    font-weight: 100;
                    color: #555;
                    opacity: 1; /* Firefox */
                }

                .form-block * :-ms-input-placeholder { /* Internet Explorer 10-11 */
                    font-weight: 100;
                    color: #555;
                }

                .form-block * ::-ms-input-placeholder { /* Microsoft Edge */
                    font-weight: 100;
                    color: #555;
                }

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 30px white inset !important;
    background-color: #fff;
}

    .row-btm-spacing {
        margin-bottom: 2rem;
    }

    .select-field-caret {
        position: relative;
    }

        .select-field-caret {
            position: relative;
        }

    .select-field-caret:after {
        content: '';
        position: absolute;
        z-index: 1;
        transform: translateY(-50%);
        top: 50%;
        right: 1rem;
        display: inline-block;
        width: 0;
        height: 0;
        margin-left: 2px;
        vertical-align: middle;
        border-top: 4px dashed;
        border-top: 4px solid\9;
        border-right: 4px solid transparent;
        border-left: 4px solid transparent
    }


.passwordconfirmation-txt-wrapper {
    border: 1px solid #ddd;
    border-radius: 3px;
    margin: 0;
    max-width: 300px;
    margin: 0 auto;
    background-color: #fff;
}

    .passwordconfirmation-txt-wrapper .iconCheckMark {
        border-right: 1px solid #ddd;
        padding: 10px;
        display: table-cell;
        vertical-align: middle;
        font-size: 1.25rem;
        color: #00ca67;
    }

    .passwordconfirmation-txt-wrapper .passwordconfirmation-txt {
        display: table-cell;
        padding: 10px 20px;
        vertical-align: middle;
        line-height: normal;
    }


.form-block {
    margin: 2rem 0;
}

    .form-block > .row {
        padding-bottom: 0.625rem !important;
    }

    .form-block .row > div > label {
        text-indent: 0.875rem;
        line-height: 3rem;
        margin: 0;
        font-size: 1rem;
    }

.form-footer {
    border-top: 1px solid #ddd;
    padding: 2rem 1rem;
    margin: 2rem 0;
    /*margin-left: -9% !important;*/
}

.settings-form .photo-upload {
    width: 16vw;
    text-align: center;
    font-size: 1rem;
    margin: 0 auto;
}

.settings-form .thumbnail {
    position: relative;
    width: 16vw;
    height: 16vw;
    overflow: visible;
    border-radius: 100%;
    margin: 0px auto 1rem;
    background-color: #f9f9f9;
    border: 4px solid #fff;
    box-shadow: 0px 2px 0px #ddd;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat

}

    .settings-form .thumbnail:after {
        content: '';
        display: block;
        position: absolute;
        top: -1px;
        bottom: -1px;
        left: -1px;
        right: -1px;
        height: 102%;
        width: 102%;
        border-radius: 100%;
        border: 1rem solid #f9f9f9
    }

.settings-form .thumbnail img {
    display:none;
}


.photo-upload-content {
    border: 2px dashed #ccc;
    padding: 3.425rem 1rem 2rem;
    background-color: #f9f9f9;
    min-height: 160px;
    font-size: 1rem;
    color: #555
}

.photo-upload-content.drag-over {
    border: 2px dashed #555;
    background-color: #ccc;

}

    .photo-upload-content .fa-upload {
        margin-bottom: 5px;
        font-size: 3rem;
        color: #00ca67;
    }


#settings-modal .glyphicon {
    top: 0px !important;
}

#settings-modal .fileinput-button {
    margin-top: 15px;
}

.settings-form .upload {
    font-size: 8vw;
    position: relative;
    width: 16vw;
    height: 16vw;
    overflow: hidden;
    border-radius: 100%;
    margin: 0 0 1rem;
    color: #ddd;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .settings-form .upload i {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-58%,-52%);
    }

.checkbox-label {
    display: inline-block;
    vertical-align: top;
    padding-left: 20px;
    position: relative;
    margin: 5px 10px;
}

.checkbox-label input {
    position: absolute;
    left: 0;
    top: 0;
}

.settings-form h2 {
    margin: 1.75rem 0 2rem;
    font-size: 1.25rem;
    font-weight: 600;
}
.settings-form button#profile-delete {
    background-color: transparent;
    color: #555;
}

.settings-form button#profile-cancel {
    margin-right: 1rem;
}

.settings-form button#profile-save {
    float: right;
}



/****************************
    Settings Form Tooltip
*****************************/

@media (min-width: 320px) {
    .settings-form .tooltip-legend {
        left: 11px;
        -webkit-transform: translateX(-75%);
        transform: translateX(-75%)
    }
}

@media (min-width: 1024px) {
    .settings-form .tooltip-legend {
        left: 11px;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }
}


.settings-form .tooltip-legend * span {
    display: block;
    line-height: normal;
    text-indent: initial;
}

    .settings-form .tooltip-legend > span:not(:last-child) {
        margin-bottom: 0.75rem;
        padding-bottom: 0.75rem;
        border-bottom: 1px solid #eee;
    }


.settings-form .tooltip-wrapper:hover .tooltip-legend {
    visibility: visible;
    -webkit-opacity: 1;
    opacity: 1;
}

.settings-form .tooltip-title {
    color: #000;
    font-weight: 600;
    padding: 0.25rem;
}

.settings-form .tooltip-description {
    color: #555;
}

.settings-form .caret {
    margin: 0px !important;
    position: absolute;
    top: -4px;
    border-top-color: #555;
}


@media (min-width: 320px) {
    .settings-form .caret {
        left: 50%;
        -webkit-transform: rotateZ(180deg);
        transform: rotateZ(180deg);
    }
}

@media (min-width: 1024px) {
    .settings-form .caret {
        left: 50%;
        -webkit-transform: rotateZ(180deg) translateX(50%);
        transform: rotateZ(180deg) translateX(50%);
    }
}


/**************************
    Button Group Control
***************************/

.radio-button-group {
    display: inline-flex;
    font-weight: normal;
    color: #555;
    border-radius: 3px;
    border: 1px solid #ddd;
}

    .radio-button-group input[type=radio] {
        display: none;
    }

    .radio-button-group label:first-child {
        border-radius: 3px 0 0 3px;
    }

    .radio-button-group label:last-child {
        border-radius: 0 3px 3px 0;
    }

    .radio-button-group label {
        padding: 0.75rem 1.25rem !important;
        margin: 0;
        color: #333 !important;
    }

    .radio-button-group input[type=radio]:checked + label {
        background-color: #00ca67 !important;
        color: #fff !important;
    }


.checkbox-button-group {
    display: inline-flex;
    font-weight: normal;
    color: #555;
    border-radius: 3px;
    border: 1px solid #ddd;
    line-height: 1.5rem;
}

    .checkbox-button-group input[type=checkbox] {
        display: none;
    }

    .checkbox-button-group label:first-child {
        border-radius: 3px 0 0 3px;
    }

    .checkbox-button-group label:last-child {
        border-radius: 0 3px 3px 0;
    }

    .checkbox-button-group label {
        padding: 0.75rem 1.25rem !important;
        margin: 0;
        color: #333 !important;
    }

    .checkbox-button-group input[type=checkbox]:checked + label {
        background-color: #00ca67 !important;
        color: #fff !important;
    }


.button-group {
    display: inline-flex;
    font-weight: normal;
    color: #555;
    border-radius: 3px;
    border: 1px solid #ddd;
}

    .button-group button:first-child {
        border-radius: 3px 0 0 3px;
    }

    .button-group button:last-child {
        border-radius: 0 3px 3px 0;
    }

    .button-group button {
        padding: 6px 20px !important;
        margin: 0;
        color: #333 !important;
        border-width: 0px !important;
        font-size: 1rem;
        background-color: #fff;
    }

        .button-group button.active,
        .button-group button.active:active,
        .button-group button.active:focus {
            background-color: #00ca67 !important;
            color: #fff !important;
        }

/***********************
    Date Control
***********************/

.date-control {
    /*overflow:hidden;
    width: 100%;
    height: auto;*/
    width: 100%;
}   

    .date-control i {
        position: absolute;
        width: 2rem;
        height: 2rem;
        display: flex;
        justify-content: center;
        align-items: center;
        bottom: 0;
        right: 1rem;
    }

    .date-control .input-group-addon {
        background-color: transparent !important;
        border-width: 0 !important;
        color: inherit !important;
        line-height: normal !important;
        position: absolute;
        top: 0;
        right: 1.75rem;
    }

        .date-control .input-group-addon .glyphicon {
            font-size: 1.25rem !important;
            top: 0.308em !important;
        }

    /*Calendar*/
    .date-control .datetimepicker {
        font-size: 0.75rem;
        opacity: 0;
        visibility: hidden;
        will-change: opacity;
        transition: opacity ease-in-out 250ms;
        position: absolute;
        top: 3rem;
        left: 0;
        z-index: 1;
        width: 350px;
        background-color: rgba(255,255,255,1);
        padding: 2rem 2rem;
        box-shadow: 0 5px 10px rgba(0,0,0,.2);
        border-radius: 3px !important;
        border: 1px solid rgba(0,0,0,.2);
    }

    .date-control .datetimepicker.is-visible {
        opacity: 1.0;
        visibility: visible;
    }

        .date-control .datetimepicker * .glyphicon {
            background-color: aliceblue;
        }



/***********************
    Checkbox Control
***********************/

.checkbox-control {
    display: inline-flex !important;
    line-height: 1.25rem !important;
    position: relative;
    max-width: initial;
    outline: none;
    font-size: 1.125rem;
    font-weight: normal !important;
}

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

    .checkbox-control .check-box {
        display: inline-flex;
        height: 20px;
        width: 20px;
        border: 1px solid #aaa;
        border-radius: 10px;
        justify-content: center;
        align-items: center;
        position: relative;
    }

    .checkbox-control:not(.pull-right) .check-box {
        margin-right: 0.75rem;
    }

    .checkbox-control.pull-right .check-box {
        margin-left: 0.75rem;
    }

    .dropdown.open .checkbox-control .check-box {
        z-index: 2;
    }

.checkbox-control .iconCheckMark {
    display: inline-block;
    background-color: #00ca67;
    color: #fff;
    font-size: 10px;
    font-weight: 400;
    width: 21px;
    height: 21px;
    border-radius: 10px;
    opacity: 0;
    text-align: center;
    padding: 5px;
}


.checkbox-control input[type="checkbox"]:checked + .check-box {
    border: 1px solid #00ca67;
}

.checkbox-control input[type="checkbox"]:checked + .check-box .iconCheckMark {
    opacity: 1.0;
}


/***********************
    Switch Control
***********************/
/* The switch - the box around the slider */
.switch-control {
    position: relative;
    display: inline-flex !important;
    width: 3.5rem;
    height: 2.072rem;
    line-height: normal !important;
    text-indent: initial !important;
    font-size: 0rem !important;
    outline: none;
}

    /* Hide default HTML checkbox */
    .switch-control input {
        opacity: 0;
        width: 0;
        height: 0;
    }

/* The slider */
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #aaa;
    -webkit-transition: .4s;
    transition: .4s;
    border-radius: 5rem;
    outline: none;
    scrollbar-highlight-color: none;
    height: 28px;
}

    .slider:before {
        position: absolute;
        content: "";
        width: 1.625rem;
        height: 1.625rem;
        left: 0rem;
        top: 50%;
        background-color: #fff;
        -webkit-transition: .4s;
        transition: .4s;
        border-radius: 100%;
        transform: translateX(.3rem) translateY(-50%);
    }

input:checked + .slider {
    background-color: #00ca67;
}

/*
input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}
*/

input:checked + .slider:before {
    transform: translateX(1.6rem) translateY(-48%);
}

input + .slider:after,
input:checked + .slider:after {
    display: inline-flex;
    font-size: 1rem;
    line-height: 2.125rem;
    color: #333;
    white-space: nowrap;
    position: absolute;
    padding-left: 4.25rem;
    padding-right: 1.25rem;
}

input + .slider:after {
    content: "No";
}

input:checked + .slider:after {
    content: "Yes";
}


/***********************
        Voicemail
***********************/
#email-voicemail-audio {
    width: 100%;
    padding: 0 4rem;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}
/******************************
        Call Forwarding
*******************************/
.call-forwarding {
} .call-forwarding > .row > div, .call-forwarding > .row > div > .row > div, .call-forwarding .form-block > .row > div {
        padding: 0
    } .call-forwarding h2 {
        line-height: normal;
        font-size: 1.75rem;
        font-weight: 600;
        margin: 0 0 3rem;
    }
    /*.call-forwarding h3 {
        margin: 0;
        text-align: center;
        line-height: normal;
        font-size: 1.75rem;
        font-weight: 600;
    }*/
    .call-forwarding h4, .call-forwarding h5 {
        margin: 0 0 1.75rem;
        font-size: 1.25rem;
        font-weight: 500
    } .call-forwarding h5 {
        line-height: 2.25rem;

    }
    .call-forwarding .overview-txt {
        text-align: center;
        margin: 1rem 10%;
        font-size: 1.25rem;
        font-weight: 500;
    }
    .call-forwarding .phone-number {
        margin: 0 0 1.75rem;
        font-size: 1.75rem;
        text-align: center

    }
    .call-forwarding .note {
        margin: 0 auto 0.25rem;
        padding: 10px 20px;
        text-align: center;
        width: 80%;
        border: 1px solid #ddd;
        border-radius: 3px;
        line-height: 1.5rem;
        border: 1px solid #add6ef;
        background-color: #F0F7FF;
    } 
    
    .call-forwarding .note .iconInfo {
        display: block;
        padding: 1rem;
        font-size: 1.5rem;
        color: #555;
    }
    .call-forwarding ul {
/*        margin-bottom: 1.75rem;*/
    }


    .call-forwarding .sub-list > li{
        margin-top: 0.5rem;
    }

    .call-forwarding ul > li {
        margin-bottom: 0.5rem;
        font-size: 1rem
    }
/***********************
        Weblet
***********************/
.fileupload-buttonbar {
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: center;
    margin-top: 65px;
} .fileupload-buttonbar .glyphicon {
    font-size: 16px !important;
    top: 1px !important;
} .btn-primary .glyphicon {
    font-size: 16px !important;
    top: 1px !important;
} .fileupload-processing {
    text-align: center !important;
} .fileupload-buttonbar .btn-success {
    color: #fff;
    background-color: #00ca67 !important;
    border-color: transparent !important;
} .body-content footer {
    text-align: center;
} .btn, .btn-primary, .btn-default, .btn-danger, .btn-warning {
    outline: none !important;
} .form-control {
    border: 0px solid #ccc !important;
    border-bottom: 1px solid #ddd !important;
    border-radius: 0px !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
} .events {
    position: relative;
    display: inline-block;
} .events:hover .event-details {
    visibility: visible;
    opacity: 1;
} .events .event-details {
    visibility: hidden;
    position: absolute;
    width: 240px;
    background-color: #DDD;
    color: #000;
    text-align: center;
    padding: 5px 0;
    border-radius: 6px;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.3s;
} .events-left {
    top: -15px;
    bottom: auto;
    right: 128%;
} .events-left::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 100%;
    margin-top: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent transparent #DDD;
} .bold-underline{
    font-weight: bold;
    text-decoration: underline;
} .typeahead, .tt-query, .tt-hint {
    width: 396px !important;
    height: 30px;
    padding: 8px 12px;
    font-size: 24px;
    line-height: 30px;
    border: 2px solid #ccc;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    outline: none;
} .typeahead {
    background-color: #fff;
} .typeahead:focus {
        border: 2px solid #00CA67;
    } .tt-query {
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
} .tt-hint {
    color: #555;
} .tt-menu {
    width: 422px;
    margin: 12px 0;
    padding: 8px 0;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, 0.2);
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
    -moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
    box-shadow: 0 5px 10px rgba(0,0,0,.2);
} .tt-suggestion {
    padding: 3px 20px;
    font-size: 18px;
    line-height: 24px;
} .tt-suggestion:hover {
        cursor: pointer;
        color: #fff;
        background-color: #00CA67;
    } .tt-suggestion.tt-cursor {
        color: #fff;
        background-color: #00CA67;
    } .tt-suggestion p {
        margin: 0;
    } #editor-container {
    height: 350px;
    padding: 5px;
} .ql-container {
    height: 290px !important;
} #email-modal .modal-dialog {
    max-width: none;
    width: 80%;
} .email-content {
    visibility: hidden;
} .gi-2x {
    font-size: 2em !important;
} .gi-3x {
    font-size: 3em !important;
} .gi-4x {
    font-size: 4em !important;
} .gi-5x {
    font-size: 5em !important;

} .pipe-line .header {
    background-color: #FFF;
    color: #000;
    border-radius: 5px;
    font-size: 1.5em;
    padding: 5px;
    text-align: center;
    margin-bottom: 10px;
} 

  .pipe-line .row {
      display: flex;
      flex-wrap: wrap;
  }
  
  .pipe-line .apartment {
    border-radius: 5px;
    border: solid 2px #555;
    background-color: #FFF;
    color: #000;
    padding: 5px;
    text-align: center;
    width: 19% !important;
    margin: 5px;
}



/************************************/
/**   Bootstrap Utility Classes    **/
/************************************/

.m-0 {
    margin: 0 !important;
}

.mt-0,
.my-0 {
    margin-top: 0 !important;
}

.mr-0,
.mx-0 {
    margin-right: 0 !important;
}

.mb-0,
.my-0 {
    margin-bottom: 0 !important;
}

.ml-0,
.mx-0 {
    margin-left: 0 !important;
}

.m-1 {
    margin: 0.25rem !important;
}

.mt-1,
.my-1 {
    margin-top: 0.25rem !important;
}

.mr-1,
.mx-1 {
    margin-right: 0.25rem !important;
}

.mb-1,
.my-1 {
    margin-bottom: 0.25rem !important;
}

.ml-1,
.mx-1 {
    margin-left: 0.25rem !important;
}

.m-2 {
    margin: 0.5rem !important;
}

.mt-2,
.my-2 {
    margin-top: 0.5rem !important;
}

.mr-2,
.mx-2 {
    margin-right: 0.5rem !important;
}

.mb-2,
.my-2 {
    margin-bottom: 0.5rem !important;
}

.ml-2,
.mx-2 {
    margin-left: 0.5rem !important;
}

.m-3 {
    margin: 1rem !important;
}

.mt-3,
.my-3 {
    margin-top: 1rem !important;
}

.mr-3,
.mx-3 {
    margin-right: 1rem !important;
}

.mb-3,
.my-3 {
    margin-bottom: 1rem !important;
}

.ml-3,
.mx-3 {
    margin-left: 1rem !important;
}

.m-4 {
    margin: 1.5rem !important;
}

.mt-4,
.my-4 {
    margin-top: 1.5rem !important;
}

.mr-4,
.mx-4 {
    margin-right: 1.5rem !important;
}

.mb-4,
.my-4 {
    margin-bottom: 1.5rem !important;
}

.ml-4,
.mx-4 {
    margin-left: 1.5rem !important;
}

.m-5 {
    margin: 3rem !important;
}

.mt-5,
.my-5 {
    margin-top: 3rem !important;
}

.mr-5,
.mx-5 {
    margin-right: 3rem !important;
}

.mb-5,
.my-5 {
    margin-bottom: 3rem !important;
}

.ml-5,
.mx-5 {
    margin-left: 3rem !important;
}

.p-0 {
    padding: 0 !important;
}

.pt-0,
.py-0 {
    padding-top: 0 !important;
}

.pr-0,
.px-0 {
    padding-right: 0 !important;
}

.pb-0,
.py-0 {
    padding-bottom: 0 !important;
}

.pl-0,
.px-0 {
    padding-left: 0 !important;
}

.p-1 {
    padding: 0.25rem !important;
}

.pt-1,
.py-1 {
    padding-top: 0.25rem !important;
}

.pr-1,
.px-1 {
    padding-right: 0.25rem !important;
}

.pb-1,
.py-1 {
    padding-bottom: 0.25rem !important;
}

.pl-1,
.px-1 {
    padding-left: 0.25rem !important;
}

.p-2 {
    padding: 0.5rem !important;
}

.pt-2,
.py-2 {
    padding-top: 0.5rem !important;
}

.pr-2,
.px-2 {
    padding-right: 0.5rem !important;
}

.pb-2,
.py-2 {
    padding-bottom: 0.5rem !important;
}

.pl-2,
.px-2 {
    padding-left: 0.5rem !important;
}

.p-3 {
    padding: 1rem !important;
}

.pt-3,
.py-3 {
    padding-top: 1rem !important;
}

.pr-3,
.px-3 {
    padding-right: 1rem !important;
}

.pb-3,
.py-3 {
    padding-bottom: 1rem !important;
}

.pl-3,
.px-3 {
    padding-left: 1rem !important;
}

.p-4 {
    padding: 1.5rem !important;
}

.pt-4,
.py-4 {
    padding-top: 1.5rem !important;
}

.pr-4,
.px-4 {
    padding-right: 1.5rem !important;
}

.pb-4,
.py-4 {
    padding-bottom: 1.5rem !important;
}

.pl-4,
.px-4 {
    padding-left: 1.5rem !important;
}

.p-5 {
    padding: 3rem !important;
}

.pt-5,
.py-5 {
    padding-top: 3rem !important;
}

.pr-5,
.px-5 {
    padding-right: 3rem !important;
}

.pb-5,
.py-5 {
    padding-bottom: 3rem !important;
}

.pl-5,
.px-5 {
    padding-left: 3rem !important;
}

.m-auto {
    margin: auto !important;
}

.mt-auto,
.my-auto {
    margin-top: auto !important;
}

.mr-auto,
.mx-auto {
    margin-right: auto !important;
}

.mb-auto,
.my-auto {
    margin-bottom: auto !important;
}

.ml-auto,
.mx-auto {
    margin-left: auto !important;
}

@media (min-width: 576px) {
    .m-sm-0 {
        margin: 0 !important;
    }

    .mt-sm-0,
    .my-sm-0 {
        margin-top: 0 !important;
    }

    .mr-sm-0,
    .mx-sm-0 {
        margin-right: 0 !important;
    }

    .mb-sm-0,
    .my-sm-0 {
        margin-bottom: 0 !important;
    }

    .ml-sm-0,
    .mx-sm-0 {
        margin-left: 0 !important;
    }

    .m-sm-1 {
        margin: 0.25rem !important;
    }

    .mt-sm-1,
    .my-sm-1 {
        margin-top: 0.25rem !important;
    }

    .mr-sm-1,
    .mx-sm-1 {
        margin-right: 0.25rem !important;
    }

    .mb-sm-1,
    .my-sm-1 {
        margin-bottom: 0.25rem !important;
    }

    .ml-sm-1,
    .mx-sm-1 {
        margin-left: 0.25rem !important;
    }

    .m-sm-2 {
        margin: 0.5rem !important;
    }

    .mt-sm-2,
    .my-sm-2 {
        margin-top: 0.5rem !important;
    }

    .mr-sm-2,
    .mx-sm-2 {
        margin-right: 0.5rem !important;
    }

    .mb-sm-2,
    .my-sm-2 {
        margin-bottom: 0.5rem !important;
    }

    .ml-sm-2,
    .mx-sm-2 {
        margin-left: 0.5rem !important;
    }

    .m-sm-3 {
        margin: 1rem !important;
    }

    .mt-sm-3,
    .my-sm-3 {
        margin-top: 1rem !important;
    }

    .mr-sm-3,
    .mx-sm-3 {
        margin-right: 1rem !important;
    }

    .mb-sm-3,
    .my-sm-3 {
        margin-bottom: 1rem !important;
    }

    .ml-sm-3,
    .mx-sm-3 {
        margin-left: 1rem !important;
    }

    .m-sm-4 {
        margin: 1.5rem !important;
    }

    .mt-sm-4,
    .my-sm-4 {
        margin-top: 1.5rem !important;
    }

    .mr-sm-4,
    .mx-sm-4 {
        margin-right: 1.5rem !important;
    }

    .mb-sm-4,
    .my-sm-4 {
        margin-bottom: 1.5rem !important;
    }

    .ml-sm-4,
    .mx-sm-4 {
        margin-left: 1.5rem !important;
    }

    .m-sm-5 {
        margin: 3rem !important;
    }

    .mt-sm-5,
    .my-sm-5 {
        margin-top: 3rem !important;
    }

    .mr-sm-5,
    .mx-sm-5 {
        margin-right: 3rem !important;
    }

    .mb-sm-5,
    .my-sm-5 {
        margin-bottom: 3rem !important;
    }

    .ml-sm-5,
    .mx-sm-5 {
        margin-left: 3rem !important;
    }

    .p-sm-0 {
        padding: 0 !important;
    }

    .pt-sm-0,
    .py-sm-0 {
        padding-top: 0 !important;
    }

    .pr-sm-0,
    .px-sm-0 {
        padding-right: 0 !important;
    }

    .pb-sm-0,
    .py-sm-0 {
        padding-bottom: 0 !important;
    }

    .pl-sm-0,
    .px-sm-0 {
        padding-left: 0 !important;
    }

    .p-sm-1 {
        padding: 0.25rem !important;
    }

    .pt-sm-1,
    .py-sm-1 {
        padding-top: 0.25rem !important;
    }

    .pr-sm-1,
    .px-sm-1 {
        padding-right: 0.25rem !important;
    }

    .pb-sm-1,
    .py-sm-1 {
        padding-bottom: 0.25rem !important;
    }

    .pl-sm-1,
    .px-sm-1 {
        padding-left: 0.25rem !important;
    }

    .p-sm-2 {
        padding: 0.5rem !important;
    }

    .pt-sm-2,
    .py-sm-2 {
        padding-top: 0.5rem !important;
    }

    .pr-sm-2,
    .px-sm-2 {
        padding-right: 0.5rem !important;
    }

    .pb-sm-2,
    .py-sm-2 {
        padding-bottom: 0.5rem !important;
    }

    .pl-sm-2,
    .px-sm-2 {
        padding-left: 0.5rem !important;
    }

    .p-sm-3 {
        padding: 1rem !important;
    }

    .pt-sm-3,
    .py-sm-3 {
        padding-top: 1rem !important;
    }

    .pr-sm-3,
    .px-sm-3 {
        padding-right: 1rem !important;
    }

    .pb-sm-3,
    .py-sm-3 {
        padding-bottom: 1rem !important;
    }

    .pl-sm-3,
    .px-sm-3 {
        padding-left: 1rem !important;
    }

    .p-sm-4 {
        padding: 1.5rem !important;
    }

    .pt-sm-4,
    .py-sm-4 {
        padding-top: 1.5rem !important;
    }

    .pr-sm-4,
    .px-sm-4 {
        padding-right: 1.5rem !important;
    }

    .pb-sm-4,
    .py-sm-4 {
        padding-bottom: 1.5rem !important;
    }

    .pl-sm-4,
    .px-sm-4 {
        padding-left: 1.5rem !important;
    }

    .p-sm-5 {
        padding: 3rem !important;
    }

    .pt-sm-5,
    .py-sm-5 {
        padding-top: 3rem !important;
    }

    .pr-sm-5,
    .px-sm-5 {
        padding-right: 3rem !important;
    }

    .pb-sm-5,
    .py-sm-5 {
        padding-bottom: 3rem !important;
    }

    .pl-sm-5,
    .px-sm-5 {
        padding-left: 3rem !important;
    }

    .m-sm-auto {
        margin: auto !important;
    }

    .mt-sm-auto,
    .my-sm-auto {
        margin-top: auto !important;
    }

    .mr-sm-auto,
    .mx-sm-auto {
        margin-right: auto !important;
    }

    .mb-sm-auto,
    .my-sm-auto {
        margin-bottom: auto !important;
    }

    .ml-sm-auto,
    .mx-sm-auto {
        margin-left: auto !important;
    }
}

@media (min-width: 768px) {
    .m-md-0 {
        margin: 0 !important;
    }

    .mt-md-0,
    .my-md-0 {
        margin-top: 0 !important;
    }

    .mr-md-0,
    .mx-md-0 {
        margin-right: 0 !important;
    }

    .mb-md-0,
    .my-md-0 {
        margin-bottom: 0 !important;
    }

    .ml-md-0,
    .mx-md-0 {
        margin-left: 0 !important;
    }

    .m-md-1 {
        margin: 0.25rem !important;
    }

    .mt-md-1,
    .my-md-1 {
        margin-top: 0.25rem !important;
    }

    .mr-md-1,
    .mx-md-1 {
        margin-right: 0.25rem !important;
    }

    .mb-md-1,
    .my-md-1 {
        margin-bottom: 0.25rem !important;
    }

    .ml-md-1,
    .mx-md-1 {
        margin-left: 0.25rem !important;
    }

    .m-md-2 {
        margin: 0.5rem !important;
    }

    .mt-md-2,
    .my-md-2 {
        margin-top: 0.5rem !important;
    }

    .mr-md-2,
    .mx-md-2 {
        margin-right: 0.5rem !important;
    }

    .mb-md-2,
    .my-md-2 {
        margin-bottom: 0.5rem !important;
    }

    .ml-md-2,
    .mx-md-2 {
        margin-left: 0.5rem !important;
    }

    .m-md-3 {
        margin: 1rem !important;
    }

    .mt-md-3,
    .my-md-3 {
        margin-top: 1rem !important;
    }

    .mr-md-3,
    .mx-md-3 {
        margin-right: 1rem !important;
    }

    .mb-md-3,
    .my-md-3 {
        margin-bottom: 1rem !important;
    }

    .ml-md-3,
    .mx-md-3 {
        margin-left: 1rem !important;
    }

    .m-md-4 {
        margin: 1.5rem !important;
    }

    .mt-md-4,
    .my-md-4 {
        margin-top: 1.5rem !important;
    }

    .mr-md-4,
    .mx-md-4 {
        margin-right: 1.5rem !important;
    }

    .mb-md-4,
    .my-md-4 {
        margin-bottom: 1.5rem !important;
    }

    .ml-md-4,
    .mx-md-4 {
        margin-left: 1.5rem !important;
    }

    .m-md-5 {
        margin: 3rem !important;
    }

    .mt-md-5,
    .my-md-5 {
        margin-top: 3rem !important;
    }

    .mr-md-5,
    .mx-md-5 {
        margin-right: 3rem !important;
    }

    .mb-md-5,
    .my-md-5 {
        margin-bottom: 3rem !important;
    }

    .ml-md-5,
    .mx-md-5 {
        margin-left: 3rem !important;
    }

    .p-md-0 {
        padding: 0 !important;
    }

    .pt-md-0,
    .py-md-0 {
        padding-top: 0 !important;
    }

    .pr-md-0,
    .px-md-0 {
        padding-right: 0 !important;
    }

    .pb-md-0,
    .py-md-0 {
        padding-bottom: 0 !important;
    }

    .pl-md-0,
    .px-md-0 {
        padding-left: 0 !important;
    }

    .p-md-1 {
        padding: 0.25rem !important;
    }

    .pt-md-1,
    .py-md-1 {
        padding-top: 0.25rem !important;
    }

    .pr-md-1,
    .px-md-1 {
        padding-right: 0.25rem !important;
    }

    .pb-md-1,
    .py-md-1 {
        padding-bottom: 0.25rem !important;
    }

    .pl-md-1,
    .px-md-1 {
        padding-left: 0.25rem !important;
    }

    .p-md-2 {
        padding: 0.5rem !important;
    }

    .pt-md-2,
    .py-md-2 {
        padding-top: 0.5rem !important;
    }

    .pr-md-2,
    .px-md-2 {
        padding-right: 0.5rem !important;
    }

    .pb-md-2,
    .py-md-2 {
        padding-bottom: 0.5rem !important;
    }

    .pl-md-2,
    .px-md-2 {
        padding-left: 0.5rem !important;
    }

    .p-md-3 {
        padding: 1rem !important;
    }

    .pt-md-3,
    .py-md-3 {
        padding-top: 1rem !important;
    }

    .pr-md-3,
    .px-md-3 {
        padding-right: 1rem !important;
    }

    .pb-md-3,
    .py-md-3 {
        padding-bottom: 1rem !important;
    }

    .pl-md-3,
    .px-md-3 {
        padding-left: 1rem !important;
    }

    .p-md-4 {
        padding: 1.5rem !important;
    }

    .pt-md-4,
    .py-md-4 {
        padding-top: 1.5rem !important;
    }

    .pr-md-4,
    .px-md-4 {
        padding-right: 1.5rem !important;
    }

    .pb-md-4,
    .py-md-4 {
        padding-bottom: 1.5rem !important;
    }

    .pl-md-4,
    .px-md-4 {
        padding-left: 1.5rem !important;
    }

    .p-md-5 {
        padding: 3rem !important;
    }

    .pt-md-5,
    .py-md-5 {
        padding-top: 3rem !important;
    }

    .pr-md-5,
    .px-md-5 {
        padding-right: 3rem !important;
    }

    .pb-md-5,
    .py-md-5 {
        padding-bottom: 3rem !important;
    }

    .pl-md-5,
    .px-md-5 {
        padding-left: 3rem !important;
    }

    .m-md-auto {
        margin: auto !important;
    }

    .mt-md-auto,
    .my-md-auto {
        margin-top: auto !important;
    }

    .mr-md-auto,
    .mx-md-auto {
        margin-right: auto !important;
    }

    .mb-md-auto,
    .my-md-auto {
        margin-bottom: auto !important;
    }

    .ml-md-auto,
    .mx-md-auto {
        margin-left: auto !important;
    }
}

@media (min-width: 992px) {
    .m-lg-0 {
        margin: 0 !important;
    }

    .mt-lg-0,
    .my-lg-0 {
        margin-top: 0 !important;
    }

    .mr-lg-0,
    .mx-lg-0 {
        margin-right: 0 !important;
    }

    .mb-lg-0,
    .my-lg-0 {
        margin-bottom: 0 !important;
    }

    .ml-lg-0,
    .mx-lg-0 {
        margin-left: 0 !important;
    }

    .m-lg-1 {
        margin: 0.25rem !important;
    }

    .mt-lg-1,
    .my-lg-1 {
        margin-top: 0.25rem !important;
    }

    .mr-lg-1,
    .mx-lg-1 {
        margin-right: 0.25rem !important;
    }

    .mb-lg-1,
    .my-lg-1 {
        margin-bottom: 0.25rem !important;
    }

    .ml-lg-1,
    .mx-lg-1 {
        margin-left: 0.25rem !important;
    }

    .m-lg-2 {
        margin: 0.5rem !important;
    }

    .mt-lg-2,
    .my-lg-2 {
        margin-top: 0.5rem !important;
    }

    .mr-lg-2,
    .mx-lg-2 {
        margin-right: 0.5rem !important;
    }

    .mb-lg-2,
    .my-lg-2 {
        margin-bottom: 0.5rem !important;
    }

    .ml-lg-2,
    .mx-lg-2 {
        margin-left: 0.5rem !important;
    }

    .m-lg-3 {
        margin: 1rem !important;
    }

    .mt-lg-3,
    .my-lg-3 {
        margin-top: 1rem !important;
    }

    .mr-lg-3,
    .mx-lg-3 {
        margin-right: 1rem !important;
    }

    .mb-lg-3,
    .my-lg-3 {
        margin-bottom: 1rem !important;
    }

    .ml-lg-3,
    .mx-lg-3 {
        margin-left: 1rem !important;
    }

    .m-lg-4 {
        margin: 1.5rem !important;
    }

    .mt-lg-4,
    .my-lg-4 {
        margin-top: 1.5rem !important;
    }

    .mr-lg-4,
    .mx-lg-4 {
        margin-right: 1.5rem !important;
    }

    .mb-lg-4,
    .my-lg-4 {
        margin-bottom: 1.5rem !important;
    }

    .ml-lg-4,
    .mx-lg-4 {
        margin-left: 1.5rem !important;
    }

    .m-lg-5 {
        margin: 3rem !important;
    }

    .mt-lg-5,
    .my-lg-5 {
        margin-top: 3rem !important;
    }

    .mr-lg-5,
    .mx-lg-5 {
        margin-right: 3rem !important;
    }

    .mb-lg-5,
    .my-lg-5 {
        margin-bottom: 3rem !important;
    }

    .ml-lg-5,
    .mx-lg-5 {
        margin-left: 3rem !important;
    }

    .p-lg-0 {
        padding: 0 !important;
    }

    .pt-lg-0,
    .py-lg-0 {
        padding-top: 0 !important;
    }

    .pr-lg-0,
    .px-lg-0 {
        padding-right: 0 !important;
    }

    .pb-lg-0,
    .py-lg-0 {
        padding-bottom: 0 !important;
    }

    .pl-lg-0,
    .px-lg-0 {
        padding-left: 0 !important;
    }

    .p-lg-1 {
        padding: 0.25rem !important;
    }

    .pt-lg-1,
    .py-lg-1 {
        padding-top: 0.25rem !important;
    }

    .pr-lg-1,
    .px-lg-1 {
        padding-right: 0.25rem !important;
    }

    .pb-lg-1,
    .py-lg-1 {
        padding-bottom: 0.25rem !important;
    }

    .pl-lg-1,
    .px-lg-1 {
        padding-left: 0.25rem !important;
    }

    .p-lg-2 {
        padding: 0.5rem !important;
    }

    .pt-lg-2,
    .py-lg-2 {
        padding-top: 0.5rem !important;
    }

    .pr-lg-2,
    .px-lg-2 {
        padding-right: 0.5rem !important;
    }

    .pb-lg-2,
    .py-lg-2 {
        padding-bottom: 0.5rem !important;
    }

    .pl-lg-2,
    .px-lg-2 {
        padding-left: 0.5rem !important;
    }

    .p-lg-3 {
        padding: 1rem !important;
    }

    .pt-lg-3,
    .py-lg-3 {
        padding-top: 1rem !important;
    }

    .pr-lg-3,
    .px-lg-3 {
        padding-right: 1rem !important;
    }

    .pb-lg-3,
    .py-lg-3 {
        padding-bottom: 1rem !important;
    }

    .pl-lg-3,
    .px-lg-3 {
        padding-left: 1rem !important;
    }

    .p-lg-4 {
        padding: 1.5rem !important;
    }

    .pt-lg-4,
    .py-lg-4 {
        padding-top: 1.5rem !important;
    }

    .pr-lg-4,
    .px-lg-4 {
        padding-right: 1.5rem !important;
    }

    .pb-lg-4,
    .py-lg-4 {
        padding-bottom: 1.5rem !important;
    }

    .pl-lg-4,
    .px-lg-4 {
        padding-left: 1.5rem !important;
    }

    .p-lg-5 {
        padding: 3rem !important;
    }

    .pt-lg-5,
    .py-lg-5 {
        padding-top: 3rem !important;
    }

    .pr-lg-5,
    .px-lg-5 {
        padding-right: 3rem !important;
    }

    .pb-lg-5,
    .py-lg-5 {
        padding-bottom: 3rem !important;
    }

    .pl-lg-5,
    .px-lg-5 {
        padding-left: 3rem !important;
    }

    .m-lg-auto {
        margin: auto !important;
    }

    .mt-lg-auto,
    .my-lg-auto {
        margin-top: auto !important;
    }

    .mr-lg-auto,
    .mx-lg-auto {
        margin-right: auto !important;
    }

    .mb-lg-auto,
    .my-lg-auto {
        margin-bottom: auto !important;
    }

    .ml-lg-auto,
    .mx-lg-auto {
        margin-left: auto !important;
    }
}

@media (min-width: 1200px) {
    .m-xl-0 {
        margin: 0 !important;
    }

    .mt-xl-0,
    .my-xl-0 {
        margin-top: 0 !important;
    }

    .mr-xl-0,
    .mx-xl-0 {
        margin-right: 0 !important;
    }

    .mb-xl-0,
    .my-xl-0 {
        margin-bottom: 0 !important;
    }

    .ml-xl-0,
    .mx-xl-0 {
        margin-left: 0 !important;
    }

    .m-xl-1 {
        margin: 0.25rem !important;
    }

    .mt-xl-1,
    .my-xl-1 {
        margin-top: 0.25rem !important;
    }

    .mr-xl-1,
    .mx-xl-1 {
        margin-right: 0.25rem !important;
    }

    .mb-xl-1,
    .my-xl-1 {
        margin-bottom: 0.25rem !important;
    }

    .ml-xl-1,
    .mx-xl-1 {
        margin-left: 0.25rem !important;
    }

    .m-xl-2 {
        margin: 0.5rem !important;
    }

    .mt-xl-2,
    .my-xl-2 {
        margin-top: 0.5rem !important;
    }

    .mr-xl-2,
    .mx-xl-2 {
        margin-right: 0.5rem !important;
    }

    .mb-xl-2,
    .my-xl-2 {
        margin-bottom: 0.5rem !important;
    }

    .ml-xl-2,
    .mx-xl-2 {
        margin-left: 0.5rem !important;
    }

    .m-xl-3 {
        margin: 1rem !important;
    }

    .mt-xl-3,
    .my-xl-3 {
        margin-top: 1rem !important;
    }

    .mr-xl-3,
    .mx-xl-3 {
        margin-right: 1rem !important;
    }

    .mb-xl-3,
    .my-xl-3 {
        margin-bottom: 1rem !important;
    }

    .ml-xl-3,
    .mx-xl-3 {
        margin-left: 1rem !important;
    }

    .m-xl-4 {
        margin: 1.5rem !important;
    }

    .mt-xl-4,
    .my-xl-4 {
        margin-top: 1.5rem !important;
    }

    .mr-xl-4,
    .mx-xl-4 {
        margin-right: 1.5rem !important;
    }

    .mb-xl-4,
    .my-xl-4 {
        margin-bottom: 1.5rem !important;
    }

    .ml-xl-4,
    .mx-xl-4 {
        margin-left: 1.5rem !important;
    }

    .m-xl-5 {
        margin: 3rem !important;
    }

    .mt-xl-5,
    .my-xl-5 {
        margin-top: 3rem !important;
    }

    .mr-xl-5,
    .mx-xl-5 {
        margin-right: 3rem !important;
    }

    .mb-xl-5,
    .my-xl-5 {
        margin-bottom: 3rem !important;
    }

    .ml-xl-5,
    .mx-xl-5 {
        margin-left: 3rem !important;
    }

    .p-xl-0 {
        padding: 0 !important;
    }

    .pt-xl-0,
    .py-xl-0 {
        padding-top: 0 !important;
    }

    .pr-xl-0,
    .px-xl-0 {
        padding-right: 0 !important;
    }

    .pb-xl-0,
    .py-xl-0 {
        padding-bottom: 0 !important;
    }

    .pl-xl-0,
    .px-xl-0 {
        padding-left: 0 !important;
    }

    .p-xl-1 {
        padding: 0.25rem !important;
    }

    .pt-xl-1,
    .py-xl-1 {
        padding-top: 0.25rem !important;
    }

    .pr-xl-1,
    .px-xl-1 {
        padding-right: 0.25rem !important;
    }

    .pb-xl-1,
    .py-xl-1 {
        padding-bottom: 0.25rem !important;
    }

    .pl-xl-1,
    .px-xl-1 {
        padding-left: 0.25rem !important;
    }

    .p-xl-2 {
        padding: 0.5rem !important;
    }

    .pt-xl-2,
    .py-xl-2 {
        padding-top: 0.5rem !important;
    }

    .pr-xl-2,
    .px-xl-2 {
        padding-right: 0.5rem !important;
    }

    .pb-xl-2,
    .py-xl-2 {
        padding-bottom: 0.5rem !important;
    }

    .pl-xl-2,
    .px-xl-2 {
        padding-left: 0.5rem !important;
    }

    .p-xl-3 {
        padding: 1rem !important;
    }

    .pt-xl-3,
    .py-xl-3 {
        padding-top: 1rem !important;
    }

    .pr-xl-3,
    .px-xl-3 {
        padding-right: 1rem !important;
    }

    .pb-xl-3,
    .py-xl-3 {
        padding-bottom: 1rem !important;
    }

    .pl-xl-3,
    .px-xl-3 {
        padding-left: 1rem !important;
    }

    .p-xl-4 {
        padding: 1.5rem !important;
    }

    .pt-xl-4,
    .py-xl-4 {
        padding-top: 1.5rem !important;
    }

    .pr-xl-4,
    .px-xl-4 {
        padding-right: 1.5rem !important;
    }

    .pb-xl-4,
    .py-xl-4 {
        padding-bottom: 1.5rem !important;
    }

    .pl-xl-4,
    .px-xl-4 {
        padding-left: 1.5rem !important;
    }

    .p-xl-5 {
        padding: 3rem !important;
    }

    .pt-xl-5,
    .py-xl-5 {
        padding-top: 3rem !important;
    }

    .pr-xl-5,
    .px-xl-5 {
        padding-right: 3rem !important;
    }

    .pb-xl-5,
    .py-xl-5 {
        padding-bottom: 3rem !important;
    }

    .pl-xl-5,
    .px-xl-5 {
        padding-left: 3rem !important;
    }

    .m-xl-auto {
        margin: auto !important;
    }

    .mt-xl-auto,
    .my-xl-auto {
        margin-top: auto !important;
    }

    .mr-xl-auto,
    .mx-xl-auto {
        margin-right: auto !important;
    }

    .mb-xl-auto,
    .my-xl-auto {
        margin-bottom: auto !important;
    }

    .ml-xl-auto,
    .mx-xl-auto {
        margin-left: auto !important;
    }
}

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

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

.d-inline-block {
    display: inline-block !important;
}

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

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

.d-table-row {
    display: table-row !important;
}

.d-table-cell {
    display: table-cell !important;
}

.d-flex {
    display: -ms-flexbox !important;
    display: flex !important;
}

.d-inline-flex {
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
}

.banner-announcement-placeholder {
    height: 50px;
    display: none;
}

.banner-announcement {
    position: fixed;
    width: 100%;
    z-index: 2;
    top: 0;
    color: #FFF;
    background: none #00ca67;
    height: 50px;
    display: none;
    padding: 15px 0px 15px 0px;
}

.banner-announcement #learnMore
{
    color: #FFF;
    background: none #00ca67;
    border: none;
    border: solid 1px #FFF;
    margin-left:  20px;
}

.banner-announcement #close
{
    color: #FFF;
    position: fixed;
    right: 10px;
    font-weight: bold;
    font-size: large;
    background: none;
    border: none;
    top: 11px;
}

.banner-announcement #learnMore,
.banner-announcement #close:focus {
    outline: 0;
}

.btn-role {
    width: 100%;
    background-color: #FFF;
    text-align: left;
    border-bottom: solid 1px #aaa;
}



.btn-role:focus {
    outline: none !important;
    background-color: inherit;
    box-shadow: unset !important;
}

#roleContainer {
    padding-top: 5px;
}

.tag {
    margin-right: 5px;
    margin-top: 5px;
    min-width: unset !important;
    border: none;
    height: 2.5rem;
    padding: 0 2.125rem;
    min-width: 8.5rem;
    line-height: 2.25rem;
    border-radius: 2.25rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 0.875rem;
    font-weight: 600;
    background-color: #CCC !important;
    color: #000 !important;
    text-decoration: none;
    white-space: nowrap;
}

.tag-close {
    margin-left: 10px;
    font-size: medium;
    color: #555;
    cursor: pointer;
}

.close {
    font-size: 30px;
    font-weight: 400;
}

.ckbRegional {
    padding: 10px;
}

.ckbRegional input {
    margin-right: 10px;
}

.team-list-scroll {
    overflow-y: auto;
    max-height: 450px;
}

@media (max-height: 600px) {
    .team-list-scroll {
        overflow-y: auto;
        max-height: 300px;
    }
}

@media  (min-height: 601px)  {
    .team-list-scroll {
        overflow-y: auto;
        max-height: 400px;
    }
}

@media (min-height: 701px) {
    .team-list-scroll {
        overflow-y: auto;
        max-height: 450px;
    }
}

@media (min-height: 801px) {
    .team-list-scroll {
        overflow-y: auto;
        max-height: 500px;
    }
}

@media (min-height: 901px) {
    .team-list-scroll {
        overflow-y: auto;
        max-height: 550px;
    }
}


.sync-container {
    max-height: 350px;
    overflow-y: auto;
}

.sync-border {
    padding: 1rem;
    border: 1px solid #ddd;
    margin-top: 10px;
    margin-bottom: 10px;
}

.sync-row {
    border-bottom: 1px solid #ddd;
}

#user-sync {
    border-radius: 12px !important;
    height: 24px !important;
    font-size: 12px !important;
    font-weight: normal;
    line-height: 16px !important;
    border: 1px solid rgb(226, 226, 226) !important;
    color: #555 !important;
    background-color: #FFF !important;
    padding-right: 2px;
    min-width: unset;
    padding-left: 7px;
}

#user-sync .circle {
    height: 16px;
    border-radius: 8px;
    min-width: 16px;
    background-color: rgb(226, 226, 226) !important;
    text-align: center;
    position: relative;
    color: #555;
    font-size: 19px;
    margin-left: 10px;
    font-weight: 600;
    padding-top: 2px;
}

.modal-dialog, .modal-content {
    max-height: 95%;
}

#user-sync-modal {
    padding: 0 !important;
}

#user-sync-modal .modal-dialog {
    width: 100%;
    max-width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

#user-sync-modal .modal-content {
    height: auto;
    min-height: 100%;
    border: 0 none;
    border-radius: 0;
    box-shadow: none;
    text-align: center;
}

#step-create-audio-1 .scrollable {
    overflow-y: auto;
}

#step-create-audio-1,
#step-upload-audio-1,
#step-schedule,
#step-recipients {
    overflow-y: auto;
    height: 90vh !important;    
    max-height: 845px;
}


#step-create-audio-1 .scrollable {
    height: calc(90vh - 180px);
}

#photo-upload-label {
    margin-top: 5px; 
    margin-left: 15px;
}

#step-create-audio-1 .toolbar,
#step-upload-audio-1 .toolbar,
#step-schedule .toolbar,
#step-recipients .toolbar {
    position: absolute;
    bottom: 24px;
    width: 575px;
}

#step-schedule * ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    font-weight: 600;
    font-size: 14px !important;
    color: #555;
    opacity: 1; /* Firefox */
}

#step-schedule  * :-ms-input-placeholder { /* Internet Explorer 10-11 */
    font-weight: 600;
    font-size: 16px !important;
    color: #555;
}

#step-schedule * ::-ms-input-placeholder { /* Microsoft Edge */
        font-size: 16px !important;
    font-weight: 600;
    color: #555;
}

#step-schedule .icon {
    margin-top: 3px;
    margin-right: 0px;
    padding-left: 3px !important;
}

#step-schedule .input {
    padding-left: 25px;
}

.community-broadcast #confirm-modal .modal-content,
.corporate-broadcast #confirm-modal .modal-content {
    width: 80%;
    margin-left: 10%;
}

.community-broadcast #confirm-modal .close,
.corporate-broadcast #confirm-modal .close {
    display: block !important;
}


.community-broadcast .datepicker,
.corporate-broadcast .datepicker {
    margin-top: 50px;
    /*box-shadow: unset !important;
    -webkit-box-shadow: unset !important;
    background-clip: unset !important;
    -webkit-background-clip: unset !important;*/
}

.community-broadcast .datepicker-switch,
.corporate-broadcast .datepicker-switch {
    text-align: center;
}

.community-broadcast .time-wrapper,
.corporate-broadcast .time-wrapper {
    border: solid 1px #ECEEEF;
    height: 170px;
    position: absolute;
    width: 148px;
    border-radius: 8px;
    margin-top: 4px;
    display: none;
    /*box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
    -webkit-box-shadow: 0 6px 12px rgb(0 0 0 / 18%);*/
}

.community-broadcast .ui-timepicker-wrapper,
.corporate-broadcast .ui-timepicker-wrapper {
    position: relative !important;
    margin-left: 10px !important;
    margin-top: 10px !important;
    box-shadow: none !important;
    top: unset !important;
    left: unset !important;
}

#broadcastTime1,
#expiration-period1 {
    font-size: 16px !important;
    border-bottom: unset !important;
    text-indent: unset !important;
}

#broadcastDate,
#broadcastTime1,
#expiration-period1 {
    height: 20px;
}

#step-schedule .select-field-caret::after {
    display: none;
}

.voice-selection {
    background-color: #f5f5f5;
    border-radius: 4px;
    margin-bottom: 10px;
}
.voice-selection label {
    font-weight: 400;
}

.date-selector,
.time-selector,
.duration-selector {
    margin-right: 50px !important;
    border: 1px solid #FFF;
}

.date-selector.active,
.time-selector.active,
.duration-selector.active {
    background: #F5F6F7;
    border-radius: 32px;
}

.message-invalid {
    line-height: 1rem;
}

.date-selector.invalid,
.time-selector.invalid,
.duration-selector.invalid {
    border: solid 1px red !important;
    border-radius: 32px;
}

.datepicker-days .prev,
.datepicker-days .next {
    cursor: pointer;
}

.datepicker-days .day {
    padding: 0;
    text-align:center;
    width: 30px;
    height: 30px;
    cursor: pointer;
}

.datepicker-days .day.active {
    background: #00CA67;
    color: #fff;
    border-radius: 15px;
}

.datepicker-days .day.today {
    background: #ddd;
    color: #fff;
    border-radius: 15px;
}

#step-recipients .tableFixHead {
    padding-right: 20px;
    margin-right: -37px;
    height: 365px;
    margin-bottom: 10px;
}

#step-recipients .search-icon {
    margin-top: 7px;
    margin-left: -20px;
}

#step-recipients .search-text {
    margin-left: -20px;
}

.community-broadcast-delivery-method.invalid {
    border: solid 1px red;
    color: #555;
}

.community-broadcast-delivery-method .sms-limit {
    font-size: 10px;
    color: red;
}


#settings-modal .modal-header,
#alert-modal .modal-header,
#confirm-modal .modal-header,
#add-note-modal .modal-header {
    background: unset;
    font-weight: 600;
}

#settings-modal .modal-header h4,
#alert-modal .modal-header h4,
#confirm-modal .modal-header h4,
#add-note-modal .modal-header h4{
    font-weight: 600;
}


#settings-modal .modal-header .close,
#alert-modal .modal-header .close,
#confirm-modal .modal-header .close,
#add-note-modal .modal-header .close{
    /*display: none;*/
}

#settings-modal .modal-content,
#alert-modal .modal-content,
#confirm-modal .modal-content,
#add-note-3632 .modal-content {
    width: 500px;
    padding: 20px;
}

#settings-modal .modal-title,
#alert-modal .modal-title,
#confirm-modal .modal-title,
#add-note-modal .modal-title {
    padding-top: 10px;
}

#settings-modal .modal-body,
#alert-modal .modal-body,
#confirm-modal .modal-body,
#add-note-modal .modal-body {
    margin-top: 5px;
}

#settings-modal .toolbar
{
    margin-top: 20px;
    width: 100%;
}

.delete-profile .toolbar,
#confirm-modal .toolbar {
    margin-bottom: 30px;
    width: 100%;
    padding: 15px;
}
.delete-profile .toolbar {
    margin-bottom: 0;
}

#confirm-modal .btn-primary {
    background-color: red;
}


#community-broadcast-history-list .checkbox-control .check-box {
    margin-top: 8px;
}

#community-broadcast-history-list .checkbox-control .iconCheckMark {
    margin-top: 0;
}

#community-broadcast-history-list .methods {
    width: 80px;
}

.broadcast-history-recipients .tooltip-wrapper {
    margin-right: 5px;
}

.file-upload-container {
    background-color: #ddd;
    border-radius: 16px;
    padding: 5px;
    margin-bottom: 5px;
    width: 95% !important;
}

.file-upload-container .file-upload-remove {
    font-size: 24px;
    margin-top: 2px;
    cursor: pointer;
}

@media (max-height: 800px) {
    .broadcast-history-recipients {
        max-height: 275px;
    }
}

@media (max-height: 750px) {
    .broadcast-history-recipients {
        max-height: 240px;
    }

    #step-recipients .tableFixHead {
        height: 325px;
    }
}



@media (max-height: 700px) {
    .broadcast-history-recipients {
        max-height: 225px;
    }

    #step-recipients .tableFixHead {
        height: 285px;
    }
}


@media (max-height: 650px) {

    #step-recipients .tableFixHead {
        height: 245px;
    }
}

.broadcast-history-toolbar {
    background-color: #D9F7E8;
    border-radius: 100px;
    width: 489px;
    height: 56px;
    /*padding: 20px 24px;*/
    position: fixed;
    bottom: 48px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    color: #00ca67;
    font-size: 14px;
    font-weight: 600;
    display: none;
    padding-left: 24px;
}


/*.broadcast-history-toolbar .archive,
.broadcast-history-toolbar .delete {
    margin-right: 5px;
    margin-top: -4px;
}*/

.broadcast-history-toolbar .broadcast-count,
.broadcast-history-toolbar .archive-button,
.broadcast-history-toolbar .delete-button {
    border-radius: 24px;
    padding-top: 12px;
    /*top: -14px;*/
    margin-top: 6px;
    height: 44px;
    max-width: 195px;
}

.broadcast-history-toolbar .archive-button {
    padding-left: 12px;
    width: 100px;
    margin-right: 12px;
}

.broadcast-history-toolbar .archive-button.unarchive {
    width: 125px;
}


.broadcast-history-toolbar .archive-button:hover,
.broadcast-history-toolbar .delete-button:hover {
    background-color: #E6F7F8;
    cursor: pointer;
}


#broadcast-menu {
    right: unset !important;
    width: 135px;
    font-size: 1rem;
}

#broadcast-menu a{
    padding: 5px 15px;
    display: block;
}

.broadcast-history-toolbar .circle {
    width: 25px;
    height: 20px;
    color: #E6F7F8;
    background-color: #00ca67;
    border-radius: 100px;
    padding: 2px 8px;
}

#community-broadcast-history-list tbody tr td {
    border-top: unset !important;
}

#community-broadcast-history-list tr {
    border-bottom: #D9DDE0 solid 1px;
}


#community-broadcast-history-list tbody tr:last-child {
    border-bottom: unset !important;
}

.instant-notification .tooltip-cta {
    left: 8px;
}

.instant-notification .tooltip-legend {
    width: 220px;
}

.instant-notification .tooltip-title {
    text-align: center;
}

#activities .tooltip-wrapper {
    display: inline-block;
}

#activities .tooltip-legend {
    width: 275px;
}

#activities .tooltip-description {
    text-align: left;
}

.nav-tabs > li > a {
    padding: 7px 15px !important;
}

.onboarding-navigation {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 20px 0px !important;
    border-top: 1px solid #D9DDE0;
    background-color: #fff;
    z-index: 10;
}

.onboarding-navigation .step {
    width: 8px;
    height: 8px;
    border-radius: 4px;
    background-color: #D9DDE0;
    display: inline-block;
    margin-left: 18px;
}

.onboarding-navigation .step.active {
    background-color: #635BFF;
}

.onboarding-close-button {
    width: 56px;
    height: 56px;
    border-radius: 28px;
    background-color: #ECEEEF;
    padding-top: 6px;
    cursor: pointer;
    text-align: center;
    position: absolute;
    right: 30px;
}

/*body[data-state="onboarding-onsite-team"] .modal-backdrop {
    background-color: #000 !important;
}


body[data-state="onboarding-onsite-team"] .modal-header {
    background-color: #fff;
}


body[data-state="onboarding-onsite-team"] .modal-content {
    box-shadow: unset;
    -webkit-box-shadow: unset;
}*/

.welcome {
    margin-top: 50px;
}

.welcome-main {
    margin-left: 15%;
    margin-top: 100px;
    max-width: 600px;
}

.welcome-img {
    max-width: 100%;
    max-height: 800px;
    padding-right: 5%;
}

.welcome-heading,
.office-hours-heading,
.onsite-team-heading,
.team-roles-heading,
.oncall-schedule-heading,
.ivr-setup-heading,
.ivr-call-heading,
.call-forwarding-heading {
    font-weight: bold;
    font-size: 24px;
}

.oncall-schedule-heading,
.oncall-schedule-instructions {
    margin-left: 115px;
}

.oncall-schedule-instructions {
    position: absolute;
    z-index: 10;
}

.ivr-call-instructions,
.ivr-setup-description,
.ivr-call-description,
.call-forwarding-instructions,
.call-forwarding-description {
    font-size: 14px;
    width: 700px;
}

.ivr-setup-description .download {
    color: #635BFF !important;
}

#btnDemo {
    font-weight: 800;
    color: #635BFF !important;
}

.ivr-setup-text {
    padding: 16px;
    gap: 10px;
    width: 100%;
    height: 300px;
    border: solid 1px #D9DDE0;
    border-radius: 8px;
}


.ivr-setup-text .scrollable {
    height: 100%;
    overflow: auto;
    padding-right: 5px;
}

.ivr-setup-intro {
    background-color: #F5F6F7;
    display: inline-block;
    position: relative;
    width: 100%;
    padding-top: 10px;
    padding-left: 10px;
    border-radius: 8px;
    margin-top: 5px;
}


.ivr-setup-intro-heading {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-flow: row nowrap;
}


.ivr-setup-intro-heading-text {
    padding: 0 4px;
    transform: translate(0, -10px);
    white-space: nowrap;
}

.ivr-setup-intro-heading-border-left {
    flex: 0 0 10px;
    box-sizing: border-box;
    height: 100%;
    border-radius: 10px 0 0 10px;
    border: 1px solid #000;
    border-right: none;
}

.ivr-setup-intro-heading-right {
    flex: 1 0 50px;
    border-radius: 0 10px 10px 0;
    border: none;
}

.ivr-setup-text textarea {
    width: 100%;
    height: 86px;
    text-indent: unset !important;
    border: none !important;
    resize: none;
    font-size: 20px;
    position: relative;
}

.onboarding-ivr-setup .character-count {
    font-size: 14px;
    color: #8E99A1;
    float: right;
    margin-right: 20px;
    margin-bottom: 10px;
}

.ivr-setup-remaining {
    color: #7B8892;
}


.welcome-heading span {
    color: #635BFF !important;
}

.welcome a {
    font-weight: bold;
    color: #635BFF !important;
}

.welcome-x {
    font-weight: bold;
    color: rgb(255, 0, 0) !important;
}

.welcome-button {
    margin-top: 40px;
    margin-bottom: 20px;
}

#btnWelcomeContinue,
#btnOnboardingSave {
    width: 139px;
    height: 48px;
    background-color: #635BFF !important;
    background: url('/images/onboarding/welcome_arrow_right.png') no-repeat;
    background-position: calc(100% + 10px) center;
    background-origin: content-box;
    padding-left: 0;
    margin-right: 15px;
    cursor: pointer;
}

body[data-state="onboarding-ivr-setup"] #btnOnboardingSave {
    width: 176px;
}


body[data-state="onboarding-call-forwarding"] #btnOnboardingSave {
    white-space: nowrap;
    padding-left: 30px;
    background-image: none;
}

#btnOnboardingSave i {
    display: none;
}


#btnOnboardingSave.processing {
    background-image: none;
    background-color: #B4B1FF !important;
}

#btnOnboardingSave.processing i {
    display: block;
    position: absolute;
    right: 25px;
}


#btnWelcomeContinue:visited,
#btnOnboardingSave:visited {
    color: #fff !important;
}


#btnOnboardingSave:disabled {
    background-color: #B4B1FF !important;
    color: #fff !important;
}


#btnOnboardingNavBack {
    height: 48px;
    color: #1A2228 !important;
    background-color: #ECEEEF !important;
    background: url('/images/onboarding/welcome_arrow_left.png') no-repeat;
    background-position: 10px center;
    background-origin: content-box;
    justify-content: right;
    padding-left: 10px;
    cursor: pointer;
    min-width: 110px;
    margin-left: 15px;
}

.onboarding-office-hours,
.onboarding-onsite-team,
.onboarding-team-roles,
.onboarding-oncall,
.onboarding-oncall-tree,
.onboarding-oncall-rotation,
.onboarding-ivr-setup,
.onboarding-ivr-call,
.onboarding-call-forwarding {
    text-align: center;
}

.onboarding-oncall-rotation.content {
    min-height: 660px;
}


.onboarding-office-hours .row.timezone {
    display: none;
}


.oncall-tree .instructions,
.oncall-rotation .instructions,
.oncall-schedule-instructions {
    font-size: 14px;
}

@media screen and (min-width: 1200px) {
    .oncall-tree .instructions .oncall-tree-affix {
        position: fixed;
        max-width: 45%;
    }
}

.oncall-tree ol{
    margin-left: -20px;
}

.onboarding-call-forwarding .call-forwarding ul {
    margin-bottom: unset;
}

.onboarding-call-forwarding .call-forwarding li {
    font-size: 14px;
    margin-bottom: unset;
}

.onboarding-office-hours .row.office-hours label,
.onboarding-oncall .oncall-tech-heading,
.oncall-tree .oncall-tech-heading,
.oncall-tree .backup-schedule-heading,
.oncall-rotation-heading {
    font-size: 14px;
    font-weight: 600;
}

.oncall-tree .backup-schedule.scrollable {
    max-height: 125px;
    overflow-y: auto;
    width: 630px;
}

.oncall-tree .backup-schedule-row {
    padding: 12px 0;
    gap: 16px;
    width: 600px;
    height: 72px;
    border: 1px solid #ECEEEF;
    border-radius: 8px;
}

.oncall-tree .backup-schedule-row .row > div {
    float: left;
    margin-left: 10px;
    min-width: 50px;
}

.oncall-tree .backup-schedule-row .text {
    margin-top: 15px;
}

.oncall-tree .backup-schedule-row .numeric {
    background: #F5F6F7;
    border-radius: 4px;
    width: 126px;
    height: 48px;
    padding: 15px 20px;
}

.oncall-tree .backup-schedule-row .numeric .numeric-text {
    float: left;
}

.oncall-tree .backup-schedule-row .numeric .up,
.oncall-tree .backup-schedule-row .numeric .down  {
    float: right;
    cursor: pointer;
}

.oncall-tree .backup-schedule-row .numeric .up {
    position: relative;
    top: -6px;
}

.oncall-tree .backup-schedule-row .numeric .down {
    position: relative;
    left: 8px;
    top: 7px;
}

.onboarding-oncall .trash,
.oncall-tree .backup-schedule-row .trash {
    margin-top: 8px;
    width: 32px;
    height: 32px;
    border-radius: 16px;
    background: url('/images/onboarding/icon_trash.png') no-repeat;
    background-color: #ECEEEF;
    background-position: center;
    background-origin: content-box;
    float: right;
    cursor: pointer;
}

.onboarding-oncall .trash {
    margin-left: 15px;
    float: left;
}

.oncall-tree .backup-schedule-row .oncall-tech {
    margin-top: 0;
}


.onsite-team .scrollable {
    max-height: 340px;
    overflow-y: auto;
    margin-top: 40px;
 /*   background: linear-gradient(white 30%, rgba(255,255,255,0)), linear-gradient(rgba(255,255,255,0), white 70%) 0 100%,
                radial-gradient(50% 0, farthest-side, rgba(0,0,0,.2), rgba(0,0,0,0)), radial-gradient(50% 100%,farthest-side, rgba(0,0,0,.2), rgba(0,0,0,0)) 0 100%;
    background: linear-gradient(white 30%, rgba(255,255,255,0)), linear-gradient(rgba(255,255,255,0), white 70%) 0 100%,
                radial-gradient(farthest-side at 50% 0, rgba(0,0,0,.2), rgba(0,0,0,0)), radial-gradient(farthest-side at 50% 100%, rgba(0,0,0,.2), rgba(0,0,0,0)) 0 100%;

    background-repeat: no-repeat;
    background-color: white;
    background-size: 100% 40px, 100% 40px, 100% 14px, 100% 14px;
    background-attachment: local, local, scroll, scroll;*/
}

.scrollable-wrapper {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
}

.scrollable-shadow {
    position: absolute;
    left: 0;
    z-index: 100;
    width: 100%;
    height: 10px;
    background: red;
}

.scrollable-shadow-top {
    top: 40px;
    background: -webkit-linear-gradient(270deg, rgba(0, 0, 0, 0.15), transparent);
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.15), transparent);
    opacity: 0;
}

.scrollable-shadow-bottom {
    bottom: 0;
    background: -webkit-linear-gradient(90deg, rgba(0, 0, 0, 0.15), transparent);
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.15), transparent);
    opacity: 0;
}

.oncall-tech {
    padding-left: 5px;
    padding-top: 5px;
    width: 200px;
    height: 48px;
    float: left;
    border: 1px solid #ECEEEF;
    border-radius: 100px;
    cursor: pointer;
}

.oncall-tech-badge {
    width: 36px;
    height: 36px;
    padding-top: 8px;
    border-radius: 18px;
    color: #fff;
    font-size: 16px;
    background: #D9DDE0;
    float: left;
    text-align: center;
    vertical-align: middle;
}

.oncall-tech-details {
    padding-left: 10px;
    width: 140px;
    background: #ffffff;
    margin-left: 36px;
}

.oncall-tech-details-header {
    font-size: 12px;
    font-weight: 600;
    color: #687782;
}

.oncall-tech-details-details {
    font-size: 14px;
    font-weight: 600;
    color: #687782;
}

.oncall-tech-details-description {
    width: 135px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.onboarding-goto a,
.onboarding-goto a:visited{
    position: absolute;
    right: 200px;
    top: 34px;
    z-index: 100;
    color: #635BFF !important;
    font-weight: 800;
}

.onboarding-goto {
    display: none;
}

body[data-state="schedule"] .onboarding-goto,
body[data-state="call-forwarding"] .onboarding-goto {
    display: block;
}

.oncall-schedule {
    height: 275px;
}

@media screen and (min-height: 500px) {
    .onsite-team .scrollable {
        max-height: 275px;
    }

    .oncall-tree .backup-schedule.scrollable {
        max-height: 150px;
    }

    .oncall-schedule {
        height: 360px;
    }
}

@media screen and (min-height: 550px) {
    .onsite-team .scrollable {
        max-height: 300px;
    }

    .oncall-tree .backup-schedule.scrollable {
        max-height: 175px;
    }

    .oncall-schedule {
        height: 420px;
    }
}

@media screen and (min-height: 600px) {
    .onsite-team .scrollable {
        max-height: 325px;
    }

    .oncall-tree .backup-schedule.scrollable {
        max-height: 200px;
    }

    .oncall-schedule {
        height: 480px;
    }
}

@media screen and (min-height: 660px) {
    .onsite-team .scrollable {
        max-height: 350px;
    }

    .oncall-tree .backup-schedule.scrollable {
        max-height: 285px;
    }

    .oncall-schedule {
        height: 520px;
    }
}

@media screen and (min-height: 700px) {
    .onsite-team .scrollable {
        max-height: 400px;
    }

    .oncall-tree .backup-schedule.scrollable {
        max-height: 325px;
    }

    .oncall-schedule {
        height: 540px;
    }
}

@media screen and (min-height: 765px) {
    .onsite-team .scrollable {
        max-height: 450px;
    }

    .oncall-tree .backup-schedule.scrollable {
        max-height: 365px;
    }

    .oncall-schedule {
        height: 584px;
    }
}

@media screen and (min-height: 820px) {
    .onsite-team .scrollable {
        max-height: 500px;
    }

    .oncall-tree .backup-schedule.scrollable {
        max-height: 405px;
    }

    .oncall-schedule {
        height: 640px;
    }
}


@media screen and (min-height: 937px) {
    .onsite-team .scrollable {
        max-height: 600px;
    }

    .oncall-tree .backup-schedule.scrollable {
        max-height: 460px;
    }

    .oncall-schedule {
        height: 756px;
    }
}

@media screen and (min-height: 1080px) {
    .onsite-team .scrollable {
        max-height: 800px;
    }

    .oncall-tree .backup-schedule.scrollable {
        max-height: 500px;
    }

    .oncall-schedule {
        height: 900px;
    }
}

.user-name {
    margin-top: 3px;
    margin-left: -4%;
    font-weight: 600;
}

.user-name label {
    margin-top: 10px;
}

.user-name select {
    border-bottom: 0px;
}

.user-row,
.role-row {
    padding-top: 12px;
    height: 48px;
}

.role-row {
    margin-bottom: 20px;
}

.role-row .user-name {
    margin-top: 10px;
    font-size: 14px;
    font-weight: 700;
}

.courtesy-officer-warning {
    font-size: 12px;
    font-weight: normal;
}

.onboarding-oncall-rotation .onboarding-dropdown .dropdown-toggle, .role-row .onboarding-dropdown .dropdown-toggle {
    width: 100%;
}

.onboarding-oncall-rotation .onboarding-dropdown-label,
.role-row .onboarding-dropdown-label {
    display: inline-block;
    margin-top: 11px;
    float: left;
    padding-left: 20px;
    font-size: 14px;
    font-weight: 600;
    color: #687782 !important;
}


.onboarding-oncall-rotation .onboarding-dropdown-label {
    margin-top: 10px;
    color: #687782 !important;
}


.role-row .onboarding-dropdown-label:not(.selected)::after {
    content: "*";
}

.role-row .onboarding-dropdown-label.selected {
    display: inline-block;
    margin-top: 3px;
    font-weight: 600;
    font-size: 12px;
    color: #687782 !important;
}

.onboarding-dropdown-text {
    float: left;
    margin-top: 17px;
    margin-left: -24px;
    color: #687782 !important;
}

.onboarding-oncall-rotation .onboarding-dropdown i,
.role-row i {
    margin-top: 12px;
    float: right;
    margin-right: 20px;
    color: #687782 !important;
}

.user-row {
    box-shadow: inset 0px 1px 0px #ECEEEF;
}

.user-row:first-child {
    margin-bottom: 10px;
}


.user-row:first-child {
    box-shadow: unset;
}

.user-row:not(.disabled):hover{
    cursor: pointer;
    border: 1px solid #ECEEEF;
    box-sizing: border-box;
    box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
}

.role-row .user-badge {
    margin-top: 7px;
}

.user-badge {
    width: 24px;
    height: 24px;
    border-radius: 24px;
    display: inline-block;
    color: #FFF;
    font-size: 10.5px;
}

.user-badge span {
    position: absolute;
    width: 24px;
    height: 14px;
    left: 20px;
    top: 6px;
}

.role-row .user-badge span {
    top: 12px;
}

.user-row:nth-child(1n) .user-badge,
.role-row:nth-child(1n) .user-badge,
.oncall-tech-badge.selected {
    background-color: #92BCEE;
}
.user-row:nth-child(2n) .user-badge,
.role-row:nth-child(2n) .user-badge {
    background-color: #66DBB8;
}
.user-row:nth-child(3n) .user-badge,
.role-row:nth-child(3n) .user-badge {
    background-color: #B199DD;
}
.user-row:nth-child(4n) .user-badge,
.role-row:nth-child(4n) .user-badge {
    background-color: #F38B8B;
}
.user-row:nth-child(5n) .user-badge,
.role-row:nth-child(5n) .user-badge {
    background-color: #FFCC8D;
}

.onsite-team-add {
    padding: 20px 30px;
}

.oncall-backup-add-button,
.oncall-rotation-add-button,
.onsite-team-add-button,
.oncall-add-backup-button,
.office-hours-customize-button,
.ivr-setup-preview-button,
.ivr-item-details-preview-button {
    color: #635BFF;
    width: 145px;
    font-weight: 600;
    cursor: pointer;
    font-size: 14px;
}

.office-hours-customize-button {
    line-height: 3rem;
}

.oncall-rotation-add-button,
.ivr-setup-preview-button,
.ivr-item-details-preview-button {
    padding: 8px;
    background-color: #EFEFFF !important;
    width: 175px;
    border-radius: 4px;
}

#audioPreviewPlayer {
    display: none;
}

.ivr-setup-preview-button {
    width: 192px;
    float: right;
}

.oncall-add-backup-button {
    width: 205px;
}

.ivr-item-details-preview-button {
    width: 95px;
    font-weight: 700;
    font-size: 14px;
}

.ivr-setup-preview-button i,
.ivr-item-details-preview-button i {
    display: none;
}

.ivr-setup-preview-button.pause img,
.ivr-setup-preview-button.processing img,
.ivr-item-details-preview-button.pause img,
.ivr-item-details-preview-button.processing img {
    display: none;
}

.ivr-setup-preview-button.processing .fa-spinner,
.ivr-item-details-preview-button.processing .fa-spinner {
    display: inline-block;
    margin-top: 4px;
}

.ivr-setup-preview-button.pause .fa-stop,
.ivr-item-details-preview-button.pause .fa-stop  {
    display: inline-block;
    margin-top: 4px;
}

.oncall-backup-add-button {
    width: 100px;
}

.onsite-team-add-button div,
.oncall-add-backup-button div,
.office-hours-customize-button div,
.oncall-backup-add-button div,
.oncall-rotation-add-button div,
.ivr-setup-preview-button div,
.ivr-item-details-preview-button div {
    float: right;
    margin-top: 2px;
}

#content.office-hours.settings-communities,
#content.onsite-team,
#content.oncall,
#content.oncall-tree,
#content.oncall-rotation,
#content.ivr-setup,
#content.ivr-call,
.onboarding-call-forwarding #content.call-forwarding {
    display: inline-block;
    text-align: left;
    max-width: 1000px !important;
    padding-top: 0;
    margin-top: 0;
}

#content.oncall-tree {
    max-width: unset !important;
    padding-bottom: 50px;
}

.office-hours .settings-form h2 {
    display: none;
}

#settings-modal .modal-content,
#add-team-member-modal .modal-content {
    max-width: 500px;
}

#confirm-modal .modal-body .row,
#alert-modal .modal-body .row,
#add-team-member-modal .modal-body .row {
    padding-bottom: 16px;
}

#settings-modal .close,
#confirm-modal .close,
#alert-modal .close,
#add-team-member-modal .close {
    font-size: 44px;
}


#settings-modal .modal-content h3,
#confirm-modal .modal-content h3,
#alert-modal .modal-content h3,
#add-team-member-modal .modal-content h3 {
    font-weight: bold;
    font-size: 24px;
}

#settings-modal .modal-content,
#confirm-modal .modal-content,
#alert-modal .modal-content,
#add-team-member-modal .modal-content {
    border-radius: 16px !important;
    text-align: left;
    border: 0px solid rgba(0, 0, 0, 0.2);
}


#settings-modal #confirm-alert, #settings-modal #ignore-alert {
    margin-bottom: 0;
}

#add-team-member-modal .modal-content {
    padding: 20px 15px 25px;
}

#add-team-member-modal input {
    margin-top: 20px;
    background-color: #F5F6F7;
    border-radius: 8px;
    border-bottom: 0;
}

#add-team-member-modal .email {
    padding-left: unset;
}

#add-team-member-modal .no-email {
    padding-left: unset;
    padding-right: unset;
    margin-top: 30px;
}

#add-team-member-modal .no-email .onboarding-selection {
    margin-top: -1px;
    margin-left: -14px;
}

#update-property-manager-modal .modal-content {
    max-width: 500px;
}


#update-property-manager-modal .modal-content select {
    margin-top: 20px;
    margin-bottom: 40px;
}

#confirm-modal .modal-body .row,
#alert-modal .modal-body .row,
#update-property-manager-modal .modal-body .row {
    padding-bottom: 16px;
}

#update-property-manager-modal .modal-body .row {
    min-height: 200px;
}

#confirm-modal .close,
#alert-modal .close,
#update-property-manager-modal .close {
    font-size: 44px;
}


#confirm-modal .modal-content h3,
#alert-modal .modal-content h3,
#update-property-manager-modal .modal-content h3 {
    font-weight: bold;
    font-size: 24px;
}

#confirm-modal .modal-content,
#alert-modal .modal-content,
#update-property-manager-modal .modal-content {
    border-radius: 16px !important;
    text-align: left;
    border: 0px solid rgba(0, 0, 0, 0.2);
}

#update-property-manager-modal .modal-content {
    padding: 20px 15px 25px;
}

.onboarding-selection {
    margin-top: 2px;
    width: 20px;
    height: 20px;
    border: 1px solid #B3BBC1;
    box-sizing: border-box;
    border-radius: 10px;
    display: inline-block;
}

.onboarding-selection.selected {
    background-color: #635BFF;
    border: 1px solid #635BFF;
    background-image: url('/images/onboarding/icon check.png');/* no-repeat;*/
    background-repeat: no-repeat;
    background-position: calc(50%) center;
    background-origin: content-box;
}

.onboarding-selection.disabled {
    background-color: #999;
    border: 1px solid #999;
}

.onboarding-dropdown .btn:focus {
    background-color: unset !important;
    box-shadow: unset !important;
}

.onboarding-dropdown {
    background: #F5F6F7;
    border-radius: 8px;
    width: 360px;
    height: 48px;
    cursor: pointer;
}

.onboarding-oncall-rotation .onboarding-dropdown {
    width: 255px;
    position: relative;
}

.onboarding-dropdown-selection {
    /*top: 0;*/
    left: 15px;
    width: 360px;
    background: #FFFFFF;
    border: 1px solid #ECEEEF;
    box-shadow: 0px 6px 10px rgba(24, 31, 36, 0.04), 0px 4px 6px rgba(24, 31, 36, 0.08), 0px 1px 0px rgba(24, 31, 36, 0.03), 0px 0.5px 0px rgba(24, 31, 36, 0.03);
    border-radius: 8px;
    margin-top: 3px;
}

.onboarding-dropdown.dropup .onboarding-dropdown-selection {
    margin-left: -15px;
}

.onboarding-oncall-rotation .onboarding-dropdown-selection {
    position: absolute !important;
    top: 48px !important;
    left: 0px !important;
    width: 255px;
}

.onboarding-dropdown-selection > div,
.oncall .dropdown-menu > div,
.backup-schedule-row .dropdown-menu > div,
.oncall-rotation .dropdown-menu > div {
    padding: 4px;
    cursor: pointer;
}

.onboarding-dropdown-selection > div.selected {
    color: #635BFF;
    background-image: url('/images/onboarding/icon_check_blurple.png');/* no-repeat;*/
    background-repeat: no-repeat;
    background-position: right;
    background-origin: content-box;
}

.onboarding-oncall-rotation .date-selector,
.onboarding-oncall-rotation .time-selector {
    width: 260px;
    height: 48px;
    border-radius: 24px;
    border: 1px solid #D9DDE0;
    cursor: pointer;
}

.onboarding-oncall-rotation .date-selector input,
.onboarding-oncall-rotation .time-selector input {
    cursor: pointer;
}


.onboarding-oncall-rotation .date-selector .dropdown-menu {
    margin-top: -2px;
}

.onboarding-oncall-rotation .ui-timepicker-wrapper {
    width: 220px !important;
    margin-left: -37px;
}

.onboarding-oncall-rotation .date-selector .label,
.onboarding-oncall-rotation .time-selector .label {
    font-weight: 600;
    color: #B3BBC1;
    line-height: 16px;
    font-size: 12px;
    padding: unset !important;
}

.onboarding-oncall-rotation .date-selector .desc input,
.onboarding-oncall-rotation .time-selector .desc input  {
    font-weight: 600;
    color: #425563;
    line-height: 16px;
    font-size: 14px !important;
    text-indent: unset !important;
    margin-top: -8px;
    border: none !important;
}


.onboarding-oncall-rotation .circle {
    border: solid 1px #FFF;
    background-color: #F5F6F7;
    height: 32px;
    width: 32px;
    line-height: 32px;
    -moz-border-radius: 50%;
    border-radius: 50%;
    text-align: center;
    margin-top: 7px;
    margin-left: -11px;
}

.date-selector.active .circle,
.time-selector.active .circle {
    border: 1px solid #D9DDE0
}

.onboarding-oncall-rotation .circle img {
    margin-bottom: 6px;
}

.onboarding-oncall-rotation .circle img {
    margin-bottom: 5px;
}

.oncall-rotation-primary,
.oncall-rotation-backup {
    position: relative;
}

.oncall-rotation-primary .dropdown-menu,
.oncall-rotation-backup .dropdown-menu {
    top: 48px;
    left: 20px;
}

.oncall-rotation-backup.dropup .dropdown-menu {
    top: unset;
}

.onboarding-oncall-rotation .rotation-change {
    display: none;
}

.onboarding-note {
    margin: 20px 30px;
    padding-bottom: 20px;
    font-size: 14px;
}

.oncall {
    margin-left: 0;
    padding-left: 0;
}

.onboarding-oncall .oncall-primary,
.onboarding-oncall .oncall-backup {
    position: relative;
}


.onboarding-oncall .oncall .dropdown-menu {
    position: absolute;
    left: 20px;
}

.onboarding-oncall-tree .oncall .dropdown-menu {
    top: 74px;
    left: 36px;
}


.onboarding-oncall-tree .backup-schedule-row .dropdown-menu {
    left: 333px;
}

.onboarding-oncall-tree .backup-schedule-row .dropup .dropdown-menu {
    left: 20px;
}

.oncall-schedule {
    /*margin: 76px 100px;*/
    margin-top: 76px;
    overflow-y: auto;
}

.oncall-schedule #calendar_main .fc-view-container {
    top: -5.5rem !important;
}

.oncall-schedule #calendar_main .fc-header-toolbar {
    top: 8rem;
    height: unset !important;
    margin-right: 135px;
}

.oncall-schedule #calendar_main td.fc-head-container.fc-widget-header > .fc-row.fc-widget-header {
    top: 11rem !important;
    width: calc(100vw - 100px);
}


@media print {
    body {
        overflow-x: unset;
    }

    header {
        position: relative;
    }

    .navbar {
        display: none;
    }

    #content {
        margin-top: 15px;
        padding-top: 0;
    }

    #calendar_main td.fc-head-container.fc-widget-header > .fc-row.fc-widget-header {
        top: 15.5rem !important;
    }
}

.ivr-studio-header {
    font-weight: 600;
    font-size: 16px;
}

.ivr-studio-info {
    font-weight: 400;
    font-size: 14px;
}

.ivr-item {
    border: solid 1px #ECEEEF;
    width: 760px;
    height: 50px;
    border-radius: 10px;
    display: table;
    background-color: #fff;
}

.ivr-item .ivr-gather {
    text-align: center;
    padding: 4px 2px;
    background: #E6F7F8;
    border-radius: 48px;
    width: 66px;
    display: inline-block;
    color: #00B4BB;
    margin-top: 11px;
    margin-left: 15px;
}
.ivr-item .enable {
    margin-right: 15px;
}
.ivr-item input:checked + .slider {
    background-color: #635BFF !important;
}

.ivr-item input:checked + .slider:after,
.ivr-item input + .slider:after {
    content: "";
}

.ivr-item.disabled .ivr-gather {
    background: #ECEEEF;
    color: #687782;
}

.ivr-item.disabled .spanish {
    color: #687782;
}

.ivr-item .preview-play {
    display: inline-block;
    margin-top: 11px;
    margin-left: 15px;
    width: 23px;
    height: 23px;
    background-image: url(../images/hc/ivr-play.png);
    cursor: pointer;
}

.ivr-item .preview-play.pause {
    background-image: url(../images/hc/ivr-pause.png);
}

.ivr-item .description {
    font-weight: 600;
    font-size: 14px;
    margin-top: 15px;
    margin-left: 15px;
    display: inline-block;
}

.ivr-item.locked > img {
    margin-left: 15px;    
}

.ivr-item .edit {
    margin-right: 15px;
    margin-top: 14px;
    cursor: pointer;
}

.ivr-item .ivr-spacer {
    margin-left: 30px;
}

.ivr-item .drag-handle {
    margin-left: 15px;
    cursor: move;
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}

.ivr-welcome-message {
    width: 800px;
}


.ivr-item-filler {
    position: relative;
    border-right: solid 1px #ECEEEF;
    height: 30px;
    left: 1px;
    top: 40px;
    width: 20px;
}

.ivr-item-filler.last {
    border: 0;
}

.ivr-item-branch {
    border-left: solid 1px #ECEEEF;
    border-bottom: solid 1px #ECEEEF;
    border-bottom-left-radius: 10px;
    height: 50px;
    width: 20px;
}

.ivr-item-details {
    position: absolute;
    background-color: #fff;
    top: 0;
    right: 0;
    min-height: 100vh;
    width: 544px;
    box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.1);
    border-radius: 16px 0px 0px 16px;
    padding: 48px 0;
}

.ivr-item-details .header {
    font-weight: 700;
    font-size: 20px;
    margin-left: 48px;
}

.ivr-item-details .close {
    font-size: 45px;
    margin-right: 48px;
}

.ivr-item-details .break {
    position: absolute;
    top: 100px;
    width: 100%;
    right: 0;
}

.ivr-item-details-content {
    position: relative;
    display: inline-block;
    width: 100%;
    top: 60px;
    overflow: auto;
    height: 83vh;
    padding: 0px 48px;
}

.ivr-item-details-content .sub-header {
    font-weight: 600;
    font-size: 16px;
}

.ivr-item-details-content textarea {
    background: #F5F6F7;
    border-radius: 8px;
    border: 0;
    height: 96px;
    padding: 8px;
    font-weight: 400;
    font-size: 14px;
    text-indent: unset;
    resize: none;
}

.ivr-item-details-content .calltree {
    background: #F5F6F7;
    border-radius: 8px;
    height: 96px;
    padding: 8px;
    font-weight: 400;
    font-size: 14px;
    background: #FFFFFF;
    border: 1px solid #ECEEEF;
}

.ivr-item-details-content .character-count {
    font-weight: 600;
    font-size: 14px;
    color: #8E99A1;
}

.ivr-item-details-content .btn-primary {
    align-items: center;
    padding: 12px 40px;
    width: 116px;
    height: 48px;
    background-color: #635BFF !important;
    border-radius: 48px;
    cursor: pointer;
}

.ivr-item-details-content .btn-primary.cancel {
    background-color: #ECEEEF !important;
    color: #000 !important;
    width: 100px;
}

.ivr-item-details-content .btn-primary:visited {
    color: #fff !important;
}


.ivr-item-details-content .btn-primary:disabled {
    background-color: #B4B1FF !important;
    color: #fff !important;
}

.ivr-item-details-content .avatars {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    padding: 0px;
    gap: 16px;
}

.ivr-item-details-content .voice-avatar {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 16px;
    gap: 16px;
    width: 137px;
    /* Brand Neutral/White */

    background: #FFFFFF;
    box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.12);
    border-radius: 8px;
}


.ivr-item-details-content .avatar-name {
    font-weight: 600;
    font-size: 16px;
}


.ivr-item-details-content .avatar-description {
    font-weight: 400;
    font-size: 12px;
}


.admin-menu {
    display: none;
}