/**********************************************
    celum documents container
 *********************************************/
.cl-celumdocuments .c4s-main .container-lg.bg-grey {
    padding-left: 20px;
    padding-right: 20px;
}

.cl-celumdocuments .c4s-main .container-lg.bg-grey .col-lg-3.d-lg-block {
    border-right: 2px solid var(--bs-white);
}

.cl-celumdocuments .c4s-category-teaser {
    position: relative;
}

.cl-celumdocuments .c4s-category-teaser .container-lg {
    box-shadow: 0 6px 4px -4px #00000029;
}

.cl-celumdocuments .c4s-documents-header-title {
    margin-bottom: 1rem;
}

.cl-celumdocuments #c4s-sidebar,
.cl-celumdocuments #c4s-content {
    margin-top: 2rem;
}

.cl-celumdocuments .category-list-content {
    padding: 0 15px;
}

@media (min-width: 992px) {
    .cl-celumdocuments .category-list-content {
        padding: 0 30px 0 10px;
    }
}

.cl-celumdocuments .category-list-content .container.list-container {
    padding: 0;
}

/**********************************************
    celum documents search box
 *********************************************/
#celumsearch {
    max-width: 700px;
    margin: auto;
}

.cl-celumdocuments .c4s-searchbar {
    margin-bottom: 2rem;
}

.cl-celumdocuments .c4s-searchbar ff-searchbox .form-control {
    border-style: solid ;
    border-width: 2px;
    border-color: #6ab5c0;
    padding-left: 20px;
    background-color: rgba(0,0,0,0);
}

.cl-celumdocuments .c4s-searchbar ff-searchbox.input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu) {
    border-top-right-radius: 2rem;
    border-bottom-right-radius: 2rem;
}

.cl-celumdocuments .c4s-searchbar ff-searchbox.input-group > .form-control:focus {
    z-index: inherit;
}

.cl-celumdocuments .c4s-searchbar ff-searchbox ff-searchbutton {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}

.cl-celumdocuments .c4s-searchbar ff-searchbox ff-searchbutton .btn i.fa {
    font-size: 1.25rem;
}

/**********************************************
    celum documents search box close button
 *********************************************/
#c4s-celumsearch-close {
    cursor: pointer;
    display: none;
    fill: #6ab5c0;
    height: 22px;
    position: absolute;
    right: 3rem;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
}

#c4s-celumsearch-close:hover {
    fill: #06508c;
}

/**********************************************
    celum documents search button
 *********************************************/
#celumsearch ff-searchbutton svg {
    fill: #6ab5c0;
    height: 25px;
}

#celumsearch ff-searchbutton svg:hover {
    fill: #06508c;
}

#celumsearch ff-searchbutton .btn.btn-primary {
    background-color: rgba(0,0,0,0);
    border: none;
    padding: 5px 10px 0.644rem;
    margin-right: 10px;
}

/**********************************************
    celum documents list header
 *********************************************/
.c4s-list-head-container .ff-sortbox {
    font-size: 0.8em;
}

@media (min-width: 576px) {
    .cl-celumdocuments .c4s-list-head-container {
        display: flex!important;
        font-size: 0.875rem;
    }
}

/**********************************************
    celum documents sort box
 *********************************************/
ff-sortbox .ffw-selected-container {
    font-weight: 600;
    color: var(--bs-secondary);
}

ff-sortbox .ffw-selected-container ff-sortbox-item::after {
    display: inline-block;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font: var(--fa-font-solid);
    content: "\f078";
    color: var(--bs-body-color);
}

ff-sortbox .ffw-dropdown-container {
    border: 1px solid var(--bs-secondary);
    padding: 5px 15px;
    box-shadow: 0 10px 15px 5px rgb(0 0 0 / 15%);
    transition: none;
    top: 30px;
    right: -15px;
    text-align: right;
    border-radius: 2em;
}

ff-sortbox .ffw-dropdown-container ff-sortbox-item {
    padding: 3px;
    font-size: 1rem;
}

/**********************************************
    celum documents empty search message
 *********************************************/
.cl-celumdocuments .c4s-list-empty-message {
    display: none;
    margin-bottom: 50px;
}

@media (min-width: 992px) {
    .cl-celumdocuments .c4s-list-empty-message {
        margin-bottom: 100px;
    }
}