/* Minification failed. Returning unminified contents.
(611,19): run-time error CSS1062: Expected semicolon or closing curly-brace, found '!important'
 */
body {
    padding-top: 50px;
    padding-bottom: 20px;
    font-family: "Helvetica Neue", "BBAlpha Sans", "S60 Sans", Arial, Helvetica, "sans-serif";
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

h1, .h1, 
h2, .h2, 
h3, .h3, 
h4, .h4, 
h5, .h5, 
h6, .h6{
    font-family: "HelveticaNeue-Light", "Helvetica Neue", Arial
}

/* fix for IE auto hiding scrollbar */
/* http://stackoverflow.com/questions/17045132/scrollbar-overlay-in-ie10-how-do-you-stop-that-might-be-bootstrap */
@-ms-viewport{ 
    width: auto !important; 
} 

.hiddenSlickColumn {
    display: none !important;
}
.navbar-inverse {
    background-color: #26517F;
    border-color: #feeefe;
}

.navbar-inverse .navbar-text{
    color: #feeefe;    
}

.navbar-inverse a.navbar-brand,
.navbar-inverse .navbar-nav > li > a,
.navbar-inverse .navbar-nav > li > a:visited {
    color: #feeefe;
}

.navbar-inverse a.navbar-brand:hover,
.navbar-inverse .navbar-nav > li > a:hover {
    background-color: #003671;
}

@media (max-width: 768px) {
    .navbar-collapse ul li.navbar-text {
        padding-left: 15px;
    }
}

.slickgrid {
    min-height: 200px;
    margin-top: 15px;
}

/* menu
----------------------------------------------------------*/
ul#menu {
    font-size: 1.3em;
    font-weight: 600;
    margin: 0 0 5px;
    padding: 0;
    text-align: right;
}

ul#menu li {
    display: inline;
    list-style: none;
    padding-left: 15px;
}

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

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

ul#menu li a.active {
    color: #f00;
}

.display-label {
    clear: left;
    float: left;
    width: 12em;
    font-weight: bold;
}

    .display-label label {
        display: block;
        font-size: 1.0em;
        font-weight: 600;
        line-height: 2.0em;
        vertical-align: middle;
        margin: 5px 6px 6px 0;
    }

.display-field {
    float: left;
    padding: 0.25em;
}


ul.checkboxes {
    list-style: none;
    padding: 0;
}

    ul.checkboxes li label {
        list-style: none;
        font-weight: normal;
    }

ul.indented-list {
    list-style: none;
    padding: 0;
}

    ul.indented-list .parameter-label {
        padding: 0 0 0 30px;
    }

.report-label {
    font-size: 1.2em;
}

.label-normal {
    font-weight: normal;
}

/* Customer dropdown list */
.customer {
    width: 450px;
    margin-left: 10px;
    padding: 6px 12px 6px 12px;
    font-weight: bold;
    font-size: large;
}

.dropdown-label {
    font-weight: bold;
    font-size: 14pt;
    width: 200px;
    display: inline-block;
    width: auto;
}

.ticket-number-error {
    font-weight: bold;
    color: red;
    margin-bottom: 10px;
}

.barge-events {
    width: 90%;
    max-width: 1137px;
}

.barge-location {
    width: 75%;
    max-width: 400px;
}

/* tables
----------------------------------------------------------*/
table {
    border-collapse: collapse;
    border-spacing: 0;
    margin-top: 0.75em;
    border: 0 none;
}

th {
    font-size: 1.2em;
    text-align: left;
    border: none 0px;
    padding-left: 0;
    padding-right: 1em;
}

th a {
    display: block;
    position: relative;
}

th a:link, th a:visited, th a:active, th a:hover {
    color: #333;
    font-weight: 600;
    text-decoration: none;
    padding: 0;
}

th a:hover {
    color: #000;
}

th.asc a, th.desc a {
    margin-right: .75em;
}

th.asc a:after, th.desc a:after {
    display: block;
    position: absolute;
    right: 0em;
    top: 0;
    font-size: 0.75em;
}

th.asc a:after {
    content: '▲';
}

th.desc a:after {
    content: '▼';
}

td {
    padding: 0.25em 2em 0.25em 0em;
    border: 0 none;
}

tr.odd {
    background-color: #fff;
}

td.abreviate {
    max-width: 300px;    
    overflow: auto;
    white-space: nowrap;
}

tr.pager td {
    padding: 0 0.25em 0 0;
}

.pager
{
    width: 32em;
    margin: 1em auto 0.25em auto;
}

.pager-numbers 
{
    width: 20em;
    font-size: 1.0em;
    margin-left: auto;
    margin-right: auto;    
    float: left;
    text-align: center;
}

.pager-previous 
{
    font-size: 1.2em;
    float: left;
    width: 4.0em;
    text-align: right;
}

.pager-number
{
}

.pager-next 
{
    font-size: 1.2em;
    float: left;
    width: 4.0em;
    text-align: left;
}

.pager-selected
{
    font-weight: bold;
}

#message-container{
    position: absolute;
    bottom: 4px;
    left: 4px;
    z-index: 10000;
}

#message-container ul {
    margin: 0;
    padding: 0 10px 0 10px;
    list-style: none;    
}

.error {
    color: #e80c4d;
}

.wait-spinner {
    display: none;
    position: absolute;
    bottom: 24px;
    left: 24px;
    padding: 1.0em;
    border: solid 1px #dfdfdf;
    border-radius: 5px;
    background-color: #99CAFF;
    font-weight: bold;
    color: #4b4b4b;
    min-width: 310px;
    z-index: 10001;   
}

.wait-spinner.long-spin {
    background-color: #fff993;
}

.wait-spinner div {
    background-image: url('../../images/ajax-loader.gif');
    background-position: center left;
    background-repeat: no-repeat;
    padding: 0 0 0 24px;
}

.wait-spinner img{
    display: inline-block;
    margin-right: 0.5em;
    vertical-align: middle;
    height: 16px;
    width: 16px;
}
/* styles for validation helpers */
.field-validation-error {
    color: #b94a48;
}

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

input.input-validation-error {
    border: 1px solid #b94a48;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

.validation-summary-errors {
    color: #b94a48;
}

.validation-summary-valid {
    display: none;
}
/********************
*   Mobile Styles   *
********************/
@media only screen and (max-width: 850px) {

    /* header
    ----------------------------------------------------------*/
    header .float-left,
    header .float-right {
        float: none;
    }

    /* logo */
    header .site-title {
        margin: 10px;
        text-align: center;
    }

    /* login */
    #login {
        font-size: .85em;
        margin: 0 0 12px;
        text-align: center;
    }

        #login ul {
            margin: 5px 0;
            padding: 0;
        }

        #login li {
            display: inline;
            list-style: none;
            margin: 0;
            padding: 0;
        }

        #login a {
            background: none;
            color: #999;
            font-weight: 600;
            margin: 2px;
            padding: 0;
        }

        #login a:hover {
            color: #333;
        }

    /* menu */
    nav {
        margin-bottom: 5px;
    }

    ul#menu {
        margin: 0;
        padding: 0;
        text-align: center;
    }

        ul#menu li {
            margin: 0;
            padding: 0;
        }


    /* main layout
    ----------------------------------------------------------*/
    .main-content,
    .featured + .main-content {
        background-position: 10px 0;
    }

    .content-wrapper {
        padding-right: 10px;
        padding-left: 10px;
    }

    .featured .content-wrapper {
        padding: 10px;
    }

    /* page content */
    article, aside {
        float: none;
        width: 100%;
    }

    /* ordered list */
    ol.round {
        list-style-type: none;
        padding-left: 0;
    }

        ol.round li {
            padding-left: 10px;
            margin: 25px 0;
        }

            ol.round li.zero,
            ol.round li.one,
            ol.round li.two,
            ol.round li.three,
            ol.round li.four,
            ol.round li.five,
            ol.round li.six,
            ol.round li.seven,
            ol.round li.eight,
            ol.round li.nine {
                background: none;
            }

     /* features */
     section.feature {
        float: none;
        padding: 10px;
        width: auto;
     }

        section.feature img {
            color: #999;
            content: attr(alt);
            font-size: 1.5em;
            font-weight: 600;
        }

    /* forms */
    input {
        width: 90%;
    }

    /* login page */
    #loginForm {
        border-right: none;
        float: none;
        width: auto;
    }

        #loginForm .validation-error {
            display: block;
            margin-left: 15px;
        }

    #socialLoginForm {
        margin-left: 0;
        float: none;
        width: auto;
    }


    /* footer
    ----------------------------------------------------------*/
    footer .float-left,
    footer .float-right {
        float: none;
    }

    footer {
        text-align: center;
        height: auto;
        padding: 10px 0;
    }

        footer p {
            margin: 0;
        }
}

/************************************
*   Client specific customization   *
************************************/

/*
    HeaderLogo
    Menu
    Menu Hover Over
    Menu Selected
    Header background?
    header HR line

    slickgrid elements
    button BG color?
    footer, HR (?)
  */


/******************************
 * Page Header and Menu styles
 ******************************/

/* bootstrap nav bar / menuing */
.navbar {
    border-color: #0E487A;
    background-color: #FFFFFF;
}

.navbar .navbar-text {
    color: #FFFFFF;
}

.nav-pills > li > a {
    color: #0E487A;
    font-weight: bold;
}

a.navbar-brand,
.navbar-default .navbar-nav > li > a,
.navbar-nav > li > a,
.navbar-nav > li > a:visited {
    color: #0E487A;
    padding: 10px 10px;
    font-weight: normal;
    font-size: 14px;
}

.navbar-default .navbar-nav > .active > a, 
.navbar-default .navbar-nav > .active > a:active, 
.navbar-default .navbar-nav > .active > a:hover, 
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    background-color: transparent;
    color: #8a2a2b;
    padding: 10px 10px;
    font-weight: bold;
    text-decoration: underline;
}

/* right hand menu (user/logoff) */
.navbar-right {
    padding-right: 20px;
}

/* nav bar branding (img or txt)*/
.navbar-brand {
    height: auto;
    padding: 7px 20px;
}

/* to display an image as branding, set the URL and Height/Width here*/
.brand-img{
    background-image: url('/Content/images/MastheadBrand - HFL.png');
    background-repeat: no-repeat;
    height: 75px;
    width: 300px;
	border: none;
}

.navbar-default .navbar-brand {
    border: none; !important;
}

.navbar-header .navbar-brand {
  background: transparent !important;
}

/*only add margin on big screens - suppress when nav bar collapses*/
@media (min-width: 768px) {
    .navbar-nav > li {
        /*adjust this to account for LOGO height*/
        margin-top: 35px;
    }
}

@media (max-width: 768px) {
    .navbar-collapse ul li.navbar-text {
        padding-left: 15px;
    }
}

/**************************
 * Body and Content styles
 **************************/
/* body style - set padding-top to avoid content overrunning navbar */
body {
    padding-top: 100px;
}

/* paragraph style */
p {
}

/* HTML Headings, both TAG and CLASS */
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    color: #044074;
    font-weight: 700;
}

/* HTML Headings secondary text, both TAG and CLASS */
h1 small, h1 .small, .h1 small, .h1 .small,
h2 small, h2 .small, .h2 small, .h2 .small,
h3 small, h3 .small, .h3 small, .h3 .small,
h4 small, h4 .small, .h4 small, .h4 .small,
h5 small, h5 .small, .h5 small, .h5 .small,
h6 small, h6 .small, .h6 small, .h6 .small {
}

/* alerts */
.alert-success {
}
.alert-info {
}
.alert-warning {
}
.alert-danger {
}

/* Paged Observables */
.pager-numbers {
    font-size: 1.4em;
    width: 100%;
}
.pager-previous {
    font-size: 1.6em;
}
.pager-next {
    font-size: 1.6em;
    float: right;
}

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

/* Barge Search custom styles */
.filter-container {
    position: absolute;
    top: 95px; /* offset for NavBar, BrandImage, Alert bar */
    bottom: 35px; /* offset for Footer */
    width: 285px;
    /*left: 0px;
    right: 300px;*/
    display: block;
    overflow-x: hidden;
    overflow-y: auto;
}

body.message-padding .filter-container {
    top: 140px; /* offset for NavBar, BrandImage, Alert bar */
}

.filter-group {
    padding-bottom: 5px;
}

.filter-header {
    font-weight: bold;
    display: inline-block; /* allow CLEAR link to be on same line */
    padding-top: 5px;
}

.filter-item {
    padding-left: 10px;
}

/* Barge search - barge # text box */
.filter-item > .form-control.barge-number {
    display: inline-block;
    width: 200px;
    margin-top: 5px;
}

.checkbox.filter-item {
    padding-left: 30px; /* need 20px for checkbox */
    margin-top: 5px;
    margin-bottom: 0px;

}

.filter-header + .filter-action {
    padding-left: 10px;
}

.filter-action {
}

.search-grid-full {
    position: absolute;
    top: 95px; /* offset for NavBar, BrandImage, Alert bar */
    bottom: 35px; /* offset for Footer */
    left: 325px; /* offset for filter area */
    right: 0px;
}

body.message-padding .search-grid-full {
    top: 140px; /* offset for NavBar, BrandImage, Alert bar */
}

.search-grid-full .slickgrid-wrapper {
    margin-bottom: 0px;
}


.search-grid-full .slickgrid {
    min-height: 0px;
    margin-top: 5px;
    position: absolute;
    top: 80px;
    bottom: 0px;
    right: 0px;
    left: 0px;
}   

/*.no-message-pad {
    top: 95px;
}*/

.inline-control {
    display: inline-block;
}

.btn-primary {
    background-color: #8a2a2b;
    border-color: #8a2a2b;
    color: #FFFFFF;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
    background-color: #5a2424;  /* slightly darker */
    border-color: #5a2424;
    color: #FFFFFF;
}

/****************
 * Footer styles 
 ****************/
.footer {
    border-top-color: #0E487A;
    border-top-style: solid;
    border-top-width: 1px;
    text-align: center;
    position: fixed;
    bottom: 0px;
    left: 0px;
    right: 0px;
    background-color: #8a2a2b;
    z-index: 100;
    color: #FFFFFF;
}

/*********************
 * SlickGrid stylings
 *********************/
.slickgrid {
    min-height: 0px;
    margin-top: 15px;
}   

.slickgrid-wrapper {
    margin-top: 15px;
    margin-bottom: 15px;
}

.slickgrid-wrapper .slickgrid-toolbar {
    margin: 0;
    background-color: #EDF1F1;
    padding: 5px;
}

.slickgrid-wrapper .slickgrid-toolbar li {
    display: inline-block;
    list-style: none;
    padding: 0;
    margin: 0 4px 0 0;    
    white-space: nowrap;
}

.slickgrid-wrapper .slickgrid-toolbar li a {
    display: inline-block;
    padding: 0px 0px 0px 5px;
    margin: 0;
    text-decoration: underline;
}

.slickgrid-wrapper .slickgrid-header {
    font-weight: bold;
    font-size: 14pt;
}


li.slickgrid-status-text {
    float: right;
}

.slickgrid-status-text {
    padding-right: 20px;
}

/* Modals */
.modal-body {
    padding: 20px;
}

.modal-header {
    padding-bottom: 5px;
}

.modal-footer {
    margin-top: 0px;
    padding: 10px;
}

/* Extra-large Modal for Barge Events */
@media (min-width: 768px) {
    .modal-xl {
        width: 90%;
        max-width: 1200px;
    }
}