body, html {
    margin: 0;
    min-height: 100%;
    height: 100%;
}

#app-side-nav-outer-toolbar {
    flex-direction: column;
    display: flex; 
    height: 100%;
    width: 100%;
}

.layout-header {
    flex: 0 0 auto;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    position: relative;
    z-index: 1501;
}

.dx-toolbar .dx-toolbar-item.menu-button {
    width: 60px;
    text-align: center;
    padding: 0;
}

.dx-toolbar .dx-toolbar-item.portal-breadcrumb {
    max-width: inherit !important;
    padding-left: 58px;
}

.dx-toolbar .dx-toolbar-item.menu-button > .dx-toolbar-item-content .dx-icon {
    color: #1e8ae7;
}

.dx-card.wide-card {
    border-radius: 0;
    margin-left: 0;
    margin-right: 0;
    border-right: 0;
    border-left: 0;
}

.with-footer > div > div > .dx-scrollable-content {
    height: 100%;
}

.with-footer > div > div > .dx-scrollable-content > .dx-scrollview-content {
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

.layout-body {
    flex: 1;
    height: 100%;
    min-height: 0;
}

.layout-body .menu-container {
    height: 100%;
    padding: 12px 4px 0px 0px;
}

.layout-body .content {
    flex-grow: 1;
    height: 100%;
    line-height: 1.5;
}

.layout-body .content h2 {
    font-size: 30px;
    font-weight: 300;
    letter-spacing: -.5px;
}

.layout-body .content-block {
    margin-left: 20px;
    margin-right: 20px;
    margin-top: 20px;
}

.layout-body .content-footer {
    display: block;    
    border-top: 1px solid rgba(0,0,0,.1);
    padding-top: 20px;
    padding-bottom: 24px;
}

.layout-body .responsive-paddings {
    padding: 20px;
}

@media screen and (min-width: 600px) {
    .layout-body .content-block {
        margin-left: 40px;
        margin-right: 40px;
    }
}

@media screen and (min-width: 1280px) {
    .layout-body .responsive-paddings {
        padding: 40px;
    }
}

.dx-swatch-additional .dx-widget {
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    font-family: Roboto,RobotoFallback,Helvetica,Arial,sans-serif;
    line-height: 24px;
}

.dx-swatch-additional .dx-treeview-node {
    border-bottom: 1px solid #515159;
}

.dx-swatch-additional .dx-treeview-item {
    padding: 12px 0;
}

.dx-swatch-additional .dx-treeview-node {
    padding-left: 12px;
}

#navTree.dx-treelist .dx-data-row.dx-selection * {
    color: #85bbe8;
}

.dx-swatch-additional .dx-treeview-node .dx-treeview-item .dx-icon {
    width: 60px;
    margin: 0;
}

#layout-drawer:not(.dx-drawer-opened) .dx-scrollable-content .dx-treelist-table .dx-treelist-icon-container {
    position: absolute;
    left: 40px;
}

#layout-drawer .dx-scrollable-content .dx-treelist-table .dx-treelist-icon-container {
    margin-top: 5px;
}

#layout-drawer .dx-scrollable-content .dx-treelist-table span.node-text {
    position: absolute;
    margin-left: 8px;
    margin-top: 4px;
}


.userMenuStyle.dx-context-menu.dx-rtl .dx-menu-item.dx-menu-item-has-text.dx-menu-item-has-icon .dx-icon {
    margin-left: 5px !important;
}

.dx-treelist-rowsview .dx-treelist-table-fixed .dx-treelist-icon-container {
    /*float: right !important;*/
}

#navTree.dx-treelist .dx-data-row[aria-level='2'] i.dx-icon::before,
#navTree.dx-treelist .dx-data-row[aria-level='2'] img.sm-icon {
    opacity: 0.8;
    height: 20px;
    width: 20px;
    margin-left: 10px;
}

#navTree.dx-treelist .dx-treelist-rowsview .dx-treelist-empty-space {
    width: 8px;
}

#navTree.dx-treelist .dx-treelist-rowsview .dx-treelist-empty-space.dx-treelist-expanded,
#navTree.dx-treelist .dx-treelist-rowsview .dx-treelist-empty-space.dx-treelist-collapsed {
    width: 14px;
}

img.sm-icon-size {
    width: 24px;
    height: 24px;
}

#navTree .dx-treelist-rowsview {
    border-top: 0 !important;
}

/* Home Page */
.homepage-button-content-text {
    padding-top: 15px;
}

/* Dashboards */
.dash-page, home-page {
    padding: 40px 20px 40px 20px;
    text-align: center;
}

.dash-option {
    display: inline-block;
    border: 1px solid #d8d8d8;
    border-radius: 4px;
    padding: 20px 20px 20px 20px;
    margin: 0px 16px 0px 16px;
}

.dash-option button {
    height: 80px;
    width: 80px;
    border: none;
    cursor: pointer;
    background: none;
    font-size: larger; 
    color: #f0f0f0;
}

.dash-option img {
    margin-bottom: 6px;
}

.loginform .dx-field-item-label-text,
.loginform .dx-texteditor-input,
.loginform .dx-field-item-required-mark,
.loginform .dx-form-group-caption {
    color: white !important;
}

.loginform .dx-texteditor.dx-editor-underlined {
    border-bottom: 1px solid white !important;
}

.loginform .dx-checkbox-icon {
    border-color: white !important;
}

.loginform .dx-form-group-with-caption > .dx-form-group-content {
    border-top: 1px solid #00548b!important;
}

/***** Page Rendering ******/

/*** Page Panels ***/

.portal-form-panel:first-of-type {
    padding: 1.8em 1.8em 0;
}

.portal-form-panel {
    padding: 0 1.8em;
}

.portal-form-panel .column-spacer {
    visibility: hidden;
}

.portal-form-panel-bordered {
    border: 1px solid grey;
}

/*** DataGrids ***/

/*First Column Icon Styles*/
.portal-form-datagrid tr td:first-child {
    padding: 0 0 0 10px !important;
}

.portal-form-datagrid tr td:first-child img {
    height:16px;
    width:16px;
}