.message-link-container {
    position: relative;
    overflow: visible;
}

.message-count {
    position: absolute;
    border: 1px solid #F3F3F3;
    background-color: #d14836;
    color: white;
    border-radius: 22px;
    font-size: 10px;
    padding: 0;
    bottom: 29px;
    left: 16px;
    width: auto;
    text-align: center;
    min-width: 10px;
    line-height: 10px;
    cursor: pointer;
}

.badge-count {
    position: absolute;
    border: 1px solid #F3F3F3;
    background-color: #d14836;
    color: white;
    border-radius: 22px;
    font-size: 13px;
    padding: 3px;
    width: auto;
    text-align: center;
    line-height: 12px;
    cursor: pointer;
    top: -7px;
}

.unread-message-count {
    font-weight: bold;
}

.message-options {
    height: 34px;
    width: 100%;
}

.message-options a {
    margin-right: 20px;
    border: 1px solid transparent;
    color: #7e7e7e;
    width: auto;
    height: 28px;
    font-size: 15px;
    padding: 2px 5px;
    cursor: pointer;
    float: left;
    line-height: 26px;
}

.message-table tbody tr {
    cursor: pointer;
}

.message-options a:hover {
    opacity: .6;
}

.message-options a:active {
    background-color: rgb(160,160,160);
    color: White;
}

div.messages-table-container {
    vertical-align: middle;
    display: block;
    max-width: 898px !important;
    width: 898px !important;
    height: 512px !important;
    padding: 0;
    position: relative;
    top: 0;
}

.messages-table-container table.message-table {
    max-width: 897px !important;
}

.messages-table-container table#view-message-table tbody tr.unread-message td {
    font-weight: bold;
    text-transform: uppercase;
}

.messages-table-container table#sent-message-table tbody tr td:first-child {
    display: none;
}

thead.message-table-header tr th {
}

.message-list-content {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

input.message-selected {
    min-width: 20px;
}

td.view-messages-col2 {
    text-align: left;
    white-space: nowrap;
    padding-right: 1em;
}

td.view-messages-col3 {
    width: 550px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    word-wrap: initial;
}

td.view-messages-col4 {
    text-align: right;
    white-space: nowrap;
}

#message-tab-container {
    font-size: 1.1em !important;
    max-width: 900px !important;
    width: 900px !important;
    height: 550px !important;
    position: relative;
    overflow: hidden;
}

#message-tab-container .ui-corner-all {
    border-radius: 0 0 0 0 !important;
}

#message-tab-container .ui-widget-header {
    background: none !important;
    border-bottom: 1px solid rgb(170, 170, 170) !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
}

#message-tab-container > div {
    overflow: auto;
}

#sent-message, #received-messages, #create-message, #confirm-delete-messages {
    max-width: 900px !important;
    width: 900px !important;
    height: 510px !important;
    display: none;
    overflow-x: hidden !important;
    overflow-y: auto !important;
}
#sent-message, #received-messages {
     overflow-y: hidden !important;
}

.scrollable thead, .scrollable tbody, .scrollable  tr, .scrollable th, .scrollable td{
    display: block;
}
.scrollable thead tr {
    background:#828282;
    width: 100%;
}
.scrollable tr:after {
    clear: both;
    content: ' ';
    display: block;
    visibility: hidden;
}
.scrollable tbody{
    height: 443px;
    overflow: auto;
}

.scrollable tbody td, .scrollable thead th {
    float: left;
}

#received-messages.scrollable th:first-child, #received-messages.scrollable .view-messages-col1{
    width: 3% !important;
 }

#received-messages.scrollable .text_1 {
    width: 35%; 
}
#received-messages.scrollable .view-messages-col2 {
    width: 36%; 
}
#received-messages.scrollable .text_2 {
    width: 40%; 
}
#received-messages.scrollable .view-messages-col3 {
    width: 42%; 
}
#received-messages.scrollable .date_3 {
    width: 16%; 
}
#received-messages.scrollable .view-messages-col4 {
    width: 15%; 
}


#sent-message.scrollable .text_1 {
    width: 10%; 
}
#sent-message.scrollable .view-messages-col2 {
    width: 10%; 
}
#sent-message.scrollable .text_2 {
    width: 69%; 
}
#sent-message.scrollable .view-messages-col3 {
    width: 71%; 
}
#sent-message.scrollable .date_3 {
    width: 16%; 
}
#sent-message.scrollable .view-messages-col4 {
    width: 14%; 
}

#create-message {
    height: 517px !important;
}

.delete-button {
    width: 20px;
    height: 20px;
    display: inline-block;
    cursor: pointer;
}

.reply-button {
    width: 20px;
    height: 20px;
    display: inline-block;
    cursor: pointer;
    float: right;
}

.maximize-button {
    width: 20px;
    height: 20px;
    display: inline-block;
    cursor: pointer;
}

#message-inspector {
    display: none;
    position: absolute;
    width: 900px;
    height: 517px;
    z-index: 5000;
    background: white;
    overflow: hidden !important;
}

.new-message-notification {
    background-color: #008000;
    border: 1px solid #f3f3f3;
    border-radius: 22px;
    color: white;
    display: none;
    font-size: 10px;
    left: 15px;
    line-height: 10px;
    -moz-min-width: 10px;
    -ms-min-width: 10px;
    -o-min-width: 10px;
    -webkit-min-width: 10px;
    min-width: 10px;
    padding: 2px 0;
    position: absolute;
    text-align: center;
    top: 28px;
    width: 128px;
}

.message-complete-content {
    display: none;
}

.messages-to-delete {
    font-weight: bold;
}

.delete-messages-prompt {
    text-align: center;
    font-size: 18px;
    overflow: auto;
    padding-top: 25%;
}

input[type='text'].create-message-title {
    width: 610px;
}

.create-message-selectlist {
    width: 400px;
}

create-message-selectlist-dropdown {
    width: 450px;
}

span.message_recipient {
    white-space: pre;
    float: left;
    border: 1px solid #f0f0f0;
    margin: 2px 10px 2px 0;
    padding: 0 2px 0 2px;
}

.message_recipient_contact {
    background-color: #f8f8ff;
}

.message_recipient_user {
    background-color: #f8faff;
}

#inspector-message {
    width: 640px;
    max-width: 640px;
}

#inspector-sender, #inspector-receivers, #inspector-date, #inspector-title {
    min-width: 610px;
}

#preselected_contacts, #remaining_contacts, #preselected_users, #remaining_users {
    margin: 0;
    padding: 0;
}

#add-recipient {
    display: none;
}

#add-recipient ~ label {
    border-bottom: 1px solid blue;
    padding: 0 2px 0 2px;
}

#add-recipient ~ label:hover {
    cursor: pointer;
}

.add-contact {
    /*float: left;*/
    border: 1px solid blue;
}

.add-contact-label {
    border: 2px dashed red;
}

.add-contact-checkbox {
    border: 2px dashed green;
}

.message-recipient-check {
    float: left;
    border: 10px solid red;
    background-color: yellow;
    margin-right: -20px;
    max-width: 20px;
    max-height: 20px;
    min-width: 15px;
    min-height: 15px;
    position: relative;
    top: 0;
    left: 0;
}

.message-recipient-label {
    float: left;
    border: 1px solid black;
    padding-left: 20px;
}

#message-recipient-list > .message-recipient-container {
    margin: 0 auto 0 auto;
}

.message-recipient-container {
    color: rgb(126, 126, 126);
    line-height: 1.5em;
    direction: ltr;
    position: relative;
    width: auto;
    margin: 10px auto 10px auto;
    list-style-type: none;
    max-height: 150px;
    border: 1px solid rgb(126, 126, 126);
    overflow-x: auto;
    padding: 0;
}

.message-recipient-container:empty {
    display: none;
}

.message-recipient-container > li {
    border-bottom: 1px solid rgb(126, 126, 126);
    color: rgb(126, 126, 126);
    cursor: default;
    direction: ltr;
    display: block;
    font-family: Segoe, 'Segoe UI', Tahoma, 'Lucida Grande', Arial, sans-serif;
    font-size: 13px;
    height: auto;
    line-height: 26px;
    list-style-type: none;
    text-align: left;
    width: auto;
}

.message-recipient-container > li > label {
    cursor: pointer;
    float: none;
}

.message-recipient-container input[type='checkbox'] {
    display: none;
}

.message-recipient-container label {
    display: block;
    padding-left: 26px;
    background-color: white;
}

.message-recipient-container input[type='checkbox'] ~ label::after {
    content: "";
    margin-left: -18px;
    float: left;
}

.message-recipient-container input[type='checkbox'].uncheckable ~ label::after {
    content: "\2718"; /* Unicode: "✗";*/
    color: Red;
}

.message-recipient-container input[type='checkbox'].uncheckable ~ label {
    background-color: #ffdfdf;
}

.message-recipient-container input[type='checkbox']:checked ~ label::after {
    content: "\2714"; /* Unicode: "✔"; */
    color: Green;
}

.message-recipient-container input[type='checkbox']:checked ~ label {
    background-color: rgb(222, 236, 254);
}

.message-options .search-messages {
    position: absolute;
    right: 0;
}

.search-messages {
    /*margin-top: -3px;*/
    border-width: 0;
}

.search-messages label.search-box-label {
    box-shadow: none;
    color: #bbb;
    font-style: italic;
    position: absolute;
    top: 3px;
    left: 15px;
    border-width: 0;
}

.search-messages-button
{
    cursor: pointer;
}

.delete-message-error {
    padding-left: 35px;
}