#banner {
    background: url('../images/BackGround/bg-site.jpg') no-repeat fixed;
    -ms-background-size: cover;
    background-size: cover;
    min-height: 900px;
    position: relative;
}

.content-wrapper {
    display: none;
}

.bg-color {
    background-color: RGBA(116, 125, 83, 0.78);
    min-height: 900px;
}

.banner-info {
    padding-top: 190px;
}

.banner-logo img {
    display: inline-block;
}

.banner-text {
    color: #fff;
}

    .banner-text h1 {
        font-family: 'Candal', sans-serif;
        font-size: 35px;
        text-transform: uppercase;
        padding-bottom: 15px;
    }


.move-left {
    width: auto;
    box-shadow: none;
}

.panel-heading span {
    margin-top: -26px;
    font-size: 15px;
    margin-right: -12px;
}

.clickable {
    background: rgba(0, 0, 0, 0.15);
    display: inline-block;
    padding: 6px 12px;
    border-radius: 4px;
    cursor: pointer;
}

.panel-table .panel-body {
    padding: 0;
}

    .panel-table .panel-body .table-bordered {
        border-style: none;
        margin: 0;
    }

        .panel-table .panel-body .table-bordered > thead > tr > th:first-of-type {
            text-align: center;
            width: 100px;
        }

        .panel-table .panel-body .table-bordered > thead > tr > th:last-of-type,
        .panel-table .panel-body .table-bordered > tbody > tr > td:last-of-type {
            border-right: 0px;
        }

        .panel-table .panel-body .table-bordered > thead > tr > th:first-of-type,
        .panel-table .panel-body .table-bordered > tbody > tr > td:first-of-type {
            border-left: 0px;
        }

        .panel-table .panel-body .table-bordered > tbody > tr:first-of-type > td {
            border-bottom: 0px;
        }

        .panel-table .panel-body .table-bordered > thead > tr:first-of-type > th {
            border-top: 0px;
        }

.panel-table .panel-footer .pagination {
    margin: 0;
}

/*
used to vertically center elements, may need modification if you're not using default sizes.
*/
.panel-table .panel-footer .col {
    line-height: 34px;
    height: 34px;
}

.panel-table .panel-heading .col h3 {
    line-height: 30px;
    height: 30px;
}

.panel-table .panel-body .table-bordered > tbody > tr > td {
    line-height: 34px;
}



/*********************
COMMAND BAR
*********************/

.command-bar {
    padding: 10px 0;
}

    .command-bar.bottom {
        border-top: 2px solid #dcdcdc;
        border-bottom: none;
        margin-top: 1em;
    }

    .command-bar button,
    .command-bar .button {
        height: 40px;
    }

    .command-bar .spacer {
        width: 0.75em;
        height: 1em;
        display: inline-block;
    }

        .command-bar .spacer.wide {
            width: 2em;
        }

    .command-bar .configureAlert,
    .command-bar .right-buttons {
        float: right;
        padding: 0.4em 0;
    }

a.configureAlertType {
    background: url(images/buttons/Cog-blue-18x18.png) no-repeat 0 3px;
    padding: 3px 0 5px 25px;
}

.command-bar .static-bar {
    overflow: hidden;
}


/*********************
BOTTOM BUTTON BAR
*********************/

.bottom-buttons {
    border-top: solid 2px #dcdcdc;
    padding: 10px 0;
    margin-top: 1.25em;
}

    .bottom-buttons a,
    .bottom-buttons .flat {
        margin-left: 6px;
        margin-right: 6px;
    }

        .bottom-buttons a.button {
            margin-left: 0;
            margin-right: 10px;
            padding: 0 12px;
            display: inline-block;
            border-bottom: 2px solid #B4B4B4;
            background-color: #DCDCDC;
            color: #373737;
            line-height: 40px;
        }

    .bottom-buttons.right-buttons {
        text-align: right;
    }

/*********************
HELP BUTTON
*********************/

.interactive-help {
    background: url(images/buttons/14x14_question.png) 0 0 no-repeat;
    display: inline-block;
    width: 14px;
    height: 14px;
    text-align: left;
    text-decoration: none;
    margin-left: 3px;
}

    .interactive-help:hover {
        background: url(images/buttons/14x14_question.png) 0 0 no-repeat;
        text-decoration: none;
    }

    .interactive-help:active {
        background: url(images/buttons/14x14_question.png) 0 0 no-repeat;
        text-decoration: none;
    }

h1 > .interactive-help {
    background: url(images/buttons/14x14_question.png) 0 12px no-repeat;
    display: inline-block;
    width: 14px;
    height: 26px;
    text-align: left;
    text-decoration: none;
    margin-left: 3px;
}

    h1 > .interactive-help:hover {
        background: url(images/buttons/14x14_question.png) 0 12px no-repeat;
        text-decoration: none;
    }
/*==============================================================================*/
/*==============================================================================*/
/*==============================================================================*/

.alertInboxBigMessageContainer {
    min-height: 200px;
    display: none;
    border-top: 1px solid #dcdcdc;
    border-bottom: 1px solid #dcdcdc;
}

/* Unread */
.alerts .channelsList .hasUnread,
.alertRowNew.unread {
    font-weight: bold;
    color: #4c4c4c;
}

table.alertsGrid {
    width: 100%;
    margin: 5px 0;
    table-layout: fixed;
}

.alerts .alertsGrid .selector-column {
    text-align: center;
}

.alertsGrid td,
.alertsGrid th {
    overflow: hidden;
    white-space: nowrap;
    vertical-align: middle;
}

.alertsGrid .active-column {
    text-overflow: ellipsis;
    padding: 2px;
}

.alertsGrid .alertRowNew {
    border-bottom: 1px solid #DDD;
    height: auto;
}

/* Severity history displays */
.severityHistoryTableContainer td {
    padding-right: 1em;
    vertical-align: middle;
}

    .severityHistoryTableContainer td.rightmostColumn {
        padding-right: 0;
    }

.severityHistoryTableContainer img {
    margin-right: 0.5em;
    vertical-align: middle;
}

/* Hover commands */
.alertsGrid td.actions {
    text-align: right;
}

.alertsGrid .alertRowNew .hoverCommands {
    display: inline;
    visibility: hidden;
    margin: 0.7em 0.7em 0.2em 0;
    font-weight: normal;
}

.alertsGrid .alertRowNew:hover .hoverCommands,
.alertsGrid .alertRowNew:hover .hoverCommands {
    visibility: visible;
}

/* Filter and paging bar */
.command-bar.filterAndPagingBar {
    padding: 0;
}

.alerts .filterAndPagingBar {
    margin: 0 0 5px 0;
    border: 0;
}

.alerts .filterOptionsAdvanced {
    display: none;
}

#below-grid .filterAndPagingBar .tab-button-container {
    display: none;
}


.filterAndPagingBar .showOrHideAdvancedFilterOptions {
    display: inline-block;
    height: 1em;
}

.filterAndPagingBar .showAdvancedFilterOptions,
.alerts .filterAndPagingBar .hideAdvancedFilterOptions {
    position: absolute; /* Hack to fix animation */
}

.filterAndPagingBar .tab-button-container {
    /*    width: 310px; /* hack so that advanced filter options fits within tab when positioned absolutely - needs to cope with long filter names */
    padding: 3px 0px;
}

.showAdvancedFilterOptions a img, .hideAdvancedFilterOptions a img {
    margin: 2px 0 0 5px;
}

.showAdvancedFilterOptions a div, .hideAdvancedFilterOptions a div {
    padding-left: 1em;
    height: 1em;
    float: left;
    text-align: right;
}

.filterAndPagingBar .hideAdvancedFilterOptions {
    display: none;
}

option.builtIn {
    font-style: italic;
}
/* this doesn't work chrome */

/* Delete filter icon (Todo: Replace with our own icon) */
.filterAndPagingBar .deleteFilterSettings {
    display: inline-block;
    width: 17px;
    height: 18px;
    vertical-align: middle;
    background-image: url(images/ui-icons_000000_256x240.png);
    background-position: -176px -97px;
}

    .filterAndPagingBar .deleteFilterSettings:hover {
        background-image: url(images/ui-icons_0066ff_256x240.png);
    }

/* Advanced options */
.filterOptionsAdvanced.tab-button-contents {
    top: -1px;
}

.filterOptionsAdvanced {
    padding: 15px;
    margin-top: 5px;
}

    .filterOptionsAdvanced .showCheckboxes tr {
        vertical-align: top;
    }

    .filterOptionsAdvanced .showCheckboxes td {
        padding: 0px 2em 0px 0px;
    }

    .filterOptionsAdvanced .showCheckboxes .checkboxColumn {
        min-width: 6em;
    }

    .filterOptionsAdvanced .fieldGrid > tbody > tr > td {
        padding: 1em 0 0 0;
    }

    .filterOptionsAdvanced input[name=alertTextContains] {
        width: 20em;
        padding: 0.3em;
        margin-top: -0.3em;
    }

    .filterOptionsAdvanced .label {
        font-weight: bold;
        color: #808080;
        padding-bottom: 0.3em;
    }

    .filterOptionsAdvanced .timeSettingControls {
        padding: 0.4em 0 1em 0;
    }

        .filterOptionsAdvanced .timeSettingControls td {
            padding: 0 0 0.3em 0;
        }

        .filterOptionsAdvanced .timeSettingControls div.timelabel {
            width: 4.5em;
            text-align: right;
        }

        .filterOptionsAdvanced .timeSettingControls select {
            width: 12em;
        }

    .filterOptionsAdvanced .showCheckboxes .group {
        padding-bottom: 0.5em;
    }

        .filterOptionsAdvanced .showCheckboxes .group div.label /*Todo: Use a different global class and get rid of this*/ {
            font-weight: bold;
            color: #808080;
            padding-bottom: 0.3em;
        }

    .filterOptionsAdvanced .showCheckboxes label {
        display: block;
        margin-top: 0.35em;
    }

    .filterOptionsAdvanced .commands {
        text-align: right;
    }

    .filterOptionsAdvanced .timeSettingControls .timelabel {
        float: left;
        width: 3em;
        text-align: right;
        margin-right: 0.5em;
    }

    .filterOptionsAdvanced .timeSettingControls > div {
        margin-bottom: 0.2em;
    }

    .filterOptionsAdvanced .saveFilterSettingsDialog {
        display: none;
    }

.saveFilterSettingsDialog input[type=text] {
    width: 100%;
}

/* Filter alert type dialog (todo:lots of this should be made global and classes removed) */
.alerts .filterAlertTypesDialog {
    display: none;
}

.filterAlertTypesDialog .alertTypesList {
    border: 1px solid silver;
    margin-bottom: 0.8em;
    padding: 0 0.5em 0.5em 0.5em;
    height: 15em;
    overflow-y: scroll;
}

    .filterAlertTypesDialog .alertTypesList .category {
        font-weight: bold;
        color: #808080;
        margin: 0.6em 0 0.4em 0;
    }

    .filterAlertTypesDialog .alertTypesList .alertType {
        color: #808080;
        line-height: 1.7em;
        margin-left: 0.5em;
    }

        .filterAlertTypesDialog .alertTypesList .alertType.selected {
            font-weight: bold;
            color: #000;
        }

.filterAlertTypesDialog .selectionInfo {
    float: right;
    margin-top: 5px;
}

.filterAlertTypesDialog .selectAll {
    margin-right: 0.5em;
}

.filterAlertTypesDialog .searchBox {
    margin-bottom: 1em;
    border: 1px solid silver;
    -moz-border-radius: 0.7em;
    -webkit-border-radius: 0.7em;
    padding: 0 0.7em 0 0.2em;
}

    .filterAlertTypesDialog .searchBox table {
        width: 100%;
    }

        .filterAlertTypesDialog .searchBox table td {
            padding: 0.1em 0.2em 0.1em 0;
        }

    .filterAlertTypesDialog .searchBox .searchIcon {
        display: inline-block;
        width: 17px;
        height: 17px;
        margin-top: 0.4em;
        background-image: url(images/ui-icons_000000_256x240.png);
        background-position: -160px -114px;
    }

    .filterAlertTypesDialog .searchBox .searchText {
        width: 100%;
        border-width: 0;
        font-size: 1.2em;
        outline: none;
    }

    .filterAlertTypesDialog .searchBox .watermarkText {
        font-size: 1.1em;
        padding-top: 0.6em;
    }

    .filterAlertTypesDialog .searchBox .delete-icon {
        background-image: url(images/ui-icons_000000_256x240.png);
        vertical-align: top;
        margin-top: 0.1em;
    }

        .filterAlertTypesDialog .searchBox .delete-icon:hover {
            background-image: url(images/ui-icons_0066ff_256x240.png);
        }

/* Paging controls */
.paging-controls {
    line-height: 32px;
    padding-right: 10px;
}

.alerts .pagingControls .resultsCount {
    font-weight: bold;
    padding-right: 0.5em;
}

.alerts .pagingControls a, .alerts .pagingControls .disabled-link {
    margin: 0 0 0 0.5em;
}

.alerts .pageSizeControls {
    margin-right: 2.5em;
}

/*Add comment dialog (Todo: Labels in html should be given standard classes*/
.comment-dialog {
    display: none;
}

    .comment-dialog table,
    .comment-dialog input[type=text],
    .comment-dialog textarea {
        width: 100%;
    }

    .comment-dialog textarea {
        height: 10em;
        padding: 0.2em;
    }

.bootstrap-select.btn-group .btn .filter-option {
    display: inline-block !important;
    overflow: hidden !important;
    width: 100% !important;
    text-align: right !important;
}

.bootstrap-select.btn-group .dropdown-toggle .filter-option {
    float: right;
}