html, body {

    /*font-size: 12px !important;*/
}

/* crez css styles */
#ogrid-qsearch-hint {
    position: relative;
    top: -34px;
    left: calc(100% - 32px);
}

/*quick search popover */
.ogrid-qsearch-popover  {
    top: 44px !important;
    z-index: 5000;
}

.ogrid-qsearch-popover .popover-content  {
    font-size: small;
    padding: 10px;
    width: 272px;
    overflow-y: auto;
    height: 600px;
}

/* mobile styles for quick search hint */
@media (max-width: 480px) {
    .ogrid-qsearch-popover {
        width: 230px;
    }
}

/* override bootstrap default to avoid having a 'fat' nav bar*/
#ogrid-search .input-group {
    display: block;
}

#ogrid-search .form-group {
    margin-bottom: 0px;
}

.col-pdng-lft-0 { padding-left:0;}
#ogrid-container #ogrid-nav { background:#2b323c;}
#ogrid-container #ogrid-nav.navbar-default { border-color:#2b323c;}
#ogrid-menu .btn-default { background-color:transparent; color:#dfe6ec;}
#ogrid-menu .btn{border: 2px solid #e0e5eb; border-radius: 10px;}
.navbar-default .navbar-nav > li > a { color:#dfe6ec;}
.navbar-default .navbar-nav > li > a:hover { color:#FFFFFF;}
#qsearch-input { border-radius:9px;}
#ogrid-task-advanced-search.ogrid-task-pane { background-color:#73c4e1; opacity:0.95;}
#ogrid-adv-tabs.nav-tabs > li > a { border:none; background-color:transparent; color:#1a3f59;}
#ogrid-adv-tabs.nav-tabs > li.active > a { border:none; background-color:transparent; color:#FFFFFF;}
#ogrid-content .leaflet-popup-content-wrapper { background:#464e61; color:#DFE6EC;}
#ogrid-content .leaflet-popup-tip {background:#464e61;}
#ogrid-content .nav-tabs { border:none;}
#ogrid-content .panel-default { border:none;}
#ogrid-content .panel { background-color:transparent; box-shadow:none; border:none;}
#ogrid-content .panel-default > .panel-heading { background-color:transparent; color:#FFF;}
#ogrid-adv-content .form-control { background-color:transparent; border:none; box-shadow:none; color:#4984a2; font-weight:bold;}
#ogrid-adv-content .control-label label { color:#FFFFFF; text-align:left;}
#ogrid-adv-content label { color:#FFFFFF; text-align:left;}
#ogrid-adv-content .btn-primary {background-color:#28303d}
#ogrid-adv-content .form-control::-webkit-input-placeholder {color: #4984a2;}
#ogrid-adv-content .form-control:-moz-placeholder { /* Firefox 18- */ color: #4984a2; }
#ogrid-adv-content .form-control::-moz-placeholder {  /* Firefox 19+ */ color: #4984a2; }
#ogrid-adv-content .form-control:-ms-input-placeholder { color: #4984a2; }

#ogrid-adv-content .panel-heading {
    cursor: pointer;
    /*padding:5px 10px!important;*/
}


/* select box CSS */
#commonlyUsedQueries, #lastSavedQueries {padding:3px; margin: 0; -webkit-border-radius:4px; -moz-border-radius:4px;    border-radius:4px; -webkit-box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset; -moz-box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset;    box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset; background: #f8f8f8; color:#888; border:none; outline:none; display: inline-block; -webkit-appearance:none; -moz-appearance:none; appearance:none; cursor:pointer;}
/* Targetting Webkit browsers only. FF will show the dropdown arrow with so much padding. */
@media screen and (-webkit-min-device-pixel-ratio:0) { #commonlyUsedQueries, #lastSavedQueries {padding-right:18px} }
#ogrid-adv-content div.cmnqry:after {content:'..'; color:#4984a2; -webkit-transform:rotate(90deg); -moz-transform:rotate(90deg); -ms-transform:rotate(90deg); transform:rotate(90deg); right:25px; top:0px; position:absolute; pointer-events:none; font-size:30px; font-weight:bold;}
#ogrid-adv-content div.svdqry:after {content:'..'; color:#4984a2; -webkit-transform:rotate(90deg); -moz-transform:rotate(90deg); -ms-transform:rotate(90deg); transform:rotate(90deg); right:25px; top:0px; position:absolute; pointer-events:none; font-size:30px; font-weight:bold;}


.query-builder .rules-group-container {
    padding: 5px 5px 0px 0px;

    border:none !important;
    background: none !important;
}
.query-builder .rules-group-container .btn-success {background-color: #28303D !important; border-color:#73C4E1 !important;}
#ogrid-ds-tabs .regtab a {background-color:transparent !important; border:1px #FFFFFF solid !important; border-radius: 10px; }
.query-builder .rules-group-container .btn-danger {color: #28303D; background-color:transparent !important; border: none;
    font-size: 1.5em;}
#advSearchSave {color:#fff !important; background-color:#28303D !important; border-color:#2E6DA4 !important;}
.query-builder .rules-group-container .btn-danger:hover {opacity: 0.6; }

::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment { height: 0px; display: block; background-color: black;}

::-webkit-scrollbar-track-piece {
    background-color: #73c4e1;          /*Global Track Peice(the slider noob.)*/
    -webkit-border-radius: 6px;
}
::-webkit-scrollbar-thumb:vertical {
    height: 50px;
    background-color: #2b323c;            /* Up/Down slider background*/
    -webkit-border-radius: 6px;
}
::-webkit-scrollbar-thumb:horizontal {
    width: 50px;
    background-color: #666;            /* Side/Side slider background*/
    -webkit-border-radius: 3px;
}


::-moz-scrollbar {width: 8px;height: 6px;}
::-webkit-scrollbar {width: 8px;height: 6px;}

::-moz-scrollbar-button:start:decrement,
::-moz-scrollbar-button:start:decrement { height: 0px; display: block; background-color: black;}

::-moz-scrollbar-track-piece {
    background-color: #2b323c;          /*Global Track Peice(the slider noob.)*/
    -webkit-border-radius: 6px;
}
::-moz-scrollbar-thumb:vertical {
    height: 50px;
    background-color: #666;            /* Up/Down slider background*/
    -webkit-border-radius: 6px;
}
::-moz-scrollbar-thumb:horizontal {
    width: 50px;
    background-color: #666;            /* Side/Side slider background*/
    -webkit-border-radius: 3px;
}


/* hide search button */
#qsearch-button {
    display: none;
}

html, body {
    /*font-size: 12px !important;*/
    font-family: 'Open Sans', sans-serif;
    /*font-size: 12px;*/
    /*font-weight: 300;*/
    /*font-family: 'Lato', sans-serif;*/
    //overflow-y: auto;;
}

.ogrid-task-pane .control-label {
    text-transform:uppercase;
    font-weight: 400;
    font-size: 13px;
}

.ogrid-task-pane .panel-heading {
    font-size: 18px;
    font-weight: 400;
}

.ogrid-task-pane .panel-body {
    padding-top: 0px;
    padding-bottom: 0px;
}


.ogrid-task-pane .nav-tabs a {
    font-weight: 600;
    padding-left: 10px;
}


.ogrid-task-pane .nav-tabs a:hover {
    text-decoration: underline;
}

.ogrid-task-pane {
    width: 550px;
}

.ogrid-task-pane .form-group {
    margin-bottom: 0px;
}

.ogrid-task-pane .col-xs-7 {
    padding-left: 0px;
}

.ogrid-task-pane .panel {
    padding-top: 10px;
}

.ogrid-task-pane .nav {
    padding-top: 15px;
}

#ogrid-adv-content .form-control  {
    font-weight: 300;
    color: rgb(51, 51, 51);
}

#advSearchSubmit, #advSearchReset, #advSearchSave {
    width: 120px;
}


#advSearchSubmit {
    margin-left: 35px;
    position: fixed;
    bottom: 35px;
}

#advSearchReset {
    position: fixed;
    bottom: 35px;
    margin-left: 165px;
}

.ogrid-color-panel {
    padding: 0px 10px 0px 10px !important;
}


#autorefresh-panel .control-label {
    padding-left: 0px;
}

#autorefresh-panel .spinner {
    width: 80px;
}

#savequery-panel  .panel-body {
    margin-left: 0px;
    padding-left: 10px;
}

@media (max-width: 550px) {
    .ogrid-task-pane {
        width: 100%;
        opacity: 1;
    }

    .ogrid-task-pane .form-control {
        padding-left: 0px;
    }
    .navbar-brand {
        display:none;
    }

    #ogrid-search {
        margin-left: 10px;
    }

}

/*make app name consistent with the command bar text color */
.navbar-default .navbar-brand {
    color: #dfe6ec;
}

.ogrid-task-pane .glyphicon-chevron-up, .glyphicon-chevron-down  {
    font-size: 12px;
}

#ogrid-ds-tabs a {
    font-weight:400;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-right: 10px;
}

.query-builder .form-control ::-webkit-input-placeholder  {

}

.ogrid-task-pane ::-webkit-input-placeholder  {
    font-weight: 600;
}

.ogrid-task-pane ::-moz-placeholder  {
    font-weight: 600;
}


.ogrid-task-pane :-ms-input-placeholder   {
    font-weight: 600;
}

.ogrid-task-pane .rule-value-container .form-control {
    font-weight: 300;
}

.ogrid-color-options {
    font-size: 12px !important;
    text-decoration: underline;
}

div#ogrid-dataset-filters.panel-body,  div#ogrid-geo-filters.panel-body {
    padding-left: 0px;
    padding-right: 0px;
}

.adv-search-geofilter label {
    text-transform:uppercase;
    font-weight: 400;
    font-size: 13px;
    width: auto;
}

#ogrid-adv-tabs a {
    font-size: 152%;
}

.adv-bottom-commandbar {
    background-color: #2480a0;
    margin-left: -25px;
    position: fixed;
    bottom: 0px;
    height: 80px;
    width: 100%;
    opacity: 1.0;
    z-index: 800;
}

/* Size when the advanced tabs header breaks */
@media (max-width: 342px) {
    #ogrid-adv-tabs a {
        font-weight: 800;
        font-size: 130%;
    }
}

/* distnguish between active and inactive AND/OR selection for dataset rule/filter */
#ogrid-adv-content .rules-group-container .btn-primary {
    background-color: #e6e6e6;
    color: #28303d;
}

#ogrid-adv-content .rules-group-container .btn-primary.active {
    background-color: #28303d;
    color: #e6e6e6;
}

.leaflet-popup-content a {
    color: lightskyblue;
}

#ogrid-help-icon {
    padding-top: 18px;
    padding-right: 10px;
    color: whitesmoke;
}

.no-underline-on-hover:hover { text-decoration: none; }
.no-underline-on-hover { text-decoration: none; }

/* mobile styles for help icon*/
@media (max-width: 845px) {
    #ogrid-help-icon {
        padding-left: 10px;
        font-size: 1.5em;
    }
}

.header-center {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 25px;
    margin-right: 0 !important;
    margin-top: 0 !important;
}

#ogrid-footer .panel-title a {
    padding-top: 0;
    padding-bottom: 0;
}

.ogrid-footer-panel {
    border-width: 0;
}

.ogrid-footer-panel-heading, .ogrid-footer-panel-heading .panel-title {
    color: #fff !important;
    background-color: #292e35 !important;
    border-width: 0 !important;
}
.ogrid-nav-btn .active {
    background-color: rgba(129, 131, 132, 0.97) !important;
}

.leaflet-control-attribution {
    /* adjusted due to increase in search results panel height */
    margin-bottom: 4px !important;
}

/* popovers in the table view */
.ogrid-arraycell-popover {
    z-index: 5000;
    width: 600px;
    max-width: 600px;
}

.ogrid-arraycell-popover .popover-content  {
    font-size: small;
    padding: 10px;
    width: 600px;
    overflow-y: auto;
    height: auto;
}

.ogrid-arraycell-popover .popover-title {
    font-size: small;
    background:#2b323c;
    color:#FFFFFF;
}


.ogrid-arraycell-popover button.close {
    position: absolute;
    top: 5px;
    right: 10px;
    color:#FFFFFF;
    font-weight: normal;
    opacity: 0.8;
}