﻿.umb-table-body.notifications .umb-table-cell {
    white-space: normal!important;
}
    
#differences {
    padding: 15px;
    border: 1px solid silver;
    border-radius: 3px;
    margin-bottom: 15px;
}

.unread {
    background-color: #edf2fa;
}

.umb-table-row:hover {
    color: #817f85 !important;
}

.ccb-sub-views-nav-item {
    font-size: 20px !important;
}

.ccb-sub-views-nav-item-text {
    font-size: 12px !important;
}

.modal-header {
    padding-top: 18px !important;
    padding: 12px 15px;
    border-bottom: 1px solid #eee;
}

.ccb-sub-header{
    margin-bottom: 5px !important;
}

.ccb-num-notification-to-read {
    margin: 20px 0 !important;
    font-size: 16px;
}

.ccb-pagination-right {
    padding: 0px !important;
    text-align: right !important;
    display: block !important;
}

.ccb-code {
    display: block;
    white-space: pre-wrap;
    color: teal;
    margin: 10px 0 10px 0;
    cursor: pointer;
}

.ccb-list-item {
    padding-left: 10px;
    border-radius: 5px;
}

/*Notification badge*/
#notification-badge {
    /*display: block !important;*/
    /* margin-left: 2px !important;
    font-family: Lato,Helvetica Neue,Helvetica,Arial,sans-serif !important;
    background-color: #EF5350 !important;
    padding:5px 5px !important;
    border-radius:20px;*/

    position: absolute;
    top: 15px;
    right: -8px;
    min-width: 16px;
    color: #f5c1bc;
    background-color: #1b264f;
    border: 2px solid #f5c1bc;
    border-radius: 50%;
    font-size: 10px;
    font-weight: 700;
    padding: 2px;
    line-height: 16px;
    display: block;
}

.badge{
    text-align:center !important;
}

.ccb-list-item:hover {
    background-color: #F3F3F5;
}

.notification-pills > li {
    cursor: pointer;
    margin-right: 5px;
}

.notification-info {
    margin-top: -5px;
    margin-bottom: 0;
    margin-left: auto;
    margin-right: 10px;
}

.notification-info-icon {
    padding: 5px;
    cursor: pointer;
    border-radius: 15px;
    color: teal;
}

.notification-info-icon:hover {
    background: white;
}

#ccb-modal-backdrop.modal-backdrop {
    display: none;
    background-color: black;
    opacity: 0.7;
}

#ccb-modal.modal {
    border-radius: 5px !important;
    margin: auto;
    top: 1vh;
    height: auto;
    left: calc(((-1300vw - 80px) * 0.05) + 80px);
    width: calc((100vw - 80px) * 0.9);
}

#ccb-modal .modal-body {
    max-height: calc((100vh - 160px) * 0.9);
}

#ccb-modalReference.modal {
    border-radius: 5px !important;
    margin: auto;
    top: 1vh;
    height: auto;
    left: calc(((-1300vw - 80px) * 0.05) + 80px);
    width: calc((100vw - 80px) * 0.9);
}

@media(max-width: 1535px) {
    #ccb-modal.modal {
        border-radius: 5px !important;
        margin: auto;
        top: 1vh;
        height: auto;
        left: calc(((-1300vw - 80px) * 0.05) + 80px);
        width: calc((100vw - 80px) * 0.9);
    }
}

#ccb-modalReference .modal-body {
    max-height: calc((100vh - 160px) * 0.9);
}
@media(min-width: 1920px) {
    #ccb-modal.modal {
        border-radius: 5px !important;
        margin: auto;
        top: 1vh;
        height: auto;
        left: calc(((-1400vw - 80px) * 0.05) + 80px);
        width: calc((100vw - 80px) * 0.9);
    }

    #ccb-modalReference.modal {
        border-radius: 5px !important;
        margin: auto;
        top: 1vh;
        height: auto;
        left: calc(((-1420vw - 80px) * 0.05) + 80px);
        width: calc((100vw - 80px) * 0.9);
    }

}

@media(max-width: 500px) {
    #ccb-modal.modal {
        left: calc(((100vw - 41px) * 0.05) + 41px);
        width: calc((100vw - 41px) * 0.9);
    }

    #ccb-modalReference.modal {
        border-radius: 5px !important;
        margin: auto;
        top: 1vh;
        height: auto;
        left: calc(((-1300vw - 41px) * 0.05) + 41px);
        width: calc((100vw - 41px) * 0.9);
    }
}

.preview {
    height: 500px;
    width: 100%;
    border: 1px solid silver !important;
    border-radius: 5px;
}

.iframe-box {
    width: 50%;
    float: left;
}

.property-label {
    background: #f3f3f5;
    border: 1px solid silver;
    border-radius: 3px;
    margin-right: 5px;
    margin-bottom: 5px;
    padding: 5px 10px;
    float: left;
}

#iframe-container { 
    overflow: hidden;
}

#iframe-container:after {
    content: "";
    display: block;
    clear: both;
    visibility: hidden;
}

#property-container {
    margin-top: 15px;
    margin-bottom: 10px;
}

#property-container:after {
    content: "";
    display: block;
    clear: both;
    visibility: hidden;
}

.action-message {
    background: rgb(252, 248, 227);
    border: 1px solid rgb(251, 238, 213);
    color: rgb(192, 152, 83);
    border-radius: 3px;
    padding: 10px;
}

#baseContentPath {
    margin-bottom:25px;
}