.intervention_search_bar {
    display:inline-block;
    height:45.4px;
    /*max-width:300px;*/
    /*max-width:800px;*/
    max-width:100%;
    font-size:20px;
    line-height: 1.4375;
    /*color: #555;*/
    /*background-color: #fff;*/
    /*border: 1px solid #ccc;*/
    /*border-radius: 4px;*/
    /*box-shadow: inset 0 1px 1px rgba(0,0,0,.075);*/
}

#search_bar_div {
    position: relative;
}

#searchBtnBtn {
    position: absolute;
    right: 0px;
}


#intervention_search {
    /*color: #333;*/
    font-size: 20px;
}


.interventionColTitle {
    font-weight: bold;
    font-size: 22px;
}


.filterDD {
    max-width: 100%;
}

/*.pubYearFrom, .pubYearTo {*/
/*    height: 100px;*/
/*}*/


.pubYearFromToDiv {
    height: 50px;
}

.pubYearFrom, .pubYearTo {
    min-height: 50px;
}


.noUi-connect {
    background: #335075 !important;
}

.noUi-base {
    cursor: pointer;
}

.noUi-touch-area {
    cursor: pointer;
}


.noUi-value {
    top: -5px;
}


.interventionGroupDD[open] {
    border: none;
}


.interventionContainer {
    border: 2px solid #333;
    border-radius: 20px;
    margin-bottom: 10px;
    padding-bottom: 20px;
}

/*.interventionContainer:hover {*/
.interventionTitle:hover {
    cursor: pointer;
}

.selectedFilterButton {
    border-radius: 15px;
    border: none;
    margin: 5px;
}

.selectedFilterX {
    font-weight: bold;
    position: relative;
    bottom: 2px;
    left: 1px;
}

/* Style the remove-all-filters button appropriately as well */
#removeAllFiltersBtn {
    border-radius: 15px;
    border: none;
    margin: 5px;
    background-color: #333;
    color: white;
}

/* Have all filter buttons and the "clear filters" button appear on one line */
#removeAllFilters, #filtersSelected {
    display: inline;
}


/*.interventionTitle p {*/
/*    float: inline-start;*/
/*}*/

.interventionTitle h3 {
    display: inline-block;
}

@media (max-width: 499px) {
    .interventionTitle h3 {
        width: 85%;
    }
}

@media (min-width: 500px) {
    .interventionTitle h3 {
        width: 90%;
    }
}

.interventionTitle .expandCollapseDiv {
    /*width: 10%;*/
    /*float: inline-end;*/
    /*margin-top: 20px;*/
    
    position: absolute;
    top: 15px;
    right: 15px;
}

.expandCollapseButton {
    padding: 0px 7px;
    /*margin: 3px;*/
    margin: 3px 15% 3px 3px;
    /*float: inline-end;*/
}

/*@media (min-width: 650px) {*/
/*    .expandCollapseButton {*/
        /*margin: 3px 15% 3px 3px;*/
/*        float: inline-end;*/
/*    }*/
    
/*    .interventionTitle p {*/
/*        float: inline-start;*/
/*    }*/
/*}*/

/*@media (max-width: 649px) {*/
/*    .expandCollapseButton {*/
        /*margin: 3px 15% 3px 3px;*/
/*        float: none;*/
/*    }*/
    
/*    .interventionTitle p {*/
/*        float: none;*/
/*    }*/
/*}*/


#filterSearchDiv label.h3 {
    margin-top: 5px;
}

.filterDropdownGroup select, .filterDropdownGroup label {
    display: block;
}

.filterDropdownGroup select {
    width: 90%;
}

@media (min-width: 992px) {
    .filterDropdownGroup {
        width: 19.5%;
        display: inline-block;
        /*display: flex;*/
        
    }
    
    /*.filterDropdownGroup select {*/
    /*    max-width: 15%;*/
    /*}*/
}

@media (max-width: 991px) {
    .filterDropdownGroup {
        width:100%;
        /*display: inline-flex;*/
        display: block;
    }
    
    .filterDropdownGroup select {
        width: 75%;
    }
}


/* Make jump to top button div float above everything else, and style it accordingly (now that it includes more than just one button... */
#jumpButtonDiv {
    z-index: 11;
    
        background-color: #26374a;
        border-radius: 5px;
        padding: 10px;
}

#jumpButtonDiv p {
    color: white;
    font-weight: bold;
    margin: -6px 0 2.5px;
}

#jumpButtonDiv a {
    display: block;
    width: 100%;
}

#jumpButtonFilter {
    margin: 3px 0px;
}

#jumpButtonMethodology {
    margin: 0px 0px 3px;
}

/* Add space above the Methodology section/dropdown and fix spacing within the summary as well */
#methodology {
    margin-top: 20px;
}

#methodology summary, #intStats summary {
    padding-top: 0px;
    color: #333;
}

#methodology h2, #intStats h2 {
    /*color: #333;*/
    top: 5px;
    position: relative;
}


/* Style the new detailed/condensed button */
.selectedBtn {
    /*background-color: #335075;*/
    background-color: #26374a;
    color: white;
}

.selectedBtn:hover, .selectedBtn:focus {
    color: white;
    /*background-color: #335075;*/
    background-color: #26374a;
}

#detailedCondensedBtn {
    /*float: right;*/
    background-color: #26374a;
    color: white;
    min-width: 150px;
    margin-bottom: 20px;
}

/* Handle dynamic sizing of search bar div and condensed/detailed div... and also some timeframe dropdown styling fixes! */
#search_bar_div {
    display: inline-block;
}

@media (min-width: 768px) {
    #search_bar_div {
        width: 70%;
    }
    
    /*  Second/third line for testing different options... */
    /*#detailedCondensedDiv {*/
    /*    width: 25%;*/
    /*    float: right;*/
        /*margin-top: 30px;*/
    /*}*/
    
    #pubYearFromDiv {
        padding: 0px 10px 0px 0px;
    }
    
    #pubYearToDiv {
        padding: 0px 10px 0px 15px;
    }
    
}

@media (max-width: 767px) {
    #search_bar_div {
        width: 100%;
    }
    
    /*#detailedCondensedDiv {*/
    /*    width: 100%;*/
    /*    float: left;*/
    /*}*/
    
    #pubYearFromDiv {
        padding: 0px 0px 20px;
    }
    
    #pubYearToDiv {
        padding: 40px 0px 20px 0px
    }
    
}


/* Table styling */
.tableContainer {
    max-width: 100% !important;
    width: 100% !important;
    overflow-x: auto;
}

table.dataTable thead th {
    background-color: #335075;
    color: white;
}

/*.tdTable .sorting_desc .sorting_asc {*/
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc{
    background-color: #0B305E !important;
    color: white !important;
}

/* Stylize new search information collapsible element */
#searchInfo {
    /*display: inline;*/
    colour: #333
}
/*#searchInfo[open=false] {*/
/*    width: 50px;*/
/*}*/
/*#searchInfo[open=true] {*/
/*    width: 100%;*/
/*}*/

#searchInfo summary {
    color: #333;
}

@media (min-width: 768px) {
    #searchInfoDiv {
        display: inline;
    }
    
    /*#searchInfoDiv {*/
    #searchInfo:not([open]) {
        display: inline-block;
        position: relative;
        top: -40px;
    }
    /*#searchInfo[open=true] {*/
    /*    display: block;*/
    /*    position: static;*/
    /*}*/
}
@media (max-width: 767px) {
    #searchInfoDiv {
        display: block;
    }
}

/* Remove extra margin at the top of the selected filter header when appropriate */
@media (max-width:767px) {
    #filtersSelectedDiv h3 {
        margin-top: 20px !important;
    }
}
#filtersSelectedDiv h3 {
    margin-top: 0px;
}