.system-logo {
}

.navbar-brand {
    background: url("../images/vocal.main.logo.png") no-repeat center;
    width: 225px;
}

nav.navbar-invert {
    background-color: rgb(116, 34, 102);
}

nav.navbar-invert > div > ul > li > a {
    background-color: rgb(116, 34, 102) !important;
}

body > .nav > li > a:hover,
body > .nav .open > a:focus,
body > .nav .open > a:active {
    background-color: rgb(116, 34, 102) !important;
}


.btn-primary, .btn-primary:hover {
    background-color: rgb(116, 34, 102);
    border-color: rgb(116, 34, 102);
}

.border-unread {
    border-left: 3px solid rgb(116, 34, 102);
}


.toggle.btn {
    border-color: #ebedf2;
    background-color: #fff;
}
.toggle.btn:hover {
    border-color: rgb(116, 34, 102);
    background-color: #fff;
}

.audioplayer {
    border: 1px solid rgb(116, 34, 102) !important;
}

.border-read {
    border-left: 3px solid white;
}

.border-unread > td {
    font-weight: bold !important;
    color: rgb(116, 34, 102) !important;
}

.transcription {
    border: 1px solid rgb(116, 34, 102);
    min-height: 50px;
    max-height: 500px;
    padding: 4px;
    overflow-y: auto;
}

.loader {
    border-top: 3px solid #33B2E0;
}

.tagify {
    --tag-bg: #33B2E0 !important;
}

.tagify:hover {
    --tag-bg: #33c2f0 !important;
}

.tagify__tag {
    color: white;
    background-color: #33B2E0;
    border-radius: 4px;
}
.tagify {
    border-radius: 4px;
}

.tagify__tag-text {
    color: white;
    font-weight: 600;
}

.tagify__tag:hover {
    background-color: #33c2f0;
}

input.checkB:checked + .label-text:before {
    color: #33B2E0;
}


ul.nav-buttons > li > a:focus, ul.nav-buttons > li > a:hover {
    background-color: #33B2E0;
}

ul.nav-buttons .open > a, ul.nav-buttons .open > a:focus, ul.nav-buttons .open > a:hover {
    background-color: #33B2E0;
}

.span-details {
    color:#337ab7 !important;
}