
@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@100&display=swap');

html, body {
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
}
body {
    position: fixed;
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;  
}

.app-header {
}

.app-header .navbar {
    background: #193767!important;
}

.app-header .navbar .navbar-brand a {
    font-family: 'Work Sans', sans-serif;
    font-weight: 900;
    text-shadow: 0 0 1px #FFFFFF;
    transition: text-shadow 0.5s;
}
.app-header .navbar .navbar-brand a:hover {
    text-shadow: 0 0 5px #FFFFFF;
}

.app-header .navbar .navbar-nav {
    flex-grow: 1;
    justify-content: center;
}

.app-header .navbar .btn-group a,
.app-header .navbar .btn-group button {
    min-width: 100px;
}


.app-body {
    display: flex;
    flex-direction: row;
    flex-grow: 1;
    overflow: hidden;
}

.app-footer {
    display: flex;
    justify-content: center;
    align-items: center;
}

.app-footer small {
    color: #aaa6a6;
    margin: 0;
    /* height: 32px; */
}


.app-viewport {
    width: 100%;
    height: 100%;
    overflow-y: auto;
    background: url(/static/assets/background.PNG);

    background-attachment: local;
    background-position-x: right;
}

.app-viewport > div {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

.split, .gutter.gutter-horizontal {
    /* float: left; */
}
.gutter.gutter-horizontal {
    background: #193767;
    cursor: ew-resize;
}




#app_left {
}

#app_right {
}




.table-icon {
    max-width: 25px;
    max-height: 25px;
    width: 25px;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
}

.table-icon img {
    max-width: 25px;
    max-height: 25px;
}

.icon {
    vertical-align: middle;
}

/* Black part link style. */
a.bomlink.part { text-decoration: none; }
a.bomlink.part > kbd {
    text-decoration: none;
    background-color: #212529;
    color: white;
    color-adjust: exact;
    -webkit-print-color-adjust: exact;
}
a.bomlink.part:hover>kbd {
    background-color: #454C54;
}

/* Blue assembly link style. */
a.bomlink.assembly { text-decoration: none; }
a.bomlink.assembly > kbd {
    text-decoration: none;
    background-color: #007bff;
    color: white;
    color-adjust: exact;
    -webkit-print-color-adjust: exact;
}
a.bomlink.assembly:hover>kbd {
    background-color: #2B91FF;
}


/** 
 * Fancy styling to let you know what fields have been edited. 
 * To use this, add: `bomnado-savechanges-note` to the div that wraps the `input-group` or control.
 * Then PageChanges.install() will automatically add the `bomnado-savechanges-flagged` class.
 */
.form-group > .bomnado-savechanges-note.bomnado-savechanges-flagged:before {
    content: "";
    position: absolute;
    display: block;
    width: 4px;
    height: 4px;
    background: #0087F7; /* c4e4ff */
    margin-left: 2px;
    margin-top: 2px;
    border-radius: 3px;
    z-index: 100;
}

.bomnado-usedby-list {
    font-size: 0.8em;
}


/* Sensible hover colour for the select2 controls (search, etc). */
.select2-results__option--highlighted{
    background-color: #666666!important;
}

/* Hide the sidebar toggle on most screens.  Sub-pages are responsible for enabling it. */
#app_sidebar_toggle_btn {
    display:none;
}