.diagram .template .template-name {
    font-weight: bold;
    text-decoration: underline;
}

.diagram .template .template-actionname {
    font-weight: bold;
}

.diagram .template .template-title {
    font-style: italic;
}

.diagram .template .template-button {
    cursor: pointer;
    font-size: 8pt;
    fill: navy;
    font-weight: bold;
}

    .diagram .template .template-button:hover {
        text-decoration: underline;
    }


.WrappedColumnClass {
    white-space: normal;
    word-wrap: break-word;
}

.fieldTitle {
    font-size: 14px;
    font-weight: 600;
    font-family: var(--default-font-family);
    color: var(--card-fieldtitle-color);
}

.fieldValue {
    font-size: 14px;
    font-weight: 400;
    font-family: var(--default-font-family);
    color: var(--card-field-color);
}

.smbReadonlyRegularTextColor textarea {
    color: rgba(0,0,0,.87) !important;
}

.smbReadonlyRegularTextColor input {
    color: rgba(0,0,0,.87) !important;
}

.grid-cell {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.grid-cell a {
    color: var(--main-color);
    text-decoration: underline;
}

.smbi-siganture {
    background-image: url('/images/Icon_Signature_green.svg');
    background-size: 14px 12px;
    background-repeat: no-repeat;
    background-position: center;
    display: inline-block;
    height: 14px;
    width: 12px;
}

.smbi-siganture-avest {
    background-image: url('/images/Icon_Signature_red.svg');
    background-size: 14px 12px;
    background-repeat: no-repeat;
    background-position: center;
    display: inline-block;
    height: 14px;
    width: 12px;
}

/*#scrollview {
    height: auto;
    position: relative;
    top: 60px;
    bottom: 0;
    padding: 0;
}
*/

.avatar {
    /* This image is 687 wide by 1024 tall, similar to your aspect ratio */
    background-image: none;
    /* make a square container */
    width: 90%;
    height: 250px;
    /* fill the container, preserving aspect ratio, and cropping to fit */
    background-size: cover;
    /* center the image vertically and horizontally */
    background-position: top center;
    /* round the edges to a circle with border radius 1/2 container size */
    border-radius: 50%;
}

.multiline-text {
    white-space: normal;
    word-wrap: break-word;
}

.datagrid-toolbar-title {
    font-size: 18px;
    font-weight: 800;
    color: var(--card-caption-color);
    font-family: var(--default-font-family);
}

    .datagrid-toolbar-title a {
        color: var(--card-caption-color);
        text-decoration: underline;
    }

.card-title a {
    font-size: 18px;
    font-weight: 800;
    color: var(--card-caption-color);
    font-family: var(--default-font-family);
    text-decoration: underline;
}

.data-field {
    padding-bottom: 5px;
    font-size: 14px;
    font-family: var(--default-font-family);
}

    .data-field .title {
        font-weight: 600;
        color: var(--card-fieldtitle-color);
    }

    .data-field .value {
        font-weight: 400;
        color: var(--card-field-color);
    }

.dx-field-item {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.dx-field-item-content {
    line-height: 20px !important;
    line-height: 20px !important;
    padding-left: 16px !important;
    font-weight: 400 !important;
    color: var(--card-field-color) !important;
   /* min-height: 20px !important;*/
}

    .dx-field-item-content .dx-focused {
        
    }

.dx-field-item-label {
    font-weight: 600 !important;
    color: var(--card-fieldtitle-color) !important;
}

.dx-datagrid .dx-row > td {
    /*padding: 10px !important;*/
}

.smb-custom-control {
    margin-bottom: 5px;
}