input.search-bar {
    width: 100%;
    border-radius: 5px;
    border: 1px solid #CFCFCF!important;
}

input.search-bar:focus {
    width: 100%;
    border-radius: 5px;
    border: 1px solid #CFCFCF!important;
}

#search-all-button{
    height: 35px!important;
    width: 150px!important;
    font-size: 16px;
    padding-top: 7px!important;
}

/* Select2 searchbox section */
/* ========================= */
.select2-container{
    padding: 0 !important;
}

span.select-2-dropdown{
    position: absolute!important;
    top: -36px!important;
    border: 1px solid #d3d3d3!important;
    border-radius: 4px!important;
}

span.select2-dropdown--below{
    position: absolute!important;
    top: -36px!important;
    border: 1px solid #d3d3d3!important;
    border-radius: 4px!important;
}

input.select2-search__field{
    border: 1px solid #d3d3d3!important;
    border-radius: 4px!important;
}

.select2-default {
    color: #CFCFCF !important;
}

.select2-container--default .select2-selection--single {
    border: 1px solid #d3d3d3!important;
    min-height: 36px;
}

.select2-selection__placeholder{
    font-style: italic !important;
    font-size: 14px;
}

.select2-selection--single {
    height: 150%;
}

#select2-container {
    padding-left: 12px;
    padding-top: 2px;
}

#search-reset {
    display: table-cell; 
    font-size: 18px; 
    text-align: center; 
    cursor: pointer;
}

#search-reset:hover {
    color: #0067a0;
}

/* ========================= */
@media screen and (max-width: 320px) {
    #search-container > div.panel-body {
        border: none!important;
        background: none!important;
    }

    #search-container > div > input {
        border: 1px #CFCFCF solid!important;
        width: 94%;
        position: relative;
        margin: 10px 0;
        padding: 10px;
    }
}

@media screen and (min-width: 321px) and (max-width: 425px) {
    #search-container > div.panel-body {
        border: none!important;
        background: none!important;
    }

    #search-container > div > input {
        border: 1px #CFCFCF solid!important;
        width: 94%;
        position: relative;
        margin: 10px 0;
        padding: 10px;
    }
}


@media screen and (min-width: 426px) and (max-width: 767px){
    #search-container > div.panel-body {
        border: none!important;
        background: none!important;
    }

    #search-container > div > input {
        border: 1px #CFCFCF solid!important;
        width: 94%;
        position: relative;
        margin: 10px 0;
        padding: 10px;
    }
}

@media screen and (min-width: 768px) and (max-width: 959px){
    #search-container {
        min-height: 46px;
        height: 46px;
        margin-top: 40px;
    }

    #search-all-button {
        width: 50%!important;
        height: 30px!important;
        font-size: 16px!important;
        padding-top: 4px!important;
    }
}

@media screen and (max-width: 1024px){
    #search-container{
        max-height: 58px;
        height: 58px;
        margin-bottom: 20px;
    }

    #search-container > div {
        margin-top: 5px!important;
        margin-bottom: 8px!important;
    }
}

@media screen and (min-width: 1200px) and (max-width: 1440px){
    #search-container{
        height: 58px;
        margin-bottom: 20px;
    }

    #search-container > div {
        margin-top: 0px!important;
    }
}