.flickity-viewport{overflow:visible!important}
[data-isotope]{gap:1.25rem}
#deptServ .btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show>.btn-outline-primary.dropdown-toggle {
    color: #fff!important;
    background-color: var(--bs-highlight);
    z-index:10;
    position:relative;
    transition:.5s all ease-in-out;
    overflow:visible;
    border-radius:.25rem;
    border-color:var(--bs-light);
    box-shadow:0 4px 9px 1px var(--bs-highlight-300);
}
#mainServices button:before {
    content: "\A";
    bottom: -55px;
    transition: bottom .3s ease-in-out;
    width: 0;
    height: 0;
    border-left: 2.5rem solid transparent;
    border-right: 2.5rem solid transparent;
    border-top: 2rem solid transparent;
    position: absolute;
    top: unset;
    left: calc(50% - 2.5rem);
    border-bottom: 2rem solid transparent;
}
#mainServices button:not(.dropdown-toggle):not(.dropdown-item).active:before {
    border-bottom: .75rem solid var(--bs-primary);
    border-top: 0 solid transparent;
    bottom: -1.66rem;
}
#mainServices .btn:not(.active) {
    border-radius:.25rem;
    font-weight:bold;
}
#mainServices .btn:not(.active):before {
    border: 0;
}
#mainServices .btn:not(.active):hover, #mainServices .btn:not(.active):focus {background: rgba(var(--bs-primary-rgb),.9);color: #fff!important;}
#mainServices button.active, #mainServices button:hover, #mainServices button:focus {box-shadow: none;}
#mainServices button:focus{outline:3px solid;}

#mainServices .flickity-page-dots{
    bottom:-6px;
    display:grid;
    gap:1rem;
    place-content:center;
    grid-auto-flow:column
}
#mainServices .flickity-page-dots .dot {
    background: var(--bs-highlight-600);
    margin: unset;
}
#mainServices .flickity-viewport:before {
    content: '';
    width: 10%;
    max-width:100px;
    height: 100%;
    position: absolute;
    z-index: 1;
    left: -1rem;
    background: linear-gradient(90deg, rgb(255 255 255 / 90%) 50%, transparent 100%);
}
#mainServices .flickity-viewport:after {
    content: '';
    width: 10%;
    max-width:100px;
    height: 100%;
    position: absolute;
    z-index: 1;
    right: -1rem;
    background: linear-gradient(90deg, transparent 0%, rgb(255 255 255 / 90%) 50%);
}

#mainServices [data-flickity] .btn {
  width: max-content;
  min-width: 10%;
  height: 50px;
  border-radius: 0px;
  margin:0;
}

#mainServices [data-flickity] .btn:not(.is-selected) {
  border-color: var(--bs-btn-disabled-border-color);
  box-shadow: 4px 4px 17px -36px #b1b1b1;
  text-decoration: none;
}

.btn {
    align-items: center;
}

.deptServPanel:not(.unset) {z-index: -9999}

#deptServ .card {
    background: -moz-radial-gradient(center, ellipse cover, rgb(58 97 145) 0%, rgb(26,66,120) 60%);
    background: -webkit-radial-gradient(center, ellipse cover, rgb(58 97 145) 0%,rgb(26,66,120) 60%);
    background: radial-gradient(ellipse at center, rgb(58 97 145) 0%,rgb(26,66,120) 120%);
    color: #fff;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    transition: background .25s ease-in;
    border: 1px solid hsl(200deg 96% 59% / 7%);
    border-radius: 1rem;
    text-decoration: none;
    box-shadow: 2px 6px 16px -9px #0d213c;
}

#deptServ .card:hover, #deptServ .card:focus {
    background: #217cba;
    background: hsl(213deg 60% 47%);
    text-decoration: none;
}

#deptServ .title:before {
    font-size: 3rem;
    display: inline-flex;
    margin-bottom:.75rem;
}

.deptServPanel {
    display: flex;
    max-height: 100%;
}

#deptServ .card-body p:after {
    content: "\A";
    border-bottom: 2px solid #12478f;
    margin: 0 auto;
    width: 100px;
    padding: 10px 0;
    display: block;
}

/* Sorts */
.quicksearch {
    margin: 0 !important;
    background: transparent;
    color: #fff;
    font-size: .875rem;
	flex:0 1 auto;
	border:none;
	padding: 0 .5rem;
	text-align: center;
	outline: none;
	width:100%;
}
.quicksearch::placeholder{color:#fff;font-size:clamp(.875rem, 14px, 1rem)}
.quicksearch::-webkit-input-placeholder {color:#fff;font-size:clamp(.875rem, 14px, 1rem)}
.quicksearch::-moz-placeholder {color:#fff;font-size:clamp(.875rem, 14px, 1rem)}
.quicksearch:-ms-input-placeholder {color:#fff;font-size:clamp(.875rem, 14px, 1rem)}
.quicksearch:-moz-placeholder {color:#fff;font-size:clamp(.875rem, 14px, 1rem)}

.sorts {max-width: 600px !important;}
.sorts button[data-sort-by="original-order"] {min-width: 105px}
.sorts .dropdown {
    flex: 1 1 auto;
    display: flex;
    text-align: center;
    flex-flow: row nowrap;
    justify-content: center;
    max-width: 210px;
    margin-left: -2px;
}
.sorts .dropdown .btn {
    border-radius: 0 .25rem .25rem 0;
}
.sorts .dropdown-menu .btn-dliGreen {font-size: 0rem}
.sorts .dropdown-menu .btn-dliGreen:not(.svgbg) {
    font-size: .8rem;
    white-space: normal !important;
    text-align: center;
    width:100%;
}
.btn span.svgbg {
    filter: contrast(0.25) brightness(1.75)
}
.unset {position: unset !important;}
.hidden.unset {display: none;}

.quicksearch {
    margin: 0 !important;
    background: transparent;
    color: #fff;
    font-size: .875rem;
    flex: 0 1 auto;
    border: none;
    padding: 0 0.5rem;
    text-align: center;
    outline: none;
    width: 100%;
}

@media only screen and (min-width:768px) {
	.department-services .btn-group:first-of-type>.btn:not(:first-child) {border-radius:0}
	.department-services .btn-group:first-of-type>.btn:last-child {margin-right: -1px}
	.currentPane:before {display: none;top:0;}
	.quicksearch {text-align: left}
}