/*----------------------------------------------------------
The base color for this template is #5c87b2. If you'd like
to use a different color start by replacing all instances of
#5c87b2 with your new color.
----------------------------------------------------------*/

html {
    font-size: 14px;
    font-family: "Segoe UI", "Helvetica Neue", "Lucida Grande", Arial, Helvetica, Verdana, sans-serif;
}

body {
    background-color: #aaaaaa;
    margin: 0;
    padding: 0;
    color: #333;
}

fieldset {
    border: 1px solid #ddd;
    padding: 0 1.4em 1.4em 1.4em;
    margin: 0 0 1.5em 0;
}

legend {
    font-size: 1.2em;
    font-weight: bold;
}


a:link {
    color: #006699;
    text-decoration: none;
}

a:visited {
    color: #006699;
}

a:hover {
    color: #054464;
    text-decoration: none;
    cursor: pointer;
}

a:active {
    color: #006699;
}

p, ul {
    line-height: 1.8em;
    color: #333;
}

header,
footer,
nav,
section {
    display: block;
}

footer {
    margin: auto;
    text-align: center;
    padding: 3px 5px;
    font-size: 14px;
    color: #666;
}

/* HEADINGS   
----------------------------------------------------------*/

h3 {
    margin-top: 14px;
}

/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/

/* you can specify a greater or lesser percentage for the 
page width. Or, you can specify an exact pixel width. */
.page {
    background-color: #444;
}

#mainsection {
    padding: 5px 5px 5px 5px;
    background-color: #fff;
    -webkit-border-radius: 4px 0 0 0;
    -moz-border-radius: 4px 0 0 0;
    border-radius: 4px 0 0 0;
    clear: both;
}

#main {
    width: 100%;
}

footer,
#footer {
    padding: 10px 0;
    text-align: center;
    line-height: normal;
    margin: 0 0 30px 0;
    font-size: .9em;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px;
}

/* TAB MENU   
----------------------------------------------------------*/
ul#menu {
    padding: 0;
    position: relative;
    margin: 0;
    text-align: right;
    line-height: 1em;
    top: 4px;
    display: inline-block;
    float: right;
}

    ul#menu li {
        display: inline;
        list-style: none;
    }

        ul#menu li#greeting {
            padding: 10px 20px;
            font-weight: bold;
            text-decoration: none;
            line-height: 2.8em;
            color: #fff;
        }

        ul#menu li a {
            padding: 5px 10px;
            font-weight: bold;
            text-decoration: none;
            line-height: 2.1em;
            background-color: #dcdcdc;
            color: #444444;
            -webkit-border-radius: 4px 4px 0 0;
            -moz-border-radius: 4px 4px 0 0;
            border-radius: 4px 4px 0 0;
        }

        ul#menu li.debug a {
            color: #B3B3FF;
        }

        ul#menu li a:hover {
            background-color: #fff;
            text-decoration: none;
        }

        ul#menu li a:active {
            background-color: #a6e2a6;
            text-decoration: none;
        }

        ul#menu li.selected a {
            background-color: #fff;
            color: #000;
        }


/* TABLE
----------------------------------------------------------*/

table {
    border-collapse: collapse;
}

    table td {
        padding: 0;
    }

    table th {
        padding: 0;
    }

.table-hover > tbody > tr:hover > td {
    background-color: #286080;
    cursor: pointer;
}

.table > tbody > tr.selected > td {
    background-color: #286090;
    color: #f4f4f4;
}

/*This solution doesn't work properly for th with longer text, therefore fixed width is assigned to div. 
    It also doesn't work for scrolling to side but assume that it will fit most of the purpose, other alternatives would be javascript*/
.table-fixed-headers th > div {
    position: absolute;
    color: #f4f4f4;
    top: 0;
    line-height: 20px;
    text-align: left;
    padding-left: 5px;
    margin-left: -10px;
    overflow: hidden;
    text-overflow: ellipsis;
    -ms-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
    width: 80px;
}

.table-fixed-headers th > div, .table-fixed-container td {
    min-width: 80px;
}

.table-fixed-header-background {
    background-color: #777;
    height: 50px;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
}

.table-fixed-container {
    width: 100%;
    height: 90%;
    margin: 0 auto;
    background-color: white;
    position: relative;
    padding-top: 30px;
    overflow: hidden;
}

.table-fixed-container-inner {
    overflow: auto;
    height: 100%;
}
/* MISC  
----------------------------------------------------------*/
.clear {
    clear: both;
}

.error {
    color: #ff5454;
}

.warning {
    color: DarkOrange;
}

#menucontainer {
    margin-top: 40px;
}

span#title {
    color: #ffffff;
    display: inline-block;
}

#logindisplay {
    font-size: 1.1em;
    color: #ccc;
    position: relative;
    top: -8px;
    left: 8px;
}

    #logindisplay a:link {
        color: white;
        text-decoration: underline;
    }

    #logindisplay a:visited {
        color: white;
        text-decoration: underline;
    }

    #logindisplay a:hover {
        color: white;
        text-decoration: none;
    }

.tableresult .head th, .tableresult .body td {
    min-width: 150px;
}

.tableresult .head, .tableresult .body {
    width: 100%;
}
/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error {
    color: #ff0000;
}

.field-validation-valid {
    display: none;
}

.input-validation-error {
    border: 1px solid #ff0000;
    background-color: #ffeeee;
}

.validation-summary-errors {
    font-weight: bold;
    color: #ff0000;
}

.validation-summary-valid {
    display: none;
}

/* Styles for editor and display helpers
----------------------------------------------------------*/
.display-label,
.editor-label {
    margin: 1em 0 0 0;
}

.display-field,
.editor-field {
    margin: 0.5em 0 0 0;
}

.text-box {
    width: 30em;
}

    .text-box.multi-line {
        height: 6.5em;
    }

.tri-state {
    width: 6em;
}

#menu a.select {
    background-color: #fcffcd;
}

ul#menu li.admin a {
    color: #FF79A6;
}

/* Image no border, so IE wont show border around image link*/
img {
    border: 0px;
}

header .btn-group, header .btn-group .btn {
    background: transparent;
    color: #f4f4f4;
    border: 0;
}

header {
    background: #666;
}

    header .neo {
        color: rgb(78, 167, 209);
    }

    header .dropdown-menu a {
        display: inline-block;
        width: 100%;
    }

    header .dropdown-menu > li.admin > a {
        color: orangered;
    }

    header .dropdown-menu > li.main > a {
        color: deepskyblue;
    }

    header .dropdown-menu > li.debug > a {
        color: #b94a48;
    }

    header .dropdown-menu > li.alerts > a {
        color: #10a80e;
    }

    header .right-side a, header .right-side a:link, header .right-side a:visited {
        color: #78C1DD;
    }

        header .right-side a:hover {
            color: #58B3F0;
        }

    header .right-side {
        color: #f4f4f4;
    }


.no-user-select {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.mappedaccount {
    color: #0994CB;
}

.browser-warning {
    display: block;
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    border: 1px solid gray;
    padding: 5px;
    background-color: lightyellow;
    color: gray;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14pt;
}

.gi-24 {
    font-size: 24px;
}

.gi-28 {
    font-size: 28px;
}

.gi-32 {
    font-size: 32px;
}

.gi-2x {
    font-size: 2em;
}

.gi-3x {
    font-size: 3em;
}

.gi-4x {
    font-size: 4em;
}

.gi-5x {
    font-size: 5em;
}

.icon-button, close {
    background-color: transparent;
    border: none;
}

.form-control {
    appearance: auto;
    width:auto;
}

.toolbar {
    line-height: 32px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 3px;
}
    .toolbar .form-control {
        padding: 0.35rem 0.35rem;
    }
    .toolbar img:hover {
        cursor: pointer;
    }
    .toolbar img {
        margin-right:2px;
    }
    .toolbar label {
        margin-left: 2px;
    }
.neo-logo {
    font-size: 1.6rem;
}



.dropdown-menu {
    z-index: 3000;
}

    .dropdown-menu li a {
        padding-left: 25px;
    }

    .dropdown-menu li.checked a {
        padding-left: 5px;
    }

        .dropdown-menu li.checked a:before {
            content: "\e013";
            width: 20px;
            display: inline-block;
            font-family: "Glyphicons Halflings";
            font-style: normal;
            font-weight: 400;
            line-height: 1;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }


table.normal {
    border: thin solid #333;
    background-color: #eee;
    color: #333;
    max-width: 1300px;
}

    table.normal td {
        padding: 3px 6px;
    }

    table.normal th {
        padding: 8px 6px;
        background-color: #107298;
        color: #eee;
        font-weight: normal;
    }

    a.dropdown-toggle {
        color: #fff !important;
    }

.btn-default {
    background-color: #f4f4f4;
}

.modal-header img {
    width: 32px;
}

.input-group img {
    width: 18px;
}

#content {
    margin-left:10px;
}

.btn-ies {
    color: white;
    background-color: #107298;
}

.panel-ies {
    background-color: #444;
    padding: 6px;
    margin-bottom: 20px;
}